import { useUserStoreHook } from "@/store/modules/user"; import { Directive, DirectiveBinding } from "vue"; /** * 按钮权限 */ export const hasPerm: Directive = { mounted(el: HTMLElement, binding: DirectiveBinding) { // 「超级管理员」拥有所有的按钮权限 const { roles, perms } = useUserStoreHook().user; if (roles.includes("ROOT")) { return true; } // 「其他角色」按钮权限校验 const { value } = binding; if (value) { const requiredPerms = value; // DOM绑定需要的按钮权限标识 const hasPerm = perms?.some((perm) => { return requiredPerms.includes(perm); }); if (!hasPerm) { el.parentNode && el.parentNode.removeChild(el); } } else { throw new Error( "need perms! Like v-has-perm=\"['sys:user:add','sys:user:edit']\"" ); } }, }; export function checkPerm(str: string) { // 「超级管理员」拥有所有的按钮权限 const { roles, perms } = useUserStoreHook().user; if (roles.includes("ROOT")) { return true; } return perms.includes(str) } /** * 角色权限 */ export const hasRole: Directive = { mounted(el: HTMLElement, binding: DirectiveBinding) { const { value } = binding; if (value) { const requiredRoles = value; // DOM绑定需要的角色编码 const { roles } = useUserStoreHook().user; const hasRole = roles.some((perm) => { return requiredRoles.includes(perm); }); if (!hasRole) { el.parentNode && el.parentNode.removeChild(el); } } else { throw new Error("need roles! Like v-has-role=\"['admin','test']\""); } }, };