import useStore from '@/store';
import {
Directive, DirectiveBinding } from 'vue';
const disableClick = (event: Event) => event && event.stopImmediatePropagation();
export const perm: Directive = {
mounted(el: HTMLElement, binding: DirectiveBinding) {
const {
user } = useStore();
binding.value = binding.value || [];
if (binding.value) {
const hasPerm = user.resourceList?.some(perm => binding.value.includes(perm));
if (!hasPerm) {
el.classList.add('is-disabled');
el.setAttribute('disabled', 'disabled');
el.addEventListener('click', disableClick, true);
}
} else {
throw new Error("need perms! Like v-perm=\"['sys:user:add','sys:user:edit']\"");
}
},
unmounted(el: HTMLElement) {
el.removeEventListener('click', disableClick);
},
};
<el-button v-perm="['qx:xz:00059']" type="success" >新增</el-button>
<el-icon v-perm="['qx:gx:00060']" class="action-icon" @click.stop="handleUpdate(scope.row)">
<EditPen />//编辑
</el-icon>