diff --git a/README.md b/README.md
index e69de29..ff8dd78 100644
--- a/README.md
+++ b/README.md
@@ -0,0 +1,57 @@
+
+
+## 权限控制
+
+前端页面的权限控制有2种方式(role和permission), 在三个地方进行控制:
+
+1. 左边菜单的显示隐藏
+
+ 在路由表各项的meta中添加 roles: ['admin', 'editor'] 或 permissions: ['app:read']
+
+2. 页面内各种按钮和弹窗
+
+ 使用v-role和v-permission控制,
+
+ ```vue
+
+
+ Only
+ app:read can see this
+
+
+ v-role="['admin']"
+
+ ```
+
+ 也可使用@utils/permission.ts中的checkRole和checkPermission方法
+
+ ```vue
+
+ Admin can see this
+
+ v-if="checkRole(['admin'])"
+
+
+ ```
+
+
+
+3. 逻辑代码中判断
+
+ 使用@utils/permission.ts中的checkRole和checkPermission方法
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index 8b17179..aea3d9d 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -87,19 +87,6 @@ export const constantRoutes: RouteConfig[] = [
}
]
},
- // {
- // path: '/documentation',
- // component: Layout,
- // children: [
- // {
- // path: 'index',
- // component: () => import(/* webpackChunkName: "documentation" */ '@/views/documentation/index.vue'),
- // name: 'Documentation',
- // meta: { title: 'documentation', icon: 'documentation', affix: true }
- // }
- // ]
- // },
-
{
path: '/profile',
component: Layout,
@@ -125,14 +112,23 @@ export const constantRoutes: RouteConfig[] = [
* the routes that need to be dynamically loaded based on user roles
*/
export const asyncRoutes: RouteConfig[] = [
+ {
+ path: '/system',
+ component: Layout,
+ redirect: '/system/list',
+ meta: {
+ title: '',
+ icon: 'lock',
+ alwaysShow: true
+ }
+ },
{
path: '/permission',
component: Layout,
- redirect: '/permission/directive',
+ redirect: '/permission/directive1',
meta: {
title: 'permission',
icon: 'lock',
- roles: ['admin', 'editor'], // you can set roles in root nav
alwaysShow: true // will always show the root menu
},
children: [
@@ -150,8 +146,8 @@ export const asyncRoutes: RouteConfig[] = [
component: () => import(/* webpackChunkName: "permission-directive" */ '@/views/permission/directive.vue'),
name: 'DirectivePermission',
meta: {
- title: 'directivePermission'
- // if do not set roles, means: this page does not require permission
+ title: 'directivePermission',
+ permissions: ['app:update']
}
},
{
diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts
index e8eec60..53efb95 100644
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -5,25 +5,28 @@ import store from '@/store'
import { checkPermission } from '@/utils/permission'
const hasRole = (roles: string[], route: RouteConfig) => {
- if (route.meta && route.meta.roles) {
+ if (route.meta?.roles) {
return roles.some(role => route.meta.roles.includes(role))
} else {
- return true
+ return false
}
}
const hasPermission = (route: RouteConfig) => {
if (route.meta?.permissions) {
return checkPermission(route.meta?.permissions)
} else {
- return true
+ return false
}
}
+const defaultPublic = (route: RouteConfig) => {
+ return !route.meta?.roles && !route.meta?.permissions
+}
export const filterAsyncRoutes = (routes: RouteConfig[], roles: string[]) => {
const res: RouteConfig[] = []
routes.forEach(route => {
const r = { ...route }
- if (hasRole(roles, r) || hasPermission(r)) {
+ if ((hasRole(roles, r) || hasPermission(r)) || defaultPublic(r)) {
if (r.children) {
r.children = filterAsyncRoutes(r.children, roles)
}