import type { AdminNavItem } from "./types";
export const adminMenu: AdminNavItem[] = [
{
key: "applications",
hash: "#/applications",
icon: "apps",
label: "客户端应用",
title: "客户端应用",
subtitle: "维护 OpenID Connect 客户端、回调地址与授权范围",
accent: "cyan",
},
{
key: "authorizations",
hash: "#/authorizations",
icon: "verified_user",
label: "授权记录",
title: "授权记录",
subtitle: "查看当前用户授权并按需撤销客户端访问",
accent: "emerald",
},
{
key: "tokens",
hash: "#/tokens",
icon: "vpn_key",
label: "令牌管理",
title: "令牌管理",
subtitle: "检索访问令牌、刷新令牌与授权码,并执行撤销操作",
accent: "violet",
},
{
key: "access-requests",
hash: "#/access-requests",
icon: "approval",
label: "访问申请",
title: "访问申请",
subtitle: "处理用户对客户端应用的访问权限申请",
accent: "amber",
},
{
key: "grants",
hash: "#/grants",
icon: "assignment_ind",
label: "授权白名单",
title: "授权白名单",
subtitle: "维护允许用户访问的客户端白名单记录",
accent: "rose",
},
];
export const fallbackRoute = adminMenu[0];
⚠⚠ 以下内容为AI分析的结果,请根据实际情况进行判断。
代码解释
这是一个 TypeScript 配置文件,用于定义管理后台的导航菜单结构。
主要内容
1. 类型导入
import type { AdminNavItem } from "./types";
从同级目录的 types 文件中导入 AdminNavItem 类型定义,用于类型约束。
2. 导航菜单配置 (adminMenu)
这是一个包含 5 个菜单项的数组,每个菜单项代表管理后台的一个功能模块:
各菜单项说明:
applications (客户端应用)
- 管理 OpenID Connect 客户端配置
- 图标:apps,主题色:cyan(青色)
authorizations (授权记录)
- 查看和撤销用户授权
- 图标:verified_user,主题色:emerald(翡翠绿)
tokens (令牌管理)
- 管理访问令牌、刷新令牌和授权码
- 图标:vpn_key,主题色:violet(紫罗兰)
access-requests (访问申请)
- 处理用户的应用访问申请
- 图标:approval,主题色:amber(琥珀色)
grants (授权白名单)
- 维护用户访问权限白名单
- 图标:assignment_ind,主题色:rose(玫瑰红)
字段结构:
key: 唯一标识符hash: 路由哈希值(用于单页应用导航)icon: Material Design 图标名称label: 菜单显示文本title: 页面标题subtitle: 功能描述accent: 主题强调色
3. 默认路由 (fallbackRoute)
export const fallbackRoute = adminMenu[0];
设置默认路由为第一个菜单项(客户端应用),当没有匹配路由时跳转到此页面。
应用场景
这个配置文件通常用于:
- 渲染左侧/顶部导航菜单
- 定义路由映射关系
- 提供统一的主题样式配置
- 作为权限控制的数据源
AI 正在分析代码…
评论加载中...