Skip to content

Commit 059d8b5

Browse files
sendyasendya
committed
fix: permission directive timeout remove.
1 parent 1a6e572 commit 059d8b5

File tree

1 file changed

+103
-109
lines changed

1 file changed

+103
-109
lines changed

‎src/permission.js

Lines changed: 103 additions & 109 deletions
Original file line numberDiff line numberDiff line change
@@ -1,109 +1,103 @@
1-
import Vue from 'vue'
2-
import router from './router'
3-
import store from './store'
4-
5-
import NProgress from 'nprogress' // progress bar
6-
import 'nprogress/nprogress.css' // progress bar style
7-
import notification from 'ant-design-vue/es/notification'
8-
import { ACCESS_TOKEN } from '@/store/mutation-types'
9-
10-
NProgress.configure({ showSpinner: false }) // NProgress Configuration
11-
12-
const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist
13-
14-
router.beforeEach((to, from, next) => {
15-
NProgress.start() // start progress bar
16-
17-
if (Vue.ls.get(ACCESS_TOKEN)) {
18-
/* has token */
19-
if (to.path === '/user/login') {
20-
next({ path: '/dashboard/workplace' })
21-
NProgress.done()
22-
} else {
23-
if (store.getters.roles.length === 0) {
24-
store
25-
.dispatch('GetInfo')
26-
.then(res => {
27-
const roles = res.result && res.result.role
28-
store.dispatch('GenerateRoutes', { roles }).then(() => {
29-
// 根据roles权限生成可访问的路由表
30-
// 动态添加可访问路由表
31-
router.addRoutes(store.getters.addRouters)
32-
const redirect = decodeURIComponent(from.query.redirect || to.path)
33-
if (to.path === redirect) {
34-
// hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
35-
next({ ...to, replace: true })
36-
} else {
37-
// 跳转到目的路由
38-
next({ path: redirect })
39-
}
40-
})
41-
})
42-
.catch(() => {
43-
notification.error({
44-
message: '错误',
45-
description: '请求用户信息失败，请重试'
46-
})
47-
store.dispatch('Logout').then(() => {
48-
next({ path: '/user/login', query: { redirect: to.fullPath } })
49-
})
50-
})
51-
} else {
52-
next()
53-
}
54-
}
55-
} else {
56-
if (whiteList.includes(to.name)) {
57-
// 在免登录白名单，直接进入
58-
next()
59-
} else {
60-
next({ path: '/user/login', query: { redirect: to.fullPath } })
61-
NProgress.done() // if current page is login will not trigger afterEach hook, so manually handle it
62-
}
63-
}
64-
})
65-
66-
router.afterEach(() => {
67-
NProgress.done() // finish progress bar
68-
})
69-
70-
/**
71-
* Action 权限指令
72-
* 指令用法：
73-
* - 在需要控制 action 级别权限的组件上使用 v-action:[method] , 如下：
74-
* <i-button v-action:add >添加用户</a-button>
75-
* <a-button v-action:delete>删除用户</a-button>
76-
* <a v-action:edit @click="edit(record)">修改</a>
77-
*
78-
* - 当前用户没有权限时，组件上使用了该指令则会被隐藏
79-
* - 当后台权限跟 pro 提供的模式不同时，只需要针对这里的权限过滤进行修改即可
80-
*
81-
* @see https://github.com/sendya/ant-design-pro-vue/pull/53
82-
*/
83-
const action = Vue.directive('action', {
84-
bind: function (el, binding, vnode) {
85-
const actionName = binding.arg
86-
const roles = store.getters.roles
87-
const permissionId = vnode.context.$route.meta.permission
88-
let actions = []
89-
roles.permissions.forEach(p => {
90-
if (p.permissionId !== permissionId) {
91-
return
92-
}
93-
actions = p.actionList
94-
})
95-
if (actions.indexOf(actionName) < 0) {
96-
setTimeout(() => {
97-
if (el.parentNode == null) {
98-
el.style.display = 'none'
99-
} else {
100-
el.parentNode.removeChild(el)
101-
}
102-
}, 10)
103-
}
104-
}
105-
})
106-
107-
export {
108-
action
109-
}
1+
import Vue from 'vue'
2+
import router from './router'
3+
import store from './store'
4+
5+
import NProgress from 'nprogress' // progress bar
6+
import 'nprogress/nprogress.css' // progress bar style
7+
import notification from 'ant-design-vue/es/notification'
8+
import { ACCESS_TOKEN } from '@/store/mutation-types'
9+
10+
NProgress.configure({ showSpinner: false }) // NProgress Configuration
11+
12+
const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist
13+
14+
router.beforeEach((to, from, next) => {
15+
NProgress.start() // start progress bar
16+
17+
if (Vue.ls.get(ACCESS_TOKEN)) {
18+
/* has token */
19+
if (to.path === '/user/login') {
20+
next({ path: '/dashboard/workplace' })
21+
NProgress.done()
22+
} else {
23+
if (store.getters.roles.length === 0) {
24+
store
25+
.dispatch('GetInfo')
26+
.then(res => {
27+
const roles = res.result && res.result.role
28+
store.dispatch('GenerateRoutes', { roles }).then(() => {
29+
// 根据roles权限生成可访问的路由表
30+
// 动态添加可访问路由表
31+
router.addRoutes(store.getters.addRouters)
32+
const redirect = decodeURIComponent(from.query.redirect || to.path)
33+
if (to.path === redirect) {
34+
// hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
35+
next({ ...to, replace: true })
36+
} else {
37+
// 跳转到目的路由
38+
next({ path: redirect })
39+
}
40+
})
41+
})
42+
.catch(() => {
43+
notification.error({
44+
message: '错误',
45+
description: '请求用户信息失败，请重试'
46+
})
47+
store.dispatch('Logout').then(() => {
48+
next({ path: '/user/login', query: { redirect: to.fullPath } })
49+
})
50+
})
51+
} else {
52+
next()
53+
}
54+
}
55+
} else {
56+
if (whiteList.includes(to.name)) {
57+
// 在免登录白名单，直接进入
58+
next()
59+
} else {
60+
next({ path: '/user/login', query: { redirect: to.fullPath } })
61+
NProgress.done() // if current page is login will not trigger afterEach hook, so manually handle it
62+
}
63+
}
64+
})
65+
66+
router.afterEach(() => {
67+
NProgress.done() // finish progress bar
68+
})
69+
70+
/**
71+
* Action 权限指令
72+
* 指令用法：
73+
* - 在需要控制 action 级别权限的组件上使用 v-action:[method] , 如下：
74+
* <i-button v-action:add >添加用户</a-button>
75+
* <a-button v-action:delete>删除用户</a-button>
76+
* <a v-action:edit @click="edit(record)">修改</a>
77+
*
78+
* - 当前用户没有权限时，组件上使用了该指令则会被隐藏
79+
* - 当后台权限跟 pro 提供的模式不同时，只需要针对这里的权限过滤进行修改即可
80+
*
81+
* @see https://github.com/sendya/ant-design-pro-vue/pull/53
82+
*/
83+
const action = Vue.directive('action', {
84+
bind: function (el, binding, vnode) {
85+
const actionName = binding.arg
86+
const roles = store.getters.roles
87+
const permissionId = vnode.context.$route.meta.permission
88+
let actions = []
89+
roles.permissions.forEach(p => {
90+
if (p.permissionId !== permissionId) {
91+
return
92+
}
93+
actions = p.actionList
94+
})
95+
if (actions.indexOf(actionName) < 0) {
96+
el.parentNode && el.parentNode.removeChild(el) || (el.style.display = 'none')
97+
}
98+
}
99+
})
100+
101+
export {
102+
action
103+
}

0 commit comments

Comments
 (0)