cfdaily
10 KiB
10 KiB
课题7+9 设计方案：AI Native 人机交互 + Dashboard
日期: 2026-05-16 作者: 庞统（副军师）🐦 状态: 设计完成，可结题 前置: 课题1-4、课题6、课题11 已完成设计
一、课题7：AI Native 人机交互
1. 核心问题
v1.0 的交互是"用户点按钮触发操作"——传统 Web 应用。v2.0 要实现 AI Native：AI 主动推送、用户自然语言对话、关键决策拉人、其余自主完成。
2. 四种交互模式
| 模式 | 描述 | 场景 | 人的参与密度 |
|---|---|---|---|
| 沉浸观察 | 用户看 Dashboard 实时状态，不干预 | 任务自主执行中 | 低 |
| 轻触确认 | AI 做完关键步骤，推一个确认卡片给用户 | Checkpoint 验证、风控审批 | 中 |
| 即时对话 | 用户主动找 AI 聊（或 AI 主动找人聊） | 需求变更、异常处理、方向调整 | 高 |
| 被动通知 | AI 完成后推送结果摘要 | 任务完成、日报、异常告警 | 低 |
3. 推送级别分级
| 级别 | 含义 | 推送方式 |
|---|---|---|
| 🔴 Critical | 必须立即处理 | 即时推送（webchat/Signal/Telegram） |
| 🟡 Warning | 需要关注，可稍后 | Dashboard 高亮 + 可选推送 |
| 🟢 Info | 一般进展通知 | Dashboard 记录 |
| 🔵 Silent | 仅记录 | 日志/历史 |
4. 三层信息架构
| 层级 | 名称 | 内容 | 场景 |
|---|---|---|---|
| L1 | 一眼全局 | 活跃项目数、进行中任务数、最近告警 | 扫一眼知道系统在干什么 |
| L2 | 看板视图 | 任务卡片列表、状态、负责人、进度 | 日常浏览和操作 |
| L3 | 详情面板 | 单任务完整上下文（对话、产出、评审、经验） | 深入了解某个任务 |
5. 双入口对等
- Agent 对话（webchat/Signal）= 主交互入口
- Dashboard（Web UI）= 可视化入口
- 共享同一套黑板数据，操作等效
- 可以在 Dashboard 点按钮，也可以直接跟庞统说"暂停任务 xxx"
6. Checkpoint 交互规范
三种 Checkpoint（来自 M3 设计，课题3 挑战/评审体系）：
| Checkpoint 类型 | 颜色 | 交互 | 场景 |
|---|---|---|---|
| 🔍 验证 Checkpoint | 蓝色 #6a9eff | 自动核验 + 人工核验 + 双按钮审批 | 产出物御览确认 |
| 🎯 决策 Checkpoint | 紫色 #818cf8 | 三方案并排对比 + 利弊展示 + 推荐标签 + 御批备注 | 方向选择 |
| 🔧 执行 Checkpoint | 橙色 #f59e0b | 分步打勾 + 命令行高亮 + 进度条 + 验证确认 | 分步执行确认 |
7. 异常通知触发条件
| 触发条件 | 推送级别 | 通知内容 |
|---|---|---|
| Agent 执行失败 | 🔴 | 任务ID + Agent + 错误摘要 + retry 按钮 |
| 任务超时（超过 eta） | 🟡 | 任务ID + 已耗时 + 预估剩余 |
| 重试次数达到上限 | 🔴 | 任务ID + 累计失败次数 + 建议操作 |
| Daemon 健康异常 | 🔴 | 异常类型 + 影响范围 |
| 任务完成 | 🟢 | 任务ID + 产出摘要 + 产出链接 |
| 经验提取完成 | 🔵 | 经验标题 + 关联任务数 |
8. AI Briefing 格式
日报（每天 22:00 自动生成，🟢 级别推送）：
📊 今日战报 (2026-05-16)
━━━━━━━━━━━━━━━━━━━━
📋 完成任务：3 个（动量因子策略、数据清洗、代码审查）
🔄 进行中：2 个（配对交易研究、风控规则开发）
⚠️ 需关注：1 个（task-012 超时，预计 30min）
💰 今日 Token 消耗：127K（预算 200K，剩余 36.5%）
🧠 新增经验：2 条（pytest 参数优化、SQLite 并发保护）
周报（每周日 22:00，🟢 级别）：
- 本周完成任务数/平均耗时
- Agent 利用率（谁最忙谁最闲）
- Token 消耗趋势
- 经验沉淀汇总
- 下周建议
二、课题9：Dashboard 设计
1. 核心原则
- v1.0 已有的 11 个 Tab 页全部保留
- 只有"任务看板"需要重新设计和实现（配合 v2.0 黑板架构）
- 其他 10 个 Tab 功能基本不变，适配新的 Daemon API 即可
2. v1.0 已有 Tab 页（保留，不重新设计）
| Tab | 组件 | 功能 | v2.0 变更 |
|---|---|---|---|
| 🏛️ 军议大厅 | CourtDiscussion |
Agent 间对话/讨论 | 适配新 API |
| 🔌 编排调度 | MonitorPanel |
Daemon/编排状态监控 | 适配新 API |
| 🤺 将军总览 | OfficialPanel |
Agent 列表/状态/配置 | 适配新 API |
| 🤖 模型配置 | ModelConfig |
LLM 模型选择/参数 | 适配新 API |
| 🎯 技能配置 | SkillsConfig |
Skill 注册/启用/禁用 | 适配新 API |
| 🔭 传令巡哨 | SessionsPanel |
Agent session 列表/状态 | 适配新 API |
| 💰 花费总览 | UsagePanel |
Token 消耗/预算/趋势 | 适配新 API |
| 📜 奏折阁 | MemorialPanel |
已完成/已取消任务归档 | 适配新 API |
| 📋 任务模板 | TemplatePanel |
任务模板管理 | 适配新 API |
| ⚙️ 系统设置 | SettingsPanel |
Daemon 配置/项目管理 | 适配新 API + 课题11 项目管理 |
3. 需要重新设计的 Tab
📜 任务看板（EdictBoard）— 重新设计 + 重新实现
v1.0 现状：基于 moziplus v1 DAG 架构的任务列表，状态是 v1 的状态机（pending/planning/executing/completed/failed/cancelled）。
v2.0 重设计：
3.1 任务卡片
┌─────────────────────────────────────────────┐
│ 📜 task-013 动量因子策略回测 │
│ 项目: quant-momentum | 状态: executing 🔄 │
│ 负责: 张飞⚔️ | 进度: ████░░ 67% │
│ ⏱️ 已耗时 12min | 📊 3/5 节点完成 │
│ ⚠️ 1个告警 │
│ ─────────────────────────────────────────── │
│ [暂停] [取消] [查看详情] │
└─────────────────────────────────────────────┘
3.2 任务详情面板（TaskModal v2）
点击任务卡片展开详情，包含：
| 区域 | 内容 |
|---|---|
| 基本信息 | 标题、需求描述、项目、创建时间 |
| 状态流转 | 状态按钮（基于课题3状态机守卫 ACTION_GUARDS） |
| 执行图 | 任务拆解后的节点图（节点状态 + Agent + 产出） |
| Checkpoint | 三种 Checkpoint 面板（验证/决策/执行） |
| Flow Log | 执行日志流（时间线格式） |
| 产出物 | 产出文件预览/下载（来自 ArtifactPanel） |
| 评审记录 | 评审意见 + 评审结果（来自 reviews 表） |
| 关联经验 | 该任务沉淀的经验（来自 experiences 表） |
3.3 项目切换器（配合课题11）
Header 区域新增项目下拉：
三国量化 · 编排台 | [▼ 动量因子策略] | ✅ 同步正常 | 3 个任务
- 下拉列出所有 active 项目
- 切换后任务看板只显示当前项目的任务
- "全部项目"选项显示所有项目的任务（带项目标签）
3.4 推送通知中心
Header 区域新增通知铃铛：
🔔 (3) → 点击展开通知面板
通知面板：
- 按推送级别分组（🔴 > 🟡 > 🟢 > 🔵）
- 每条通知：时间 + 级别图标 + 内容摘要 + 关联任务链接
- 🔴 通知可展开操作按钮（确认/忽略/查看详情）
- 支持标记已读/全部已读
3.5 AI Briefing 页面（新增 Tab）
新增第 12 个 Tab：📊 战报简报
- 日报/周报自动生成（§7.8 定义的格式）
- 趋势图表（完成任务数、Token 消耗、Agent 利用率）
- 经验沉淀摘要
- 下周建议（AI 生成）
4. 技术栈（不变）
- React + Vite + TypeScript + Zustand
- CSS 变量体系：
--bg,--fg,--muted,--acc,--line,--panel,--panel2 - API 层：
api.ts，对接 Daemon HTTP API - 构建产物：
dashboard/dist/，uvicorn 8082 端口直接服务 - UI 参考：OpenClaw Edict UI + Control Center
5. 实时推送机制
选择 SSE（Server-Sent Events）：
- Daemon 端新增
/eventsSSE 端点 - 前端
EventSource监听，收到事件后更新 Zustand store - 事件类型：
task.status_changed、checkpoint.created、notification.pushed、agent.state_changed - 降级方案：SSE 连接失败时退回轮询（当前 v1.0 已有的 5s 轮询）
理由：
- 比 WebSocket 简单（单向推送够用）
- 比 pure 轮询实时性好
- HTTP 兼容性好（代理/防火墙不拦）
6. 开发清单
| # | 任务 | 优先级 | 说明 |
|---|---|---|---|
| 1 | Daemon /events SSE 端点 |
P0 | 实时推送基础 |
| 2 | 任务看板 v2（EdictBoard 重写） | P0 | 核心页面 |
| 3 | TaskModal v2（详情面板） | P0 | 含 Checkpoint/Artifact/Review 集成 |
| 4 | 项目切换器 | P1 | 课题11 前端对接 |
| 5 | 推送通知中心 | P1 | Header 铃铛 + 通知面板 |
| 6 | AI Briefing 页面 | P2 | 日报/周报自动生成 |
| 7 | 其他 10 个 Tab 适配新 API | P1 | 主要是 api.ts 对接 |
| 8 | SSE 降级轮询 | P1 | 连接失败时自动回退 |
三、与其他课题的关系
| 课题 | 关系 |
|---|---|
| 课题1-2（执行模型+事件驱动） | Dashboard 的数据来源 + SSE 事件源 |
| 课题3（挑战/评审） | Checkpoint 面板的交互 + 状态流转按钮 |
| 课题4（拆解+上下文） | TaskModal 中的执行图展示 |
| 课题6（经验沉淀） | AI Briefing 的内容来源 + TaskModal 关联经验 |
| 课题11（多项目） | 项目切换器 + 任务卡片项目标签 |
| M3（Checkpoint+Artifact） | Checkpoint 三种组件 + ArtifactPanel 集成 |
四、结题说明
课题7+9 的设计决策在 v2.6.6 已确定（四种交互模式、推送分级、信息架构、5页结构），本次方案文档补充了：
- ✅ Checkpoint 交互规范（三种类型 + 颜色 + 交互方式）
- ✅ 异常通知触发条件和内容模板
- ✅ AI Briefing 格式（日报/周报模板）
- ✅ v1.0 已有 11 个 Tab 页完整清单和保留策略
- ✅ 任务看板 v2 重新设计（卡片/详情/项目切换/通知中心）
- ✅ 实时推送机制选型（SSE + 降级轮询）
- ✅ 开发清单（8 项，按优先级排序）
剩余工作属于编码范畴，设计层面可结题。