inleft
2022-02-09 9bcb19959eeb9da9bde2561e7278f6d0a55eb151
commit | author | age
9bcb19 1 import Vue from 'vue'
I 2 import store from '@/store'
3
4 /**
5  * Action 权限指令
6  * 指令用法:
7  *  - 在需要控制 action 级别权限的组件上使用 v-action:[method] , 如下:
8  *    <i-button v-action:add >添加用户</a-button>
9  *    <a-button v-action:delete>删除用户</a-button>
10  *    <a v-action:edit @click="edit(record)">修改</a>
11  *
12  *  - 当前用户没有权限时,组件上使用了该指令则会被隐藏
13  *  - 当后台权限跟 pro 提供的模式不同时,只需要针对这里的权限过滤进行修改即可
14  *
15  *  @see https://github.com/sendya/ant-design-pro-vue/pull/53
16  */
17 const action = Vue.directive('action', {
18   inserted: function (el, binding, vnode) {
19     const actionName = binding.arg
20     const roles = store.getters.roles
21     const elVal = vnode.context.$route.meta.permission
22     const permissionId = elVal instanceof String && [elVal] || elVal
23     roles.permissions.forEach(p => {
24       if (!permissionId.includes(p.permissionId)) {
25         return
26       }
27       if (p.actionList && !p.actionList.includes(actionName)) {
28         el.parentNode && el.parentNode.removeChild(el) || (el.style.display = 'none')
29       }
30     })
31   }
32 })
33
34 export default action