import type { Directive, DirectiveBinding } from 'vue'
import { useUserStore } from '@/stores/user'

/**
 * v-permission 指令
 * 用法: v-permission="'inbound_buy:delete'" 或 v-permission="['inbound_buy:delete', 'inbound_buy:edit']"
 * 支持数组形式（满足任一权限即显示）和字符串形式
 */
const permissionDirective: Directive = {
  mounted(el: HTMLElement, binding: DirectiveBinding) {
    const userStore = useUserStore()
    const value = binding.value

    // 没有绑定值，不做任何处理
    if (value === undefined || value === null) {
      return
    }

    // 解析权限码数组
    let permissionCodes: string[] = []

    if (typeof value === 'string') {
      // 字符串形式: "inbound_buy:delete"
      permissionCodes = [value]
    } else if (Array.isArray(value)) {
      // 数组形式: ['inbound_buy:delete', 'inbound_buy:edit']
      permissionCodes = value
    }

    // 超级管理员拥有所有权限
    if (userStore.role === 'SUPER_ADMIN') {
      return
    }

    // 检查是否有任意一个权限码
    const hasAuth = permissionCodes.some((code) => userStore.hasPermission(code))

    if (!hasAuth) {
      // 没有权限，从 DOM 中移除该元素
      el.parentNode?.removeChild(el)
    }
  }
}

export default permissionDirective
