7.26 重构权限代码

src/directives/permission.js

@@ -3,16 +3,10 @@ import $store from '@/store'
 
 function check(el, binding) {
   const { value } = binding
-  const userInfo = $store.getters && $store.getters.userInfo
+  const roles = $store.getters && $store.getters.roles
   if (value && value instanceof Array) {
     if (value.length > 0) {
-      let roles = []
       const permissionRoles = value
-      if (userInfo.type === 1) {
-        roles = ['admin'] // 供应商
-      } else if (userInfo.type === 2) {
-        roles = ['salesman'] // 业务员
-      }
       const hasPermission = roles.some(role => permissionRoles.includes(role))
       if (!hasPermission) {
         el.parentNode && el.parentNode.removeChild(el)

src/permission.js

@@ -29,28 +29,21 @@ router.beforeEach(async(to, from, next) => {
       if ($store.getters.addRouters.length && to.name !== null) {
         next()
       } else {
-        const userInfo = await $store.dispatch('user/ActionUserInfo')
-        $store.dispatch('permission/GenerateRoutes', userInfo).then(() => { // 生成可访问的路由表
-          router.addRoutes($store.getters.addRouters) // 动态添加可访问路由表
-          router.options.routes = $store.getters.addRouters
-          next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
-        })
+        try {
+          const roles = $store.getters && $store.getters.roles
+          $store.dispatch('permission/GenerateRoutes', roles).then(() => { // 生成可访问的路由表
+            router.addRoutes($store.getters.addRouters) // 动态添加可访问路由表
+            router.options.routes = $store.getters.addRouters
+            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
+          })
+        } catch (error) {
+          // remove token and go to login page to re-login
+          await $store.dispatch('user/resetToken')
+          Message.error(error || 'Has Error')
+          next(`/login?redirect=${to.path}`)
+          NProgress.done()
+        }
       }
-      // try {
-      //   const userInfo = await $store.dispatch('user/ActionUserInfo')
-      //   $store.dispatch('permission/GenerateRoutes', userInfo).then(() => { // 生成可访问的路由表
-      //     router.addRoutes($store.getters.addRouters) // 动态添加可访问路由表
-      //     router.options.routes = $store.getters.addRouters
-      //     next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
-      //   })
-      //   next()
-      // } catch (error) {
-      //   // remove token and go to login page to re-login
-      //   await $store.dispatch('user/resetToken')
-      //   Message.error(error || 'Has Error')
-      //   next(`/login?redirect=${to.path}`)
-      //   NProgress.done()
-      // }
       // const hasGetUserInfo = $store.getters.name
       // if (hasGetUserInfo) {
       //   next()

src/router/index.js

@@ -3,7 +3,6 @@ import Router from 'vue-router'
 
 Vue.use(Router)
 import Layout from '@/layout'
-
 export const constantRouterMap = [
   {
     path: '/',
@@ -43,7 +42,7 @@ export const asyncRouterMap = [
     path: '/contracts',
     component: Layout,
     name: 'Example',
-    meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin','salesman'] },
+    meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin', 'salesman', 'supplier'] },
     redirect: {
       name: 'contracts'
     },
@@ -52,22 +51,21 @@ export const asyncRouterMap = [
         path: 'list',
         name: 'contracts-list',
         component: () => import('@/views/contracts/list'),
-        meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin','salesman'] },
+        meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin', 'salesman', 'supplier'] },
         hidden: true
       },
       {
         path: 'contracts',
         name: 'contracts',
         component: () => import('@/views/contracts/index'),
-        meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin','salesman'] }
+        meta: { title: '合同列表', icon: 'el-icon-s-order', roles: ['admin', 'salesman', 'supplier'] }
       },
       {
         path: '/detail',
         name: 'detail',
         component: () => import('@/views/contracts/detail'),
 
-
-        meta: { title: '合同详情', roles: ['admin','salesman'] },
+        meta: { title: '合同详情', roles: ['admin', 'salesman', 'supplier'] },
         hidden: true
       },
       // {
@@ -82,21 +80,21 @@ export const asyncRouterMap = [
         path: 'contracts/addnewbill',
         name: 'addnewbill',
         component: () => import('@/views/contracts/addnewbill'),
-        meta: { title: '新增汇票', roles: ['admin','salesman'] },
+        meta: { title: '新增汇票', roles: ['admin', 'salesman'] },
         hidden: true
       },
       {
         path: 'contracts/billDetail',
         name: 'billDetail',
         component: () => import('@/views/contracts/billDetail'),
-        meta: { title: '汇票详情', roles: ['admin','salesman'] },
+        meta: { title: '汇票详情', roles: ['admin', 'salesman'] },
         hidden: true
       },
       {
         path: 'contracts/addcontract',
         name: 'addcontract',
         component: () => import('@/views/contracts/new_file'),
-        meta: { title: '新增合同',roles: ['admin','salesman'] },
+        meta: { title: '新增合同', roles: ['admin', 'salesman'] },
         hidden: true
       }
     ]
@@ -107,26 +105,26 @@ export const asyncRouterMap = [
     component: Layout,
     redirect: '/table',
     name: 'Example',
-    meta: { title: '承兑人列表', icon: 'el-icon-s-help', roles: ['admin'] },
+    meta: { title: '承兑人列表', icon: 'el-icon-s-help', roles: ['admin', 'salesman'] },
     children: [
       {
         path: 'table',
         name: 'Table',
         component: () => import('@/views/table/index'),
-        meta: { title: '承兑人列表', icon: 'el-icon-s-help', roles: ['admin'] }
+        meta: { title: '承兑人列表', icon: 'el-icon-s-help', roles: ['admin', 'salesman'] }
       },
       {
         path: '/table/addAcceptor',
         name: 'Table',
         component: () => import('@/views/table/addAcceptor'),
-        meta: { title: '新增承兑人', roles: ['admin'] },
+        meta: { title: '新增承兑人', roles: ['admin', 'salesman'] },
         hidden: true
       },
       {
         path: 'table/detail',
         name: 'Table',
         component: () => import('@/views/table/detail'),
-        meta: { title: '承兑人详情', roles: ['admin'] },
+        meta: { title: '承兑人详情', roles: ['admin', 'salesman'] },
         hidden: true
       }
     ]
@@ -140,20 +138,20 @@ export const asyncRouterMap = [
         path: 'index',
         name: 'Form',
         component: () => import('@/views/form/index'),
-        meta: { title: '出票人列表', icon: 'form', roles: ['admin'] }
+        meta: { title: '出票人列表', icon: 'form', roles: ['salesman'] }
       },
       {
         path: '/form/addTicketdrawer',
         name: 'addTicketdrawer',
         component: () => import('@/views/form/addTicketdrawer'),
-        meta: { title: '新增出票人', roles: ['admin'] },
+        meta: { title: '新增出票人', roles: ['salesman'] },
         hidden: true
       },
       {
         path: '/form/detail',
         name: 'detail',
         component: () => import('@/views/form/detail'),
-        meta: { title: '出票人详情', roles: ['admin'] },
+        meta: { title: '出票人详情', roles: ['salesman'] },
         hidden: true
       }
     ]
@@ -166,13 +164,13 @@ export const asyncRouterMap = [
         path: 'index',
         name: 'delivery',
         component: () => import('@/views/delivery/index'),
-        meta: { title: '供应商账号', icon: 'el-icon-s-promotion', roles: ['admin'] }
+        meta: { title: '供应商账号', icon: 'el-icon-s-promotion', roles: ['salesman'] }
       },
       {
         path: '/edit',
         name: 'edit',
         component: () => import('@/views/delivery/edit'),
-        meta: { title: '编辑', roles: ['admin'] },
+        meta: { title: '编辑', roles: ['salesman'] },
         hidden: true
       }
     ]
@@ -185,27 +183,27 @@ export const asyncRouterMap = [
         path: '/shipments/index',
         name: 'shipments',
         component: () => import('@/views/shipments/index'),
-        meta: { title: '报表统计', icon: 'el-icon-s-marketing', roles: ['admin'] }
+        meta: { title: '报表统计', icon: 'el-icon-s-marketing', roles: ['salesman'] }
       },
       {
         path: '/shipments1',
         name: 'shipments1',
         component: () => import('@/views/shipments/shipments1'),
-        meta: { title: '出票人分类报表', roles: ['admin'] },
+        meta: { title: '出票人分类报表', roles: ['salesman'] },
         hidden: true
       },
       {
         path: '/shipments2',
         name: 'shipments2',
         component: () => import('@/views/shipments/shipments2'),
-        meta: { title: '合同统计列表', roles: ['admin'] },
+        meta: { title: '合同统计列表', roles: ['salesman'] },
         hidden: true
       },
       {
         path: '/shipments3',
         name: 'shipments3',
         component: () => import('@/views/shipments/shipments3'),
-        meta: { title: '供应商统计列表', roles: ['admin'] },
+        meta: { title: '供应商统计列表', roles: ['salesman'] },
         hidden: true
       }
 
@@ -269,7 +267,7 @@ export const asyncRouterMap = [
         path: 'index',
         name: 'mine',
         component: () => import('@/views/mine/index'),
-        meta: { title: '个人资料', icon: 'el-icon-s-custom', roles: ['admin','salesman'] }
+        meta: { title: '个人资料', icon: 'el-icon-s-custom', roles: ['admin', 'salesman', 'supplier'] }
       }
     ]
   },

src/store/getters.js

@@ -5,6 +5,7 @@ const getters = {
   avatar: state => state.user.avatar,
   name: state => state.user.name,
   userInfo: state => state.user.userInfo,
+  roles: state => state.user.roles,
   addRouters: state => state.permission.addRouters
 }
 export default getters

src/store/modules/permission.js

@@ -21,12 +21,7 @@ const mutations = {
 const actions = {
   GenerateRoutes({ commit }, data) {
     return new Promise(resolve => {
-      let roles = []
-      if (data.type === 1) {
-        roles = ['admin'] // 业务员
-      } else if (data.type === 2) {
-        roles = ['salesman'] // 供应商
-      }
+      const roles = data
       const accessedRouters = asyncRouterMap.filter(v => {
         if (hasPermission(roles, v)) {
           if (v.children && v.children.length > 0) {

src/store/modules/user.js

@@ -6,21 +6,25 @@ import {
   getToken,
   setToken,
   removeToken,
-  setUserInfo,
-  getUserInfo,
-  removeUserInfo
+  getCookies,
+  setCookies,
+  removeCookies
 } from '@/utils/auth'
 import {
   resetRouter
 } from '@/router'
 import $router from '@/router'
+const userInfoKey = 'userInfo'
+const rolesKey = 'roles'
+
 const getDefaultState = () => {
   return {
     token: getToken(),
     name: '',
     avatar: '',
     checked: '',
-    userInfo: getUserInfo() ? JSON.parse(getUserInfo()) : {}
+    userInfo: getCookies(userInfoKey) ? JSON.parse(getCookies(userInfoKey)) : {},
+    roles: getCookies(rolesKey) ? JSON.parse(getCookies(rolesKey)) : []
   }
 }
 
@@ -36,6 +40,9 @@ const mutations = {
   SET_USER_INFO: (state, userInfo) => {
     state.userInfo = userInfo
   },
+  SET_ROLES: (state, roles) => {
+    state.roles = roles
+  },
   SET_NAME: (state, name) => {
     state.name = name
   },
@@ -59,8 +66,20 @@ const actions = {
         const { token, userInfo } = res?.data
         commit('SET_TOKEN', token)
         commit('SET_USER_INFO', userInfo)
+        const roleId = userInfo.roleId
+        let roles = []
+        if (roleId === 0) {
+          roles = ['admin']
+        } else if (roleId === 1) {
+          roles = ['salesman']
+        } else if (roleId === 999) {
+          roles = ['supplier']
+        }
+        commit('SET_ROLES', roles)
+
         setToken(token)
-        setUserInfo(userInfo)
+        setCookies(userInfoKey, userInfo)
+        setCookies(rolesKey, roles)
         $router.push({
           path: '/contracts'
         })
@@ -70,10 +89,11 @@ const actions = {
   // 获取用户信息
   ActionUserInfo({ commit, dispatch }) {
     return new Promise((resolve, reject) => {
+      const userInfo = getCookies(userInfoKey)
       if (Object.keys(state.userInfo).length > 0) {
         resolve(state.userInfo)
-      } else if (getUserInfo()) {
-        resolve(getUserInfo())
+      } else if (userInfo) {
+        resolve(userInfo)
       } else {
         reject()
       }
@@ -82,12 +102,16 @@ const actions = {
   // 退出登录
   ActionLogout({ commit, dispatch }) {
     removeToken() // must remove  token  first
-    removeUserInfo()
+    removeCookies(userInfoKey)
+    removeCookies(rolesKey)
     resetRouter()
+
     commit('SET_TOKEN', '')
     commit('SET_USER_INFO', {})
+    commit('SET_ROLES', [])
     $router.push({ path: '/login' })
   },
+
   // user login
   login({
     commit

src/utils/auth.js

@@ -1,7 +1,6 @@
 import Cookies from 'js-cookie'
 
 const TokenKey = 'vue_admin_template_token'
-const UserInfoKey = 'vue_admin_template_user_info'
 
 export function getToken() {
   return Cookies.get(TokenKey)
@@ -15,14 +14,15 @@ export function removeToken() {
   return Cookies.remove(TokenKey)
 }
 
-export function getUserInfo() {
-  return Cookies.get(UserInfoKey)
+// 获取Cookies
+export function getCookies(key) {
+  return Cookies.get(key)
 }
-
-export function setUserInfo(userInfo) {
-  return Cookies.set(UserInfoKey, userInfo)
+// 设置Cookies
+export function setCookies(key, value) {
+  return Cookies.set(key, value)
 }
-
-export function removeUserInfo() {
-  return Cookies.remove(UserInfoKey)
+// 删除Cookies
+export function removeCookies(key) {
+  return Cookies.remove(key)
 }