DeXun/klp-mono
9
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(用户认证): 实现基于角色的页面跳转和登录状态检查

Browse Source 
- 在App.vue中添加登录状态检查和用户信息获取
- 修改index.vue实现根据用户角色跳转到不同页面
- 更新pages.json调整底部导航栏和页面配置
- 优化user.js中的用户信息存储逻辑
This commit is contained in:
砂糖
2025-11-03 14:52:41 +08:00
parent d677c293e8
commit 42d858bc6b
5 changed files with 190 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/hand-factory/App.vue
View File

@@ -30,8 +30,10 @@
}, },
checkLogin() { checkLogin() {
if (!getToken()) { if (!getToken()) {
this.$tab.reLaunch('/pages/login') this.$tab.reLaunch('/pages/login')
return;
} }
this.$store.dispatch('GetInfo')
} }
} }
} }

17
apps/hand-factory/pages.json
View File

@@ -45,7 +45,8 @@
"path" : "pages/line/line", "path" : "pages/line/line",
"style" : "style" :
{ {
"navigationBarTitleText" : "产线监控" "navigationBarTitleText" : "产线监控",
"navigationStyle": "custom"
} }
} }
// { // {
@@ -110,7 +111,7 @@
"list": [ "list": [
{ {
"text": "产线", "text": "产线",
"pagePath": "pages/index", "pagePath": "pages/line/line",
"selectedIconPath": "/static/images/tabbar/home_.png", "selectedIconPath": "/static/images/tabbar/home_.png",
"iconPath": "/static/images/tabbar/home.png" "iconPath": "/static/images/tabbar/home.png"
}, },
@@ -125,13 +126,13 @@
"pagePath": "pages/mine/index", "pagePath": "pages/mine/index",
"selectedIconPath": "/static/images/tabbar/mine_.png", "selectedIconPath": "/static/images/tabbar/mine_.png",
"iconPath": "/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"
// }
] ]
}, },

2
apps/hand-factory/pages/easycode/easycode.vue
View File

@@ -51,7 +51,7 @@
} }
}, },
mounted() { mounted() {
getDicts('easycode_type').then(res => { getDicts('action_type').then(res => {
this.types = res.data this.types = res.data
}) })
} }

