feat(rbac-web): 前端页面级权限与「权限与角色」管理页

- 新增 rbac 的 api/types/mock,对接后端 catalog/roles/users;mock 模式与后端 PageCatalog 完全对齐
- EffectivePermissions 增加 allowedPages,auth store 新增 hasPage 判定
- 路由守卫按 route.name = 页面 Key 做页面级放行,无权时跳转到 scope 内首个可访问页面;AppShell 菜单按 hasPage 过滤
- 路由守卫 switchScope 失败自动重试一次;新增懒加载 chunk 失败整页自愈 onError,修复切页白屏
- PermissionGuard hidden 态改为友好空态提示;AuthRoleView 重写为完整的用户/角色/权限编辑界面
This commit is contained in:
zhaowei.huang
2026-05-29 23:51:57 +08:00
parent 37680a0ae7
commit 00cfcf2897
11 changed files with 976 additions and 106 deletions
@@ -1,7 +1,7 @@
<template>
<el-radio-group v-model="current" size="small" @change="onChange">
<el-radio-button label="Platform">管理员</el-radio-button>
<el-radio-button label="RCSMonitor">运营</el-radio-button>
<el-radio-group :model-value="current" size="small" @change="onChange">
<el-radio-button value="Platform">管理员</el-radio-button>
<el-radio-button value="RCSMonitor">运营</el-radio-button>
</el-radio-group>
</template>
@@ -15,15 +15,20 @@ import type { Scope } from '@/types/auth'
const auth = useAuthStore()
const router = useRouter()
// 会话 45 AR-6switchScope 已变成异步(调后端 /auth/switch-scope)。
// computed.set 不能 await,只能 fire-and-forget 并在 catch 里弹错。
const current = computed<Scope>({
get: () => auth.scope ?? 'Platform',
set: (v) => { void switchAndNavigate(v) }
})
// 单向受控 + 仅 @change 触发:避免「v-model set 与 @change 各触发一次」导致的
// 双重 switchScope 请求 / 双重导航竞态(旧实现会让一次点击发起两次切换,
// 偶发造成 scope 与 effectivePermissions 不一致 → 配置页 PermissionGuard 误判隐藏)。
const current = computed<Scope>(() => auth.scope ?? 'Platform')
let switching = false
async function onChange(v: string | number | boolean | undefined) {
await switchAndNavigate(v as Scope)
if (switching) return
switching = true
try {
await switchAndNavigate(v as Scope)
} finally {
switching = false
}
}
async function switchAndNavigate(scope: Scope) {