/**
 * Global authority directive
 * Used for fine-grained control of component permissions
 * @Example v-auth="RoleEnum.TEST"
 */
import type { App, Directive, DirectiveBinding } from 'vue';

import { usePermission } from '/@/hooks/web/usePermission';

function isAllAuth(el: Element, binding: any) {
  const { hasAllPermission } = usePermission();

  const value = binding.value;
  if (!value) return;
  if (!hasAllPermission(value)) {
    el.parentNode?.removeChild(el);
  }
}

const mounted = (el: Element, binding: DirectiveBinding<any>) => {
  isAllAuth(el, binding);
};

const allAuthDirective: Directive = {
  mounted,
}

export function setupAllPermissionDirective(app: App) {
  app.directive('allAuth', allAuthDirective);
}

export default allAuthDirective;