permission

2024-07-18 14:26:50 +08:00 · 2024-07-18 14:26:50 +08:00 · 12570897b9
commit 12570897b9
parent f753778465
6 changed files with 235 additions and 162 deletions
--- a/src/permission.js
+++ b/src/permission.js
@ -37,6 +37,7 @@ router.beforeEach(async(to, from, next) => {

          // generate accessible routes map based on roles
          const accessRoutes = await store.dispatch('permission/generateRoutes', roles)
+          run()
          console.log(accessRoutes)

          // dynamically add accessible routes
@ -72,3 +73,11 @@ router.afterEach(() => {
  // finish progress bar
  NProgress.done()
 })
+
+function sleep(time) {
+  return new Promise((resolve) => setTimeout(resolve, time))
+}
+
+async function run() {
+  await sleep(2000)
+}
--- a/src/router/index.js
+++ b/src/router/index.js
@ -96,150 +96,9 @@ export const constantRoutes = [
    ]
  },
  {
-    path: '/announcement',
-    component: Layout,
-    redirect: '/index',
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/announcement/index'),
-        name: 'Announcement',
-        meta: { title: '公告', icon: 'documentation' }
-      }
-    ]
-  }, {
-    path: '/audit',
-    component: Layout,
-    redirect: '/index',
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/audit/index'),
-        name: 'Audit',
-        meta: { title: '审核', icon: 'audit' }
-      }
-    ]
-  }, {
-    path: '/email',
-    component: Layout,
-    redirect: '/index',
-    meta: {
-      title: '邮件',
-      icon: 'email'
-    },
-    children: [
-      {
-        path: 'index',
-        component: () => import('@/views/email/list'),
-        name: 'EmailList',
-        meta: { title: '邮件列表' },
-        hidden: false
-      },
-      {
-        path: 'create',
-        component: () => import('@/views/email/create'),
-        name: 'EmailCreate',
-        meta: { title: '发布邮件' },
-        hidden: false
-      }, {
-        path: 'update/:mailid',
-        component: () => import('@/views/email/create'),
-        name: 'EmailUpdate',
-        meta: { title: '修改邮件' },
-        hidden: true
-      }, {
-        path: 'user_group/index',
-        component: () => import('@/views/email/user_group_list'),
-        name: 'UserGroupList',
-        meta: { title: '用户组列表' },
-        hidden: false
-      }, {
-        path: 'user_group/member',
-        component: () => import('@/views/email/group_member'),
-        name: 'GroupMember',
-        meta: { title: '组成员' },
-        hidden: true
-      }
-    ]
-  }, {
-    path: '/player',
-    component: Layout,
-    redirect: '/index',
-    meta: {
-      title: '玩家信息查询',
-      icon: 'user'
-    },
-    children: [
-      {
-        path: 'info',
-        component: () => import('@/views/player/info'),
-        name: 'playerinfo',
-        meta: { title: '玩家查询' },
-        hidden: false
-      }, {
-        path: 'bagquery',
-        component: () => import('@/views/player/bagquery'),
-        name: 'bagquery',
-        meta: { title: '玩家背包查询' },
-        hidden: false
-      }, {
-        path: 'heroesquery',
-        component: () => import('@/views/player/heroesquery'),
-        name: 'heroesquery',
-        meta: { title: '玩家英雄查询' },
-        hidden: false
-      }, {
-        path: 'goldbullionquery',
-        component: () => import('@/views/player/goldbullionquery'),
-        name: 'goldquery',
-        meta: { title: '金币查询' },
-        hidden: false
-      }, {
-        path: 'ticketconsumequery',
-        component: () => import('@/views/player/ticketconsumequery'),
-        name: 'ticketquery',
-        meta: { title: '门票消耗查询' },
-        hidden: false
-      }, {
-        path: 'gamemallquery',
-        component: () => import('@/views/player/gamemallquery'),
-        name: 'gamemallquery',
-        meta: { title: '游戏内商品查询' },
-        hidden: false
-      }
-    ]
-  }, {
-    path: '/nft',
-    component: Layout,
-    redirect: '/index',
-    meta: {
-      title: '商业信息查询',
-      icon: 'shopping'
-    },
-    children: [
-      {
-        path: 'orderquery',
-        component: () => import('@/views/nft/orderquery'),
-        name: 'orderquery',
-        meta: { title: '订单查询' },
-        hidden: false
-      }, {
-        path: 'salequery',
-        component: () => import('@/views/nft/salequery'),
-        name: 'salequery',
-        meta: { title: '售卖查询' },
-        hidden: false
-      }, {
-        path: 'nftquery',
-        component: () => import('@/views/nft/nftquery'),
-        name: 'nftquery',
-        meta: { title: 'NFT查询' },
-        hidden: false
-      }
-    ]
-  }, {
    path: '*', // 匹配未定义的路由
-    redirect: '/404'// 重定向
+    redirect: '/404', // 重定向
+    hidden: true
  }
  // tableRouter
  // {
