路由系统
路由入口:admin/src/router/index.ts。常量路由与占位父路由在 routes.config.ts;鉴权与动态挂载在 permission.guard.ts;首次拉取站点配置在 auth.guard.ts(createInitGuard)。
常量路由
constantRoutes 启动时即注册,无需登录菜单:
| 路径 / 名称 | 说明 |
|---|---|
/:pathMatch(.*)*(NOT_FOUND_ROUTE) | 404 |
/403、/500 | 错误页 |
/login | 登录 |
/diy/editor(DiyEditor) | 装修编辑器,hideTab: true |
父占位 INDEX_ROUTE:path: '/',name: INDEX_ROUTE_NAME('INDEX_ROUTE'),组件为 LAYOUT(@/layout/index.vue)。redirect 不在配置里写死为 /,由守卫在拿到菜单后设为第一个可进页面,避免自引用死循环。
动态路由
- 守卫确认有 token,且尚未
isRoutesInited时调用userStore.getUserInfo()/fetchMenus() filterAsyncRoutes(rawRoutes)把后端MenuInfo转成RouteRecordRaw[]findFirstValidPath找第一个meta.type === 2、未隐藏、非外链的 path,赋给INDEX_ROUTE.redirectrouter.addRoute(INDEX_ROUTE),再把子路由挂到INDEX_ROUTE_NAME下userStore.setRoutes(accessedRoutes),next({ ...to, replace: true })
工具函数(均在 router/index.ts):
loadRouteView(component):import.meta.glob('../views/**/*.vue')按路径加载;找不到则降级 404createRouteRecord:拼 path/name/meta;component === 'LAYOUT'用RouterView;菜单类型(type === 2)用具体页面getModulesKey/getRoutePath/resetRouter:调试、按权限码反查 path、登出清动态路由
meta 映射:hidden、keepAlive←cache、title、perms←permission、icon、type、activeMenu。
守卫行为摘要
permission.guard(createPermissionGuard)
- 白名单:
/login、/403、/404、/500 - 无 token → 登录页并带
redirect - 有 token 且用户信息与路由已就绪 → 放行(访问登录页则进
/) - 初始化失败 →
clearAuthInfo()后回登录 NProgress控制顶栏进度;afterEach结束进度条
auth.guard(createInitGuard)
- 非登录页且
appStore.config为空时调用getConfig(),并按返回的site_favicon更新 favicon
History 模式:createWebHistory(import.meta.env.BASE_URL),与 Vite base: '/admin/' 一致。