Commit 059d8b5f by Sendya

fix: permission directive timeout remove.

parent 1a6e5720
import Vue from 'vue' import Vue from 'vue'
import router from './router' import router from './router'
import store from './store' import store from './store'
import NProgress from 'nprogress' // progress bar import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css' // progress bar style import 'nprogress/nprogress.css' // progress bar style
import notification from 'ant-design-vue/es/notification' import notification from 'ant-design-vue/es/notification'
import { ACCESS_TOKEN } from '@/store/mutation-types' import { ACCESS_TOKEN } from '@/store/mutation-types'
NProgress.configure({ showSpinner: false }) // NProgress Configuration NProgress.configure({ showSpinner: false }) // NProgress Configuration
const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
NProgress.start() // start progress bar NProgress.start() // start progress bar
if (Vue.ls.get(ACCESS_TOKEN)) { if (Vue.ls.get(ACCESS_TOKEN)) {
/* has token */ /* has token */
if (to.path === '/user/login') { if (to.path === '/user/login') {
next({ path: '/dashboard/workplace' }) next({ path: '/dashboard/workplace' })
NProgress.done() NProgress.done()
} else { } else {
if (store.getters.roles.length === 0) { if (store.getters.roles.length === 0) {
store store
.dispatch('GetInfo') .dispatch('GetInfo')
.then(res => { .then(res => {
const roles = res.result && res.result.role const roles = res.result && res.result.role
store.dispatch('GenerateRoutes', { roles }).then(() => { store.dispatch('GenerateRoutes', { roles }).then(() => {
// 根据roles权限生成可访问的路由表 // 根据roles权限生成可访问的路由表
// 动态添加可访问路由表 // 动态添加可访问路由表
router.addRoutes(store.getters.addRouters) router.addRoutes(store.getters.addRouters)
const redirect = decodeURIComponent(from.query.redirect || to.path) const redirect = decodeURIComponent(from.query.redirect || to.path)
if (to.path === redirect) { if (to.path === redirect) {
// hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
next({ ...to, replace: true }) next({ ...to, replace: true })
} else { } else {
// 跳转到目的路由 // 跳转到目的路由
next({ path: redirect }) next({ path: redirect })
} }
}) })
}) })
.catch(() => { .catch(() => {
notification.error({ notification.error({
message: '错误', message: '错误',
description: '请求用户信息失败,请重试' description: '请求用户信息失败,请重试'
}) })
store.dispatch('Logout').then(() => { store.dispatch('Logout').then(() => {
next({ path: '/user/login', query: { redirect: to.fullPath } }) next({ path: '/user/login', query: { redirect: to.fullPath } })
}) })
}) })
} else { } else {
next() next()
} }
} }
} else { } else {
if (whiteList.includes(to.name)) { if (whiteList.includes(to.name)) {
// 在免登录白名单,直接进入 // 在免登录白名单,直接进入
next() next()
} else { } else {
next({ path: '/user/login', query: { redirect: to.fullPath } }) next({ path: '/user/login', query: { redirect: to.fullPath } })
NProgress.done() // if current page is login will not trigger afterEach hook, so manually handle it NProgress.done() // if current page is login will not trigger afterEach hook, so manually handle it
} }
} }
}) })
router.afterEach(() => { router.afterEach(() => {
NProgress.done() // finish progress bar NProgress.done() // finish progress bar
}) })
/** /**
* Action 权限指令 * Action 权限指令
* 指令用法: * 指令用法:
* - 在需要控制 action 级别权限的组件上使用 v-action:[method] , 如下: * - 在需要控制 action 级别权限的组件上使用 v-action:[method] , 如下:
* <i-button v-action:add >添加用户</a-button> * <i-button v-action:add >添加用户</a-button>
* <a-button v-action:delete>删除用户</a-button> * <a-button v-action:delete>删除用户</a-button>
* <a v-action:edit @click="edit(record)">修改</a> * <a v-action:edit @click="edit(record)">修改</a>
* *
* - 当前用户没有权限时,组件上使用了该指令则会被隐藏 * - 当前用户没有权限时,组件上使用了该指令则会被隐藏
* - 当后台权限跟 pro 提供的模式不同时,只需要针对这里的权限过滤进行修改即可 * - 当后台权限跟 pro 提供的模式不同时,只需要针对这里的权限过滤进行修改即可
* *
* @see https://github.com/sendya/ant-design-pro-vue/pull/53 * @see https://github.com/sendya/ant-design-pro-vue/pull/53
*/ */
const action = Vue.directive('action', { const action = Vue.directive('action', {
bind: function (el, binding, vnode) { bind: function (el, binding, vnode) {
const actionName = binding.arg const actionName = binding.arg
const roles = store.getters.roles const roles = store.getters.roles
const permissionId = vnode.context.$route.meta.permission const permissionId = vnode.context.$route.meta.permission
let actions = [] let actions = []
roles.permissions.forEach(p => { roles.permissions.forEach(p => {
if (p.permissionId !== permissionId) { if (p.permissionId !== permissionId) {
return return
} }
actions = p.actionList actions = p.actionList
}) })
if (actions.indexOf(actionName) < 0) { if (actions.indexOf(actionName) < 0) {
setTimeout(() => { el.parentNode && el.parentNode.removeChild(el) || (el.style.display = 'none')
if (el.parentNode == null) { }
el.style.display = 'none' }
} else { })
el.parentNode.removeChild(el)
} export {
}, 10) action
} }
}
})
export {
action
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment