admin-dashboard

用途

该技能用于扩展和修改管理后台（Admin Dashboard）、开发者门户（Developer Portal）与运维控制台（Operations Console），适用于新增管理标签页、指标、监控功能或内部工具，并遵循项目已建立的模式。

架构概览

• /admin：管理仪表盘（用户指标、访问控制、审计）
• /dev：开发者门户（文档、代码浏览器、功能地图）[规划中]
• /ops：运维控制台（基础设施、日志、事件）[规划中]

完整设计规范见 docs/ADMIN-DEVELOPER-SUITE.md。

当前管理仪表盘结构

位置：src/app/admin/page.tsx

现有标签页：

标签页	用途	数据源
Overview	快速统计（用户、签到、消息）	/api/admin/stats
Funnel	用户参与瀑布	/api/admin/stats
Page Views	按页面路径分析	/api/admin/stats
Users	带活动的用户名单	/api/admin/stats
Access Requests	待处理/已批准/已拒绝请求	/api/admin/access-requests
Allowed Emails	邮箱白名单管理	/api/admin/allowed-emails
Email Templates	预览系统邮件	本地数据

规划中的标签页（来自设计）：

标签页	用途	状态
Production Health	API 延迟、Core Web Vitals	待定
Error Tracking	HIPAA 安全错误聚合	待定
External Services	Anthropic、DB、Push 状态	待定
AI Analytics	对话指标、令牌	待定
Audit Logs	HIPAA 合规查看器	待定

添加新管理标签页

1. 创建标签页内容组件：在 src/app/admin/page.tsx 中新增标签页组件，使用 useState 与 useEffect 获取数据，示例中定义了 ProductionHealthTab，通过 fetch('/api/admin/metrics') 获取指标，并使用 StatCard 展示 Uptime、Avg Latency、Errors (24h)、Active Users。

2. 将标签页加入标签列表：在 tabs 数组中添加 { id: 'health', label: 'Production Health' }。

3. 添加标签页内容渲染器：在 renderTabContent 的 switch 中新增 case 'health'，返回 <ProductionHealthTab />。

创建管理 API 端点

模式：管理统计端点。示例文件 src/app/api/admin/metrics/route.ts 展示了完整流程：

1. 使用 requireAdmin() 检查管理员访问权限，未通过返回 403。
2. 使用 createRateLimiter 应用速率限制，超出返回 429 并附带限制头。
3. 使用 logAdminAction 记录管理员操作（AuditAction.ADMIN_STATS_VIEW）。
4. 获取并返回数据（getAPIMetrics）。

关键模式

StatCard 组件：接收 label、value、trend（up/down/neutral）、status（good/warning/error），使用圆角边框卡片展示。

数据获取模式：使用 SWR 或 React Query 实现实时更新，示例 useAdminMetrics 使用 useSWR 并设置 refreshInterval: 30000（每 30 秒刷新）。

HIPAA 安全错误展示：ErrorList 组件仅展示 error.type、error.path、error.count、error.affectedUsers，明确不展示用户 ID，也不展示包含 PHI 的错误消息。

管理功能数据库表

现有表：adminUsers（管理员角色分配）、allowedEmails（邮箱白名单）、accessRequests（访问请求队列）、auditLog（HIPAA 审计追踪）、pageViews（导航分析）。

规划中的表（来自设计）：api_metrics（API 计时数据）、app_errors（聚合错误）、service_health（外部服务状态）、conversation_analytics（AI 聊天元数据）、incidents（事件追踪）。

访问控制

管理路由始终使用 requireAdmin()。对于仅超级管理员可用的功能，检查 admin.role !== 'super_admin' 并返回 403。

测试管理功能

使用 vi.mock 模拟管理员认证，示例中 requireAdmin 返回 { id: 'test-admin', role: 'admin' }。测试用例包括：已认证管理员返回 200；非管理员返回 403。

设计资源

完整设计规范：docs/ADMIN-DEVELOPER-SUITE.md。设计系统：使用 src/components/ui/ 中的现有组件。颜色：遵循治疗性调色板（navy、teal、coral、cream）。

限制

资料未提供该技能的安装方式、收费模式、支持平台或具体效果数据，这些信息暂未提供。