39 lines
866 B
TypeScript
39 lines
866 B
TypeScript
|
/**
|
||
|
|
* Global authority directive
|
||
|
|
* Used for fine-grained control of component permissions
|
||
|
|
* @Example v-auth="RoleEnum.TEST"
|
||
|
|
*/
|
||
|
|
import type { App, Directive, DirectiveBinding } from 'vue';
|
||
|
|
|
||
|
|
import { useAccess } from './use-access';
|
||
|
|
|
||
|
|
function isAccessible(el: Element, binding: any) {
|
||
|
|
const { accessMode, hasAccessByCodes, hasAccessByRoles } = useAccess();
|
||
|
|
|
||
|
|
const value = binding.value;
|
||
|
|
|
||
|
|
if (!value) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const authMethod =
|
||
|
|
accessMode.value === 'frontend' ? hasAccessByRoles : hasAccessByCodes;
|
||
|
|
|
||
|
|
if (!authMethod(value)) {
|
||
|
|
el?.remove();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const mounted = (el: Element, binding: DirectiveBinding<string | string[]>) => {
|
||
|
|
isAccessible(el, binding);
|
||
|
|
};
|
||
|
|
|
||
|
|
const authDirective: Directive = {
|
||
|
|
mounted,
|
||
|
|
};
|
||
|
|
|
||
|
|
export function installAccessDirective(app: App) {
|
||
|
|
app.directive('access', authDirective);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default authDirective;
|