4.1 KiB
4.1 KiB
Agent Dashboard 页面设计规格
概述
为 Jarvis 系统设计一个 Agent 管理页面，以全息战术投影（Holographic Tactical HUD）风格可视化展示 Master + 4 Sub-Agent 的组织架构，支持查看状态和配置。
视觉风格
- 主题：全息战术投影（科幻指挥台）
- 背景：#03050a 深空黑 + 微弱网格线 + 全息扫描线纹理
- 节点样式：半透明玻璃态卡片，悬浮空中，全息光晕边框
- 字体：Orbitron（标题）+ JetBrains Mono（正文）
- 配色：Cyan #00f5d4 主色，Amber #f9a825 强调色，Red #ff4757 危险色
布局结构
┌──────────────────────────────────────────────────────────┐
│ AGENT COMMAND CENTER [刷新] [新增] │
├──────────────────────────────────────────────────────────┤
│ │
│ ┌─────────────────────┐ │
│ │ MASTER CORE │ │
│ │ JARVIS 指挥官 │ │
│ │ [●] 状态灯 │ │
│ └─────────┬──────────┘ │
│ │ │
│ ┌───────────────┼───────────────┐ │
│ ▼ ▼ ▼ │
│ ┌───────────┐ ┌───────────┐ ┌───────────┐ │
│ │ PLANNER │ │ EXECUTOR │ │LIBRARIAN │ │
│ │ [●] │ │ [●] │ │ [●] │ │
│ │ 规划者 │ │ 执行者 │ │ 知识官 │ │
│ │ 调用:12 │ │ 调用:8 │ │ 调用:5 │ │
│ └───────────┘ └───────────┘ └───────────┘ │
│ │ │
│ ▼ │
│ ┌───────────┐ │
│ │ ANALYST │ │
│ │ [●] │ │
│ │ 分析师 │ │
│ │ 调用:3 │ │
│ └───────────┘ │
│ │
└──────────────────────────────────────────────────────────┘
点击节点 → 右侧滑出配置抽屉
节点卡片字段
- 名称（Orbitron）
- 角色标签（中文）
- 状态灯：绿色脉冲=活跃，灰色=空闲
- 角色描述（2行）
- 调用次数（今日）
- 当前任务摘要
连接线
- 虚线连接 Master → Sub-Agent
- 任务触发时：琥珀色脉冲光点沿路径流向目标节点
配置面板（右侧抽屉 400px）
- Agent 名称
- 角色描述
- 系统提示词（textarea）
- 启用/停用开关
- 保存 / 重置按钮
数据来源
- 固定结构：前端
src/data/agents.ts - 运行时状态：
/api/agents/stats
API 设计
GET /api/agents/stats → { agent_id, call_count, current_task, status }
GET /api/agents/config/{id} → 返回单个 Agent 完整配置
PUT /api/agents/config/{id} → 更新 name/description/system_prompt/enabled