Assets 静态资源

Assets 目录用于存放跨应用共享的静态资源与逻辑模块，统一通过 @Passets 别名引用：

import ... from "@Passets/...";

目录结构

assets
├── constants                # 常量
│ └── apps.ts                # 应用清单（appGroups 分组 + apps 展平）
├── css                      # 样式
│ ├── base.css               # 基础样式
│ ├── color.css              # 颜色变量
│ └── element.css            # Element Plus 组件样式
├── directives               # 内置指令
│ └── permission.ts          # v-permission 按钮权限指令
├── iconfont                 # iconfont 图标字体（css/json/ttf/woff/woff2）
├── stores                   # Pinia 状态管理
│ └── shared.ts              # 主子应用共享 store
└── utils                    # 工具函数
  ├── array.ts               # 数组工具
  ├── permission.ts          # 统一权限模型（hasPermission / filterMenuTree）
  └── request.ts             # 请求封装

constants/apps.ts

前端硬编码的应用清单，主应用与 system 子应用共用同一份数据，appKey 需与 apps/apps.json 保持一致。

export interface AppItem {
  name: string;
  appKey: string;
  icon: string;
}
export interface AppGroup {
  group: string;
  apps: AppItem[];
}

导出 appGroups（按分组组织的二级数组）与 apps（展平并含 group 字段的列表）。应用是否对当前用户可见，由「该应用下是否存在可见菜单」决定（见主应用侧 stores/apps.ts）。

utils/permission.ts（统一权限模型）

菜单与按钮已合并为统一模型，权限判断唯一逻辑集中在此：

• MenuItem：{ key?, name, url?, icon?, children? }，key 缺省表示纯展示分组节点，始终展示、可见性由 children 决定
• hasPermission(key, permissions)：判断权限 key 是否命中已授权集合；permissions === "all" 表示全量放行；key 为空视为无需校验
• filterMenuTree(items, permissions)：按权限过滤硬编码菜单树，分组节点（无 key）只要过滤后仍有可见子节点就保留

后端返回逗号分隔的权限 key 字符串。各子应用在各自 src/constants/menus.ts 硬编码菜单树，主应用通过 main/src/utils/appMenus.ts 按 appKey 动态 import 聚合。

directives/permission.ts

按钮权限指令 v-permission="'key'"，根据 key 精确匹配控制元素显隐（命中则显示、否则 display: none），内部监听 sharedStore.userInfo.permissions 实时响应。

stores/shared.ts

主子应用共享的 Pinia store：

• userInfo：{ id, name, avatar, username, role, permissions }
• isAppRouteLoading：子应用路由加载态
• setUserInfo / setRouteLoading：写入状态的 action

子应用在 appInit.ts 中通过 window.parent.$mainPinia 复用主应用 Pinia 实例，配合 wujie bus 上的 changeSharedPinia 事件同步状态（见 apps/useMicroApp.ts）。

样式与使用

• 基础样式在 appInit.ts 中统一引入 @Passets/css/base.css，包含基础样式与颜色变量
• 图标分为 Element Plus 图标（el-icon-* 前缀）与 iconfont 图标（p-icon-* 前缀），通过 p-icon 组件统一渲染（见 组件库）