@ -288,7 +147,159 @@ export const constantRoutes = [
 * asyncRoutes
 * the routes that need to be dynamically loaded based on user roles
 */
-// export const asyncRoutes = [
+export const asyncRoutes = [
+  {
+    path: '/announcement',
+    component: Layout,
+    redirect: '/index',
+    meta: {
+      pername: 'announcement'
+    },
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/announcement/index'),
+        name: 'Announcement',
+        meta: { title: '公告', icon: 'documentation', pername: 'announcement' }
+      }
+    ]
+  }, {
+    path: '/audit',
+    component: Layout,
+    redirect: '/index',
+    meta: {
+      pername: 'audit'
+    },
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/audit/index'),
+        name: 'Audit',
+        meta: { title: '审核', icon: 'audit', pername: 'audit' }
+      }
+    ]
+  }, {
+    path: '/email',
+    component: Layout,
+    redirect: '/index',
+    meta: {
+      title: '邮件',
+      icon: 'email',
+      pername: 'listemail'
+    },
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/email/list'),
+        name: 'EmailList',
+        meta: { title: '邮件列表', pername: 'listemail' },
+        hidden: false
+      },
+      {
+        path: 'create',
+        component: () => import('@/views/email/create'),
+        name: 'EmailCreate',
+        meta: { title: '发布邮件', pername: 'createemail' },
+        hidden: false
+      }, {
+        path: 'update/:mailid',
+        component: () => import('@/views/email/create'),
+        name: 'EmailUpdate',
+        meta: { title: '修改邮件', pername: 'editemail' },
+        hidden: true
+      }, {
+        path: 'user_group/index',
+        component: () => import('@/views/email/user_group_list'),
+        name: 'UserGroupList',
+        meta: { title: '用户组列表', pername: 'emailgroup' },
+        hidden: false
+      }, {
+        path: 'user_group/member',
+        component: () => import('@/views/email/group_member'),
+        name: 'GroupMember',
+        meta: { title: '组成员' },
+        hidden: true
+      }
+    ]
+  }, {
+    path: '/player',
+    component: Layout,
+    redirect: '/index',
+    meta: {
+      title: '玩家信息查询',
+      icon: 'user',
+      pername: 'playerinfo'
+    },
+    children: [
+      {
+        path: 'info',
+        component: () => import('@/views/player/info'),
+        name: 'playerinfo',
+        meta: { title: '玩家查询', pername: 'playerinfo' },
+        hidden: false
+      }, {
+        path: 'bagquery',
+        component: () => import('@/views/player/bagquery'),
+        name: 'bagquery',
+        meta: { title: '玩家背包查询', pername: 'bagquery' },
+        hidden: false
+      }, {
+        path: 'heroesquery',
+        component: () => import('@/views/player/heroesquery'),
+        name: 'heroesquery',
+        meta: { title: '玩家英雄查询', pername: 'heroesquery' },
+        hidden: false
+      }, {
+        path: 'goldbullionquery',
+        component: () => import('@/views/player/goldbullionquery'),
+        name: 'goldquery',
+        meta: { title: '金币查询', pername: 'goldbullionquery' },
+        hidden: false
+      }, {
+        path: 'ticketconsumequery',
+        component: () => import('@/views/player/ticketconsumequery'),
+        name: 'ticketquery',
+        meta: { title: '门票消耗查询', pername: 'ticketconsumequery' },
+        hidden: false
+      }, {
+        path: 'gamemallquery',
+        component: () => import('@/views/player/gamemallquery'),
+        name: 'gamemallquery',
+        meta: { title: '游戏内商品查询', pername: 'gamemallquery' },
+        hidden: false
+      }
+    ]
+  }, {
+    path: '/nft',
+    component: Layout,
+    redirect: '/index',
+    meta: {
+      title: '商业信息查询',
+      icon: 'shopping',
+      pername: 'orderquery'
+    },
+    children: [
+      {
+        path: 'orderquery',
+        component: () => import('@/views/nft/orderquery'),
+        name: 'orderquery',
+        meta: { title: '订单查询', pername: 'orderquery' },
+        hidden: false
+      }, {
+        path: 'salequery',
+        component: () => import('@/views/nft/salequery'),
+        name: 'salequery',
+        meta: { title: '售卖查询', pername: 'salequery' },
+        hidden: false
+      }, {
+        path: 'nftquery',
+        component: () => import('@/views/nft/nftquery'),
+        name: 'nftquery',
+        meta: { title: 'NFT查询', pername: 'nftquery' },
+        hidden: false
+      }
+    ]
+  }
 //  {
 //     path: '/permission',
 //     component: Layout,