92
apps/hand-factory/pages/index.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<view class="production-page"> <!-- <view class="production-page">
<klp-header @lineChange="setActive" class="line-header"></klp-header> <klp-header @lineChange="setActive" class="line-header"></klp-header>
@@ -10,42 +10,74 @@
<Zinc2 v-else-if="active == 3"></Zinc2> <Zinc2 v-else-if="active == 3"></Zinc2>
<Zinc3 v-else-if="active == 4"></Zinc3> <Zinc3 v-else-if="active == 4"></Zinc3>
</view> </view>
</view> </view> -->
</template> </template>
<script> <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 { export default {
components: { created() {
Acidity, // 检查用户角色
Paint, this.$store.dispatch('GetInfo').then(res => {
Zinc1, const roles = res.data.roles;
Zinc2,
Zinc3 if (roles.includes('admin')) {
}, // 管理员角色，跳转到产线页面
data() { uni.switchTab({
return { url: '/pages/line/line'
active: 0 });
} } else if (roles.includes('worker')) {
}, // 工人角色，跳转到扫码页面
methods: { uni.navigateTo({
next() { url: '/pages/easycode/easycode'
if (this.active >= 5) { });
this.active = 0
} else {
this.active += 1
} }
}, // else {
setActive({ index, line }) { // // 其他角色，跳转到扫码页面
this.active = index; // 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> </script>
<style scoped lang="scss"> <style scoped lang="scss">

211
apps/hand-factory/store/modules/user.js
View File

@@ -1,112 +1,131 @@
import config from '@/config' import config from '@/config'
import storage from '@/utils/storage' import storage from '@/utils/storage'
import constant from '@/utils/constant' import constant from '@/utils/constant'
import { isHttp, isEmpty } from "@/utils/validate" import {
import { login, logout, getInfo } from '@/api/login' isHttp,
import { getToken, setToken, removeToken } from '@/utils/auth' 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' import defAva from '@/static/images/avatar.png'
const baseUrl = config.baseUrl const baseUrl = config.baseUrl
const user = { const user = {
state: { state: {
token: getToken(), token: getToken(),
id: storage.get(constant.id), id: storage.get(constant.id),
name: storage.get(constant.name), name: storage.get(constant.name),
avatar: storage.get(constant.avatar), avatar: storage.get(constant.avatar),
roles: storage.get(constant.roles), roles: storage.get(constant.roles),
permissions: storage.get(constant.permissions) permissions: storage.get(constant.permissions)
}, },
mutations: { mutations: {
SET_TOKEN: (state, token) => { SET_TOKEN: (state, token) => {
state.token = token state.token = token
}, },
SET_ID: (state, id) => { SET_ID: (state, id) => {
state.id = id state.id = id
storage.set(constant.id, id) storage.set(constant.id, id)
}, },
SET_NAME: (state, name) => { SET_NAME: (state, name) => {
state.name = name state.name = name
storage.set(constant.name, name) storage.set(constant.name, name)
}, },
SET_AVATAR: (state, avatar) => { SET_AVATAR: (state, avatar) => {
state.avatar = avatar state.avatar = avatar
storage.set(constant.avatar, avatar) storage.set(constant.avatar, avatar)
}, },
SET_ROLES: (state, roles) => { SET_ROLES: (state, roles) => {
state.roles = roles state.roles = roles
storage.set(constant.roles, roles) storage.set(constant.roles, roles)
}, },
SET_PERMISSIONS: (state, permissions) => { SET_PERMISSIONS: (state, permissions) => {
state.permissions = permissions state.permissions = permissions
storage.set(constant.permissions, permissions) storage.set(constant.permissions, permissions)
} }
}, },
actions: { actions: {
// 登录 // 登录
Login({ commit }, userInfo) { Login({
const username = userInfo.username.trim() commit
const password = userInfo.password }, userInfo) {
const code = userInfo.code const username = userInfo.username.trim()
const uuid = userInfo.uuid const password = userInfo.password
return new Promise((resolve, reject) => { const code = userInfo.code
login(username, password, code, uuid).then(res => { const uuid = userInfo.uuid
return new Promise((resolve, reject) => {
login(username, password, code, uuid).then(res => {
console.log('token', res) console.log('token', res)
setToken(res.data.token) setToken(res.data.token)
commit('SET_TOKEN', res.data.token) commit('SET_TOKEN', res.data.token)
resolve() resolve()
}).catch(error => { }).catch(error => {
reject(error) reject(error)
}) })
}) })
}, },
// 获取用户信息 // 获取用户信息
GetInfo({ commit, state }) { GetInfo({
return new Promise((resolve, reject) => { commit,
getInfo().then(res => { state
}) {
return new Promise((resolve, reject) => {
getInfo().then(res => {
console.log('个人信息', res) console.log('个人信息', res)
const user = res.data.user const user = res.data.user
let avatar = user.avatar || "" let avatar = user.avatar || ""
if (!isHttp(avatar)) { if (!isHttp(avatar)) {
avatar = (isEmpty(avatar)) ? defAva : baseUrl + avatar avatar = (isEmpty(avatar)) ? defAva : baseUrl + avatar
} }
const userid = (isEmpty(user) || isEmpty(user.userId)) ? "" : user.userId const userid = (isEmpty(user) || isEmpty(user.userId)) ? "" : user.userId
const username = (isEmpty(user) || isEmpty(user.userName)) ? "" : user.userName const username = (isEmpty(user) || isEmpty(user.userName)) ? "" : user.userName
if (res.roles && res.roles.length > 0) { if (res.roles && res.roles.length > 0) {
commit('SET_ROLES', res.roles) commit('SET_ROLES', res.roles)
commit('SET_PERMISSIONS', res.permissions) commit('SET_PERMISSIONS', res.permissions)
} else { } else {
commit('SET_ROLES', ['ROLE_DEFAULT']) commit('SET_ROLES', ['ROLE_DEFAULT'])
} }
commit('SET_ID', userid) commit('SET_ID', userid)
commit('SET_NAME', username) commit('SET_NAME', username)
commit('SET_AVATAR', avatar) commit('SET_AVATAR', avatar)
resolve(res) resolve(res)
}).catch(error => { }).catch(error => {
reject(error) reject(error)
}) })
}) })
}, },
// 退出系统 // 退出系统
LogOut({ commit, state }) { LogOut({
return new Promise((resolve, reject) => { commit,
logout(state.token).then(() => { state
commit('SET_TOKEN', '') }) {
commit('SET_ROLES', []) return new Promise((resolve, reject) => {
commit('SET_PERMISSIONS', []) logout(state.token).then(() => {
removeToken() commit('SET_TOKEN', '')
storage.clean() commit('SET_ROLES', [])
resolve() commit('SET_PERMISSIONS', [])
}).catch(error => { removeToken()
reject(error) storage.clean()
}) resolve()
}) }).catch(error => {
} reject(error)
} })
})
}
}
} }
export default user export default user