import { router } from '@/router'
import { useUserStore } from '@/store/modules/user'
import { useAppMode } from '@/hooks/core/useAppMode'
import { extractRouteAuthMarks, extractUserButtons, hasAuthPermission } from '@/hooks/core/useAuth'

function checkAuthPermission(el, binding) {
  const authList = extractRouteAuthMarks(router.currentRoute.value.meta.authList)
  const buttons = extractUserButtons(useUserStore().getUserInfo)
  const { isBackendMode } = useAppMode()
  const hasPermission = hasAuthPermission(binding.value, {
    authList,
    buttons,
    isBackendMode: isBackendMode.value,
    routePath: router.currentRoute.value.path
  })
  if (!hasPermission) {
    removeElement(el)
  }
}
function removeElement(el) {
  if (el.parentNode) {
    el.parentNode.removeChild(el)
  }
}
const authDirective = {
  mounted: checkAuthPermission,
  updated: checkAuthPermission
}
function setupAuthDirective(app) {
  app.directive('auth', authDirective)
}
export { setupAuthDirective }