@ -545,7 +556,7 @@ export const constantRoutes = [
 //
 //   // 404 page must be placed at the end !!!
 //   { path: '*', redirect: '/404', hidden: true }
-// ]
+]

 const createRouter = () => new Router({
  // mode: 'history', // require service support
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@ -6,11 +6,14 @@ import { asyncRoutes, constantRoutes } from '@/router'
 * @param route
 */
 function hasPermission(roles, route) {
-  if (route.meta && route.meta.roles) {
+  if (route.meta) {
+    if (route.meta.roles) {
      return roles.some(role => route.meta.roles.includes(role))
-  } else {
-    return true
+    } else if (route.meta.pername) {
+      return checkuipermission(route.meta.pername)
    }
+  }
+  return false
 }

 /**
@ -36,7 +39,8 @@ export function filterAsyncRoutes(routes, roles) {

 const state = {
  routes: [],
-  addRoutes: []
+  addRoutes: [],
+  uipermission: {}
 }

 const mutations = {
@ -49,18 +53,38 @@ const mutations = {
 const actions = {
  generateRoutes({ commit }, roles) {
    return new Promise(resolve => {
-      let accessedRoutes
-      if (roles.includes('admin')) {
+      // let accessedRoutes
+      /* if (roles.includes('admin')) {
        accessedRoutes = asyncRoutes || []
-      } else {
-        accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
-      }
+      } else { */
+      const accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
+      // }
      commit('SET_ROUTES', accessedRoutes)
      resolve(accessedRoutes)
    })
  }
 }

