import { usePermissionStore } from '../store/permission'
import { DirectiveBinding, App } from 'vue'
import { getRouter } from '../router'

/**
 * 自定义权限指令
 * @param el
 * @param binding
 */
function authDirective(el: HTMLElement, binding: DirectiveBinding) {
	const permissionStore = usePermissionStore()
	const router = getRouter()
	const route = router.currentRoute.value
	const value = binding.value || el.textContent || ''
	const replace = value.replace(/\s+/g, '')
	if (!permissionStore.hasPermission(replace, route.path)) {
		el.parentNode && el.parentNode.removeChild(el)
	}
}

// 以插件形式注册
export default {
	install: (app: App) => {
		app.directive('auth', authDirective)
	}
}