feat(用户认证): 实现基于角色的页面跳转和登录状态检查
- 在App.vue中添加登录状态检查和用户信息获取 - 修改index.vue实现根据用户角色跳转到不同页面 - 更新pages.json调整底部导航栏和页面配置 - 优化user.js中的用户信息存储逻辑
This commit is contained in:
@@ -30,8 +30,10 @@
|
||||
},
|
||||
checkLogin() {
|
||||
if (!getToken()) {
|
||||
this.$tab.reLaunch('/pages/login')
|
||||
this.$tab.reLaunch('/pages/login')
|
||||
return;
|
||||
}
|
||||
this.$store.dispatch('GetInfo')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -45,7 +45,8 @@
|
||||
"path" : "pages/line/line",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "产线监控"
|
||||
"navigationBarTitleText" : "产线监控",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
// {
|
||||
@@ -110,7 +111,7 @@
|
||||
"list": [
|
||||
{
|
||||
"text": "产线",
|
||||
"pagePath": "pages/index",
|
||||
"pagePath": "pages/line/line",
|
||||
"selectedIconPath": "/static/images/tabbar/home_.png",
|
||||
"iconPath": "/static/images/tabbar/home.png"
|
||||
},
|
||||
@@ -125,13 +126,13 @@
|
||||
"pagePath": "pages/mine/index",
|
||||
"selectedIconPath": "/static/images/tabbar/mine_.png",
|
||||
"iconPath": "/static/images/tabbar/mine.png"
|
||||
},
|
||||
{
|
||||
"text": "扫码2",
|
||||
"pagePath": "pages/easycode/easycode",
|
||||
"selectedIconPath": "/static/images/tabbar/work_.png",
|
||||
"iconPath": "/static/images/tabbar/work.png"
|
||||
}
|
||||
// {
|
||||
// "text": "扫码2",
|
||||
// "pagePath": "pages/easycode/easycode",
|
||||
// "selectedIconPath": "/static/images/tabbar/work_.png",
|
||||
// "iconPath": "/static/images/tabbar/work.png"
|
||||
// }
|
||||
|
||||
]
|
||||
},
|
||||
|
||||
@@ -51,7 +51,7 @@
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
getDicts('easycode_type').then(res => {
|
||||
getDicts('action_type').then(res => {
|
||||
this.types = res.data
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="production-page">
|
||||
<!-- <view class="production-page">
|
||||
|
||||
<klp-header @lineChange="setActive" class="line-header"></klp-header>
|
||||
|
||||
@@ -10,42 +10,74 @@
|
||||
<Zinc2 v-else-if="active == 3"></Zinc2>
|
||||
<Zinc3 v-else-if="active == 4"></Zinc3>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Acidity from '@/components/lines/acidity.vue'
|
||||
import Paint from '@/components/lines/paint.vue'
|
||||
import Zinc1 from '@/components/lines/zinc1.vue'
|
||||
import Zinc2 from '@/components/lines/zinc2.vue'
|
||||
import Zinc3 from '@/components/lines/zinc3.vue'
|
||||
|
||||
// 根据不同的全责跳转到不同的页面
|
||||
// 如果是工人跳转到扫码页面
|
||||
// 如果是管理员跳转到产线
|
||||
export default {
|
||||
components: {
|
||||
Acidity,
|
||||
Paint,
|
||||
Zinc1,
|
||||
Zinc2,
|
||||
Zinc3
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
active: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
next() {
|
||||
if (this.active >= 5) {
|
||||
this.active = 0
|
||||
} else {
|
||||
this.active += 1
|
||||
created() {
|
||||
// 检查用户角色
|
||||
this.$store.dispatch('GetInfo').then(res => {
|
||||
const roles = res.data.roles;
|
||||
|
||||
if (roles.includes('admin')) {
|
||||
// 管理员角色,跳转到产线页面
|
||||
uni.switchTab({
|
||||
url: '/pages/line/line'
|
||||
});
|
||||
} else if (roles.includes('worker')) {
|
||||
// 工人角色,跳转到扫码页面
|
||||
uni.navigateTo({
|
||||
url: '/pages/easycode/easycode'
|
||||
});
|
||||
}
|
||||
},
|
||||
setActive({ index, line }) {
|
||||
this.active = index;
|
||||
}
|
||||
// else {
|
||||
// // 其他角色,跳转到扫码页面
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/easycode/easycode'
|
||||
// });
|
||||
// }
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// import Acidity from '@/components/lines/acidity.vue'
|
||||
// import Paint from '@/components/lines/paint.vue'
|
||||
// import Zinc1 from '@/components/lines/zinc1.vue'
|
||||
// import Zinc2 from '@/components/lines/zinc2.vue'
|
||||
// import Zinc3 from '@/components/lines/zinc3.vue'
|
||||
|
||||
// export default {
|
||||
// components: {
|
||||
// Acidity,
|
||||
// Paint,
|
||||
// Zinc1,
|
||||
// Zinc2,
|
||||
// Zinc3
|
||||
// },
|
||||
// data() {
|
||||
// return {
|
||||
// active: 0
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// next() {
|
||||
// if (this.active >= 5) {
|
||||
// this.active = 0
|
||||
// } else {
|
||||
// this.active += 1
|
||||
// }
|
||||
// },
|
||||
// setActive({ index, line }) {
|
||||
// this.active = index;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@@ -1,112 +1,131 @@
|
||||
import config from '@/config'
|
||||
import storage from '@/utils/storage'
|
||||
import constant from '@/utils/constant'
|
||||
import { isHttp, isEmpty } from "@/utils/validate"
|
||||
import { login, logout, getInfo } from '@/api/login'
|
||||
import { getToken, setToken, removeToken } from '@/utils/auth'
|
||||
import {
|
||||
isHttp,
|
||||
isEmpty
|
||||
} from "@/utils/validate"
|
||||
import {
|
||||
login,
|
||||
logout,
|
||||
getInfo
|
||||
} from '@/api/login'
|
||||
import {
|
||||
getToken,
|
||||
setToken,
|
||||
removeToken
|
||||
} from '@/utils/auth'
|
||||
import defAva from '@/static/images/avatar.png'
|
||||
|
||||
const baseUrl = config.baseUrl
|
||||
|
||||
const user = {
|
||||
state: {
|
||||
token: getToken(),
|
||||
id: storage.get(constant.id),
|
||||
name: storage.get(constant.name),
|
||||
avatar: storage.get(constant.avatar),
|
||||
roles: storage.get(constant.roles),
|
||||
permissions: storage.get(constant.permissions)
|
||||
},
|
||||
state: {
|
||||
token: getToken(),
|
||||
id: storage.get(constant.id),
|
||||
name: storage.get(constant.name),
|
||||
avatar: storage.get(constant.avatar),
|
||||
roles: storage.get(constant.roles),
|
||||
permissions: storage.get(constant.permissions)
|
||||
},
|
||||
|
||||
mutations: {
|
||||
SET_TOKEN: (state, token) => {
|
||||
state.token = token
|
||||
},
|
||||
SET_ID: (state, id) => {
|
||||
state.id = id
|
||||
storage.set(constant.id, id)
|
||||
},
|
||||
SET_NAME: (state, name) => {
|
||||
state.name = name
|
||||
storage.set(constant.name, name)
|
||||
},
|
||||
SET_AVATAR: (state, avatar) => {
|
||||
state.avatar = avatar
|
||||
storage.set(constant.avatar, avatar)
|
||||
},
|
||||
SET_ROLES: (state, roles) => {
|
||||
state.roles = roles
|
||||
storage.set(constant.roles, roles)
|
||||
},
|
||||
SET_PERMISSIONS: (state, permissions) => {
|
||||
state.permissions = permissions
|
||||
storage.set(constant.permissions, permissions)
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
SET_TOKEN: (state, token) => {
|
||||
state.token = token
|
||||
},
|
||||
SET_ID: (state, id) => {
|
||||
state.id = id
|
||||
storage.set(constant.id, id)
|
||||
},
|
||||
SET_NAME: (state, name) => {
|
||||
state.name = name
|
||||
storage.set(constant.name, name)
|
||||
},
|
||||
SET_AVATAR: (state, avatar) => {
|
||||
state.avatar = avatar
|
||||
storage.set(constant.avatar, avatar)
|
||||
},
|
||||
SET_ROLES: (state, roles) => {
|
||||
state.roles = roles
|
||||
storage.set(constant.roles, roles)
|
||||
},
|
||||
SET_PERMISSIONS: (state, permissions) => {
|
||||
state.permissions = permissions
|
||||
storage.set(constant.permissions, permissions)
|
||||
}
|
||||
},
|
||||
|
||||
actions: {
|
||||
// 登录
|
||||
Login({ commit }, userInfo) {
|
||||
const username = userInfo.username.trim()
|
||||
const password = userInfo.password
|
||||
const code = userInfo.code
|
||||
const uuid = userInfo.uuid
|
||||
return new Promise((resolve, reject) => {
|
||||
login(username, password, code, uuid).then(res => {
|
||||
actions: {
|
||||
// 登录
|
||||
Login({
|
||||
commit
|
||||
}, userInfo) {
|
||||
const username = userInfo.username.trim()
|
||||
const password = userInfo.password
|
||||
const code = userInfo.code
|
||||
const uuid = userInfo.uuid
|
||||
return new Promise((resolve, reject) => {
|
||||
login(username, password, code, uuid).then(res => {
|
||||
console.log('token', res)
|
||||
setToken(res.data.token)
|
||||
commit('SET_TOKEN', res.data.token)
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
setToken(res.data.token)
|
||||
commit('SET_TOKEN', res.data.token)
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 获取用户信息
|
||||
GetInfo({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getInfo().then(res => {
|
||||
// 获取用户信息
|
||||
GetInfo({
|
||||
commit,
|
||||
state
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getInfo().then(res => {
|
||||
console.log('个人信息', res)
|
||||
const user = res.data.user
|
||||
let avatar = user.avatar || ""
|
||||
if (!isHttp(avatar)) {
|
||||
avatar = (isEmpty(avatar)) ? defAva : baseUrl + avatar
|
||||
}
|
||||
const userid = (isEmpty(user) || isEmpty(user.userId)) ? "" : user.userId
|
||||
const username = (isEmpty(user) || isEmpty(user.userName)) ? "" : user.userName
|
||||
if (res.roles && res.roles.length > 0) {
|
||||
commit('SET_ROLES', res.roles)
|
||||
commit('SET_PERMISSIONS', res.permissions)
|
||||
} else {
|
||||
commit('SET_ROLES', ['ROLE_DEFAULT'])
|
||||
}
|
||||
commit('SET_ID', userid)
|
||||
commit('SET_NAME', username)
|
||||
commit('SET_AVATAR', avatar)
|
||||
resolve(res)
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
const user = res.data.user
|
||||
let avatar = user.avatar || ""
|
||||
if (!isHttp(avatar)) {
|
||||
avatar = (isEmpty(avatar)) ? defAva : baseUrl + avatar
|
||||
}
|
||||
const userid = (isEmpty(user) || isEmpty(user.userId)) ? "" : user.userId
|
||||
const username = (isEmpty(user) || isEmpty(user.userName)) ? "" : user.userName
|
||||
if (res.roles && res.roles.length > 0) {
|
||||
commit('SET_ROLES', res.roles)
|
||||
commit('SET_PERMISSIONS', res.permissions)
|
||||
} else {
|
||||
commit('SET_ROLES', ['ROLE_DEFAULT'])
|
||||
}
|
||||
commit('SET_ID', userid)
|
||||
commit('SET_NAME', username)
|
||||
commit('SET_AVATAR', avatar)
|
||||
resolve(res)
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 退出系统
|
||||
LogOut({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token).then(() => {
|
||||
commit('SET_TOKEN', '')
|
||||
commit('SET_ROLES', [])
|
||||
commit('SET_PERMISSIONS', [])
|
||||
removeToken()
|
||||
storage.clean()
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
// 退出系统
|
||||
LogOut({
|
||||
commit,
|
||||
state
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token).then(() => {
|
||||
commit('SET_TOKEN', '')
|
||||
commit('SET_ROLES', [])
|
||||
commit('SET_PERMISSIONS', [])
|
||||
removeToken()
|
||||
storage.clean()
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default user
|
||||
export default user
|
||||
Reference in New Issue
Block a user