+export function setuipermission(ui) {
+  state.uipermission = JSON.parse(ui)
+}
+
+export function checkuipermission(item) {
+  for (const key in state.uipermission) {
+    if (key === item) {
+      return state.uipermission[key]
+    }
+  }
+
+  for (const key in state.uipermission) {
+    if (key === '*') {
+      return state.uipermission['*']
+    }
+  }
+
+  return false
+}
+
 export default {
  namespaced: true,
  state,
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@ -1,6 +1,7 @@
 import { login, logout, getInfo, metamaskLogin } from '@/api/user'
 import { getToken, setToken, removeToken } from '@/utils/auth'
 import router, { resetRouter } from '@/router'
+import { setuipermission } from './permission'

 const state = {
  token: getToken(),
@ -47,8 +48,9 @@ const actions = {
  metamaskLogin({ commit }, authData) {
    return new Promise((resolve, reject) => {
      metamaskLogin(authData).then(response => {
-        const { token } = response
+        const { token, ui } = response
        commit('SET_TOKEN', token)
+        setuipermission(ui)
        setToken(token)
        resolve()
      }).catch(error => {
@ -61,7 +63,7 @@ const actions = {
  getInfo({ commit, state }) {
    return new Promise((resolve, reject) => {
      getInfo().then(response => {
-        const { data } = response
+        const { data, ui } = response

        if (!data) {
          reject('Verification failed, please Login again.')
@ -78,6 +80,7 @@ const actions = {
        // commit('SET_NAME', name)
        //
        // commit('SET_INTRODUCTION', introduction)
+        setuipermission(ui)
        resolve(data)
      }).catch(error => {
        reject(error)
--- a/src/views/announcement/index.vue
+++ b/src/views/announcement/index.vue
@ -1,7 +1,7 @@
 <template>
  <div class="app-container">
    <div class="filter-container">
-      <el-button class="filter-item" style="margin-left: 10px;" type="primary" @click="handleCreate">
+      <el-button v-show="visibleAddannouncement" class="filter-item" style="margin-left: 10px;" type="primary" @click="handleCreate">
        新增公告
      </el-button>
    </div>
@ -69,7 +69,7 @@
        width="100"
      >
        <template slot-scope="scope">
-          <el-button type="text" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
+          <el-button v-show="visibleEditannouncement" type="text" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
@ -133,6 +133,7 @@
 // import Pagination from '@/components/Pagination/index.vue'
 import { addAnnc, getAnncList, updateAnnc } from '@/api/announcement'
 import { Message } from 'element-ui'
+import { checkuipermission } from '@/store/modules/permission'

 export default {
  components: {
@ -153,6 +154,8 @@ export default {
      dialogStatus: '',
      listLoading: true,
      anncList: [],
+      visibleAddannouncement: false,
+      visibleEditannouncement: false,
      rules: {
        title: [{ required: true, message: 'title is required', trigger: 'blur' }],
        version: [{ required: true, message: 'version is required', trigger: 'blur' }],
@ -164,6 +167,17 @@ export default {
  },
  created() {
    this.getList()
+    if (checkuipermission('addannouncement')) {
+      this.visibleAddannouncement = true
+    } else {
+      this.visibleAddannouncement = false
+    }
+
+    if (checkuipermission('editannouncement')) {
+      this.visibleEditannouncement = true
+    } else {
+      this.visibleEditannouncement = false
+    }
  },
  methods: {
    handleUpdate(row) {
--- a/src/views/audit/index.vue
+++ b/src/views/audit/index.vue
@ -1,7 +1,7 @@
 <template>
  <div class="app-container">
    <div class="filter-container">
-      <el-button class="filter-item" style="margin-left: 10px;" type="primary" @click="handleCreate">
+      <el-button v-show="visibleAddaudit" class="filter-item" style="margin-left: 10px;" type="primary" @click="handleCreate">
        新增
      </el-button>
    </div>
@ -43,7 +43,7 @@
        label="操作"
      >
        <template slot-scope="scope">
-          <el-button type="text" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
+          <el-button v-show="visibleEditaudit" type="text" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
@ -86,6 +86,7 @@
 <script>
 // import Pagination from '@/components/Pagination/index.vue'
 import { addAudit, updateAudit, getAuditList } from '@/api/audit'
+import { checkuipermission } from '@/store/modules/permission'

 export default {
  components: {
@ -111,6 +112,17 @@ export default {
  },
  created() {
    this.getList()
+    if (checkuipermission('addaudit')) {
+      this.visibleAddaudit = true
+    } else {
+      this.visibleAddaudit = false
+    }
+
+    if (checkuipermission('editaudit')) {
+      this.visibleEditaudit = true
+    } else {
+      this.visibleEditaudit = false
+    }
  },
  methods: {
    handleUpdate(row) {