vue自定义权限指令
2021-11-12 本文已影响0人
香蕉不拿呢
/**
* Action 权限指令
* 指令用法:
* - 在需要控制 action 级别权限的组件上使用 v-action:[组件code] , 如下:
* <a-button v-action:[123]="'disable'">内容</a-button>
* <a-button v-action:124>内容</a-button>
* - 当前用户没有权限时,组件上使用了该指令则会被隐藏
*/
export default {
install(Vue) {
Vue.directive('action', {
inserted: function (el, binding, vnode) {
const _this = vnode.context;
const code = binding.arg || ''
const value = binding.value || ''
const userPermission = _this.$store.getters["Permission/userPermission"];
if (userPermission(code) && userPermission(code).isShow) {
return
} else {
if(value == "disable"){
el.classList.add("disableAction")
}
else{
el.parentNode && el.parentNode.removeChild(el) || (el.style.display = 'none')
}
}
}
})
}
}