🧭 Admin 路由与权限

Admin 路由由“固定路由 + 后端菜单动态路由”组成。

📍 固定路由

定义在：

frontend/admin/src/router/routes.ts

固定路由包含：

• 404。
• 403。
• 500。
• 登录页 /login。
• 用户个人设置 /user/setting。
• 后台首页容器 INDEX_ROUTE。
• 应用中心 /module-center。

🔀 动态路由

定义在：

frontend/admin/src/router/index.ts

后端菜单只保存组件路径，前端运行时通过：

const modules = import.meta.glob('/src/views/**/*.vue')

把菜单项映射为真实组件。

🔤 菜单字段语义

字段	用途
paths	路由路径
name	菜单标题
component	src/views 下的组件路径，不带 .vue
perms	权限标识
icon	菜单图标
type	目录或菜单
is_cache	是否 keep-alive
params	默认查询参数
selected	高亮菜单

🛡️ 权限守卫

定义在：

frontend/admin/src/permission.ts

守卫逻辑：

• 白名单：登录页、403、500。
• 有 token 且已加载用户信息：直接进入。
• 有 token 但未加载用户信息：调用 refreshUserAccess() 拉取用户、菜单、权限并注册动态路由。
• 无 token：跳转登录页，并带上 redirect。
• 菜单为空或没有可进入路由：清理登录态并进入 403。

⚗️ 用户 Store

定义在：

frontend/admin/src/stores/modules/user.ts

核心状态：

状态	说明
token	后台管理员 token
userInfo	管理员信息
routes	动态路由
perms	权限标识数组

核心方法：

方法	说明
login()	登录并缓存 token
logout()	退出登录并清理状态
getUserInfo()	拉取用户、菜单、权限
applyDynamicRoutes()	注册动态路由
refreshUserAccess()	重新拉取权限并重建路由

🧵 新增后台页面检查清单

1. 在 src/views/{Module} 下新增页面。
2. 在 src/views/{Module}/api 或对应模块 API 目录新增接口封装。
3. 后端新增控制器、Dao、Action、Request。
4. 菜单数据里维护 component，必须匹配 src/views 下路径。
5. 如有权限控制，需维护 perms 并在页面中按权限控制显示。
6. 登录后刷新菜单，确认动态路由能加载目标组件。