会话与权限

目标：用同一份最终权限控制页面访问和操作入口，并理解前端控制的边界。

会话从哪里来

packages/app/src/stores/session.ts 提供 useSessionStore。登录调用后端适配器，保存 token 和 viewer；刷新页面后 token 可恢复，用户资料在导航加载时重新获取。

import { useSessionStore } from '@uadmin/app'

const session = useSessionStore()
await session.login({ username, password })
const canEdit = session.can('user:update')

在组件 setup 或内核创建之后使用 store。按钮需要随权限变化更新时，在模板直接调用 session.can(...)，或使用 computed；上面的普通变量只是调用当时的快照。

session.logout() 会请求服务端登出，并在失败时仍清理本地会话。自定义退出 UI 还应清理导航并跳到登录页；不要只删浏览器中的 token 字符串而留下动态路由。

权限如何匹配

@uadmin/protocol 的 hasPermission 是共享规则：

授权	可匹配
user:update	同名权限
user:*	user: 前缀下的权限
*	所有权限

session.can(['user:read', 'user:update'])
session.can(['user:update', 'user:delete'], 'any')

默认要求全部命中；any 表示至少一个。不要把 editor、admin 等角色名直接等同于某个权限集。角色可由后台修改，最终授权以 viewer.permissions 和导航快照为准。

页面与按钮

路由使用 meta.perms: ['user:read']，守卫在导航时检查。按钮通过已注册的指令控制：

<el-button v-perms="'user:delete'">{{ t('users.delete') }}</el-button>

按角色显示内容时使用 v-auth。权限按钮的实际调用仍要处理接口 403：用户可能在页面打开后被撤权，或者直接发送请求。

三个演示账号如何联动

apps/demo/mock/_users.ts 将登录账号关联到系统账号角色；packages/modules/src/mock/index.ts 保存角色权限。修改角色后，新登录和导航快照会读取当前角色配置，停用角色不再贡献权限。

apps/demo/mock/_define.ts 是开发与浏览器共用的鉴权入口。新增业务资源要登记权限映射。演示 token 和固定验证码仅为本地体验，不能复制成真实服务端认证实现。

验收与排障

用 admin 配置角色，再用目标账号登录，分别验证菜单、直接 URL 和写接口。仅验证按钮隐藏不足以证明权限闭环。

若 API 返回 403 而页面仍可见，检查路由权限是否比操作权限宽；“可读但不可写”是合理状态。若普通账号突然有全权，检查角色中是否包含 *。真实环境的错误状态处理见HTTP。