297 lines
7.6 KiB
JavaScript
297 lines
7.6 KiB
JavaScript
import * as DT from 'dt-sdk'
|
|
import moment from 'moment'
|
|
import { constantRoutes } from '@/router'
|
|
import { mapMutations, mapGetters, mapActions } from 'vuex'
|
|
import ChangePassword from '@/layout/components/change-password/index.vue'
|
|
import { getTreeAllItems, judgeArrayRepeat } from '@/utils'
|
|
export default {
|
|
name: 'Header',
|
|
components: { ChangePassword },
|
|
data() {
|
|
const validateUsername = (rule, value, callback) => {
|
|
// if (!validUsername(value)) {
|
|
// callback(new Error("请输入正确的用户名"));
|
|
// } else {
|
|
// callback();
|
|
// }
|
|
callback()
|
|
}
|
|
const validatePassword = (rule, value, callback) => {
|
|
if (value.length < 6) {
|
|
callback(new Error('密码不少于6位字符'))
|
|
} else {
|
|
callback()
|
|
}
|
|
}
|
|
return {
|
|
tokenKey: window.config.tokenKey,
|
|
current: this.$route.path,
|
|
currentRoute: '',
|
|
permissionRoutes: [],
|
|
blackList: ['/', '/login'], // 路由黑名单，不创建导航的路由
|
|
activeBar: {
|
|
pos: 0,
|
|
width: 10
|
|
},
|
|
userInfo: {
|
|
name: 'Admin',
|
|
photo: require('@/assets/img/common/user-default.png')
|
|
},
|
|
currentSceneId: null, // 当前场景 ID
|
|
roleIdsLocale: [],
|
|
visible: {
|
|
login: false,
|
|
changePassword: false
|
|
},
|
|
// 用户登录
|
|
loginForm: {
|
|
username: '',
|
|
password: ''
|
|
},
|
|
loginRules: {
|
|
username: [
|
|
// { required: true, trigger: 'blur', validator: validateUsername }
|
|
{ required: true, message: '请输入用户名', trigger: 'blur' }
|
|
],
|
|
password: [
|
|
{ required: true, trigger: 'blur', validator: validatePassword }
|
|
]
|
|
},
|
|
passwordType: 'password',
|
|
capsTooltip: false,
|
|
loading: false,
|
|
showDialog: false,
|
|
redirect: undefined,
|
|
otherQuery: {},
|
|
bjTime2: '',
|
|
activeIndex: '1',
|
|
menus: [
|
|
{
|
|
label: "设备管理",
|
|
value: '2',
|
|
show: true
|
|
},
|
|
{
|
|
label: "任务管理",
|
|
value: '3',
|
|
show: true
|
|
},
|
|
{
|
|
label: "图片管理",
|
|
value: '4',
|
|
show: true
|
|
},
|
|
{
|
|
label: "用户管理",
|
|
value: '5',
|
|
show: true
|
|
},
|
|
]
|
|
}
|
|
},
|
|
computed: {
|
|
...mapGetters([
|
|
'currentTime',
|
|
'username',
|
|
'userId',
|
|
'sceneList',
|
|
'sceneId',
|
|
'sceneInfo',
|
|
'routerArr',
|
|
'roleIds',
|
|
'menusChose'
|
|
]),
|
|
/**
|
|
* 北京时间
|
|
* @author wangxueshen
|
|
* @date 2022-04-19
|
|
* @returns {any}
|
|
*/
|
|
bjTime() {
|
|
if (this.currentTime != '') {
|
|
return moment(this.currentTime).format('YYYY-MM-DD HH:mm:ss')
|
|
} else {
|
|
return moment().format('YYYY-MM-DD HH:mm:ss')
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
roleIds: {
|
|
handler: function (nv) {
|
|
this.roleIdsLocale = nv
|
|
},
|
|
immediate: true
|
|
},
|
|
menusChose: {
|
|
handler: function (nv) {
|
|
this.activeIndex = nv
|
|
},
|
|
immediate: true
|
|
},
|
|
|
|
/**
|
|
* 路由地址变化赋值给 current
|
|
* @author wangxueshen
|
|
* @date 2020-10-12
|
|
* @param {string} val 路由地址
|
|
* @returns {any}
|
|
*/
|
|
'$route.path'(val) {
|
|
// console.log(val)
|
|
this.current = val
|
|
}
|
|
},
|
|
created() {
|
|
this.permissionRoutes = constantRoutes.filter(el => el.name)
|
|
},
|
|
mounted() {
|
|
if (this.$refs.nav) {
|
|
this.currentRoute = [].find.call(this.$refs.nav.children, li =>
|
|
li.children[0].className.includes('active')
|
|
)
|
|
let { offsetWidth, offsetLeft } = this.currentRoute.children[0]
|
|
this.activeBar = {
|
|
pos: offsetLeft - 20,
|
|
width: offsetWidth
|
|
}
|
|
}
|
|
setInterval(() => {
|
|
this.bjTime2 = moment().format('YYYY-MM-DD HH:mm:ss')
|
|
}, 1000)
|
|
// if (!this.username) {
|
|
// this.SET_USER_ID(localStorage.getItem('userId'))
|
|
// this.SET_USERNAME(localStorage.getItem('username'))
|
|
// console.log('刷新自己取', localStorage.getItem('userId'), localStorage.getItem('username'))
|
|
// }
|
|
if (this.username !== 'admin') {
|
|
this.menus[3].show = false
|
|
}
|
|
},
|
|
methods: {
|
|
...mapActions('user', ['logout', 'loginByTourist']),
|
|
...mapActions('app', ['reload']),
|
|
...mapMutations('app', ['SET_SCENE_ID', 'SET_SCENE_INFO', 'SET_MENUS_CHOSE']),
|
|
...mapMutations('user', ['SET_ROLES', 'SET_USER_ID', 'SET_USERNAME']),
|
|
handleSelect(key) {
|
|
this.SET_MENUS_CHOSE(key)
|
|
},
|
|
goHome() {
|
|
this.SET_MENUS_CHOSE('1')
|
|
},
|
|
/**
|
|
* 场景 ID 改变事件
|
|
* @author wangxueshen
|
|
* @date 2022-05-09
|
|
* @param {any} val
|
|
* @returns {any}
|
|
*/
|
|
currentSceneIdChange(val) {
|
|
// 更新 store 中的场景 ID
|
|
this.SET_SCENE_ID(val)
|
|
this.SET_SCENE_INFO(undefined)
|
|
// 刷新页面
|
|
this.reload()
|
|
},
|
|
/**
|
|
* 导航点击事件
|
|
* @author wangxueshen
|
|
* @date 2022-05-09
|
|
* @param {any} e
|
|
* @returns {any}
|
|
*/
|
|
navClick(e, parentClass) {
|
|
this.current = this.$route.path
|
|
const target = parentClass ? document.getElementsByClassName(parentClass)[0] : e.target
|
|
let { offsetWidth, offsetLeft } = target
|
|
this.activeBar = {
|
|
pos: offsetLeft - 20,
|
|
width: offsetWidth
|
|
}
|
|
},
|
|
/**
|
|
* 用户相关指令操作
|
|
* @author WZW
|
|
* @date 2022-04-21
|
|
* @param {any} type
|
|
* @returns {any}
|
|
*/
|
|
handleCommand(type) {
|
|
switch (type) {
|
|
case 'modifyPassword':
|
|
this.visible.changePassword = true
|
|
break
|
|
case 'logout':
|
|
this.loading = true
|
|
this.logout({ userId: this.userId, terminal: 0 }).then(() => {
|
|
location.reload()
|
|
// this.loginByTourist().then(() => {
|
|
// this.$router.push('/')
|
|
// })
|
|
})
|
|
break
|
|
}
|
|
},
|
|
|
|
/********************* 用户登录方法 *******************************/
|
|
showLogin() {
|
|
this.visible.login = true
|
|
},
|
|
checkCapslock(e) {
|
|
const { key } = e
|
|
this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z'
|
|
},
|
|
showPwd() {
|
|
if (this.passwordType === 'password') {
|
|
this.passwordType = ''
|
|
} else {
|
|
this.passwordType = 'password'
|
|
}
|
|
this.$nextTick(() => {
|
|
this.$refs.password.focus()
|
|
})
|
|
},
|
|
handleLogin() {
|
|
this.$refs.loginForm.validate(valid => {
|
|
if (valid) {
|
|
this.loading = true
|
|
this.$store
|
|
.dispatch('user/login', this.loginForm)
|
|
.then(() => {
|
|
// this.loading = false
|
|
location.reload()
|
|
// TODO 清空游客信息，这样才会拿登录菜单
|
|
// sessionStorage.removeItem('routerArr')
|
|
// this.SET_ROUTER_ARR([])
|
|
// this.reload()
|
|
// this.$router.push({
|
|
// path: '/',
|
|
// })
|
|
// this.$router.push({
|
|
// path: this.redirect || '/',
|
|
// query: this.otherQuery
|
|
// })
|
|
})
|
|
.catch(() => {
|
|
this.loading = false
|
|
})
|
|
} else {
|
|
console.log('error submit!!')
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
getOtherQuery(query) {
|
|
return Object.keys(query).reduce((acc, cur) => {
|
|
if (cur !== 'redirect') {
|
|
acc[cur] = query[cur]
|
|
}
|
|
return acc
|
|
}, {})
|
|
}
|
|
},
|
|
beforeDestroy() { },
|
|
|
|
/************************登录与修改密码************************/
|
|
afterLoginClose() { }
|
|
}
|