Подготовить HY2XS к production-сборке

apps/frontend/src/directive/index.ts

@@ -0,0 +1,9 @@
+import type { App } from "vue";
+
+import { hasRole } from "./permission";
+
+// 全局注册 directive
+export function setupDirective(app: App<Element>) {
+  // 使 v-hasRole 在所有组件中都可用
+  app.directive("hasRole", hasRole);
+}

apps/frontend/src/directive/permission/index.ts

@@ -0,0 +1,25 @@
+import { useAccountStoreHook } from "@/store/modules/account";
+import { Directive, DirectiveBinding } from "vue";
+
+/**
+ * 角色权限
+ */
+export const hasRole: Directive = {
+  mounted(el: HTMLElement, binding: DirectiveBinding) {
+    const { value } = binding;
+
+    if (value) {
+      const requiredRoles = value; // DOM绑定需要的角色编码
+      const { roles } = useAccountStoreHook();
+      const hasRole = roles.some((perm) => {
+        return requiredRoles.includes(perm);
+      });
+
+      if (!hasRole) {
+        el.parentNode && el.parentNode.removeChild(el);
+      }
+    } else {
+      throw new Error("need roles! Like v-has-role=\"['admin', 'user']\"");
+    }
+  },
+};