跳转至

P0.UA13-capture-toolbar-multi-widget · 顶栏 capture 弹框 + 多 widget 同 groupId 抓取 + 多曲线叠加渲染 + LeftDock § Workspace 扩展(议题 4 capture 类 Smaart 主体)

Worker:ClaudeA · 部门:前端 · 预计:1.5d · 优先级:P1 · 状态:ready

🔍 触发与解锁链

前置已就位: - ✅ F4 0111d16 realtimeRunStore + 顶栏 ▶/■ 单按钮(已挂 📸/🔄 占位 emit · 留 fork 7) - ✅ F6 92445f5 SmartStorageEngine v2 captures + testProjects store + LEGACY 迁移 - ✅ F1+F2+F3 后端 realtime/builtin-link/audio-device 三件套全 zombie - ⚠️ F5 P0.UA13-input-output-device-config-panel 仍 dispatched(ClaudeA 在跑 LeftDock § Engine 扩展 · 本 fork 严禁动 EnginePanel.vue 范围)

本 fork 解锁:F8 P_e2e.UA13-truth(议题 4 e2e capture 真值)

任务定义(基于 ADR-13 §2.6+§2.7+§2.8+§3.4 议题 4 capture 类 Smaart)

落地 4 大子能力,严守 ADR-12 §3 7 widget 业务行为契约不动: 1. 顶栏 capture 弹框:📸 触发 → 弹框命名 + description + 勾选 widget(默认全选)+ Confirm → 多 widget 同 groupId 抓取 + 落 IDB v2 captures store + 物理目录 2. 顶栏 recapture 同名替换:🔄 触发 → 弹框确认 → 同 captureGroupId 数据更新 + modifiedAt 刷新 3. 多曲线叠加渲染:7 widget(rms / fft / phase / transfer / waveform / electrical / recorder)各自加 capture overlay 子能力 · 加载 capture 列表 · 显隐勾选驱动 trace 渲染 4. LeftDock § Workspace 扩展:在现有 WorkspacePresetPanel.vue(b4a8ea2 已就位)末尾追加 § Test Project + § Captures 两段(❌ 不动 § Layout Preset)

完整 prompt(直接复制粘贴 worker 终端)

[U-thread] P0.UA13-capture-toolbar-multi-widget · ADR-13 §5.3 fork 7
[部门] 前端 P0(xishell)
[Worker CWD] d:/work/25_claude/workspace/AlgoDepartment/04_development/
[Occupies] P0.K-shared-xitest + P0.K-storage-engine
[优先级] P1 · 🧵 file
[ADR] docs/08-implementation/40-aios/ADR/ADR-AIOS-13-xitest-realtime-dual-mode.md(必读 §2.6 § 2.7 §2.8 §3.4 §11)
[参考文档]
  - ADR-13 §3.4 业务行为契约 5 项必填(① CaptureRecord/TestProject schema ② 收敛判据 4 项 ③ 失败回退 3 类 ④ 用户操作流 3 路径 ⑤ e2e 真值)
  - ADR-13 §11 Ximind 兼容性(description 字段 + structured RealtimeError + audit log)
  - ADR-12 §3 7 类 MeasurementNode 业务行为契约(❌ 不动)
  - 范式参考 commit `92445f5` storage/storage-engine.ts v2 + `0111d16` realtimeRunStore + `b4a8ea2` WorkspacePresetPanel.vue(LeftDock 三段范式)

【背景】
  ADR-13 议题 4 capture 类 Smaart · F6(`92445f5`)IDB v2 captures+testProjects store 已就位 · 8 个 IStorageEngineV2 方法可调。
  F4(`0111d16`)realtimeRunStore + 顶栏 ▶/■ 已就位 · 顶栏 capture/recapture 留 emit hook · 本 fork 接入业务。
  目标 = Smaart Suite + APX500 风格 capture · 用户操作流 = 跑 realtime → § Test Project + → 顶栏 📸 → 命名 + 勾选 → 4 widget 同 groupId 落盘 → § Captures 显隐勾选叠加显示。

【执行步骤】
  Step 1 · 真值核查(F6 + F4 现状)
    - read storage/storage-engine.ts(v2 IDB 接口 8 方法 · listCaptures/createCapture/updateCapture/deleteCapture 等签名)
    - read stages/xitest/index.vue(F4 0111d16 顶栏 capture/recapture handler 占位位置)
    - read stages/xitest/drawers/WorkspacePresetPanel.vue(b4a8ea2 三段 § Layout Preset 范式 · 不动)
    - read 7 widget 现有结构(rms / fft / phase / transfer / waveform / electrical / recorder · 找到 trace 渲染位置 · 评估 overlay 注入点)

  Step 2 · 顶栏 capture 弹框组件
    - 新建 components/CaptureDialog.vue(props: open / mode='capture'|'recapture' / defaultName / availableWidgets / existingCaptureGroup)
    - 字段:name(autocomplete 默认 `<YYYY-MM-DD-HHmm>__multi__<slug>`)+ description(textarea)+ widgetTypes 多选(默认全选)+ duplicateName 警告
    - emit: confirm(payload) / cancel
    - 严守:不嵌入完整 SFC > 60 行(参考 ADR-13 §2.6 弹框设计)· design-token 主题色 + 横竖屏响应式

  Step 3 · 顶栏 capture handler 接入
    - stages/xitest/index.vue · realtime-capture handler:① 获取 activeTestProject(若无 → 弹框引导新建)② 打开 CaptureDialog mode='capture' ③ confirm → 调 storageEngine.createCapture()×N(每个 widget 一个 record · 共享 captureGroupId = uuid)+ 4 文件落对应物理目录
    - realtime-recapture handler:① 找当前 widget 的 captureGroup ② 打开 CaptureDialog mode='recapture' ③ confirm → updateCapture()×N 同 groupId
    - 严守:不动 F4 0111d16 realtimeRunStore schema + 不动 F5 EnginePanel.vue 范围(❌ 不动 § Engine 三段 / § Device / § Signal Config 段)

  Step 4 · LeftDock § Workspace 扩展(WorkspacePresetPanel.vue 追加)
    - 在现有 § Layout Preset(b4a8ea2)下方追加 § Test Project + § Captures 两段
    - § Test Project:Active dropdown + [+ New Project] / [Rename] / [Delete] 按钮 · 调 storageEngine testProjects API
    - § Captures:按 widgetType 分组列表(▼ FFT (3) ☑ ☐ ☑ · ▶ RMS (2)..)· 勾选驱动 widget overlay 显隐 · design-token 区分颜色
    - 严守:❌ 不动 § Layout Preset 段 · 仅在 panel 末尾追加 · 类似 b4a8ea2 风格

  Step 5 · 7 widget 多曲线叠加渲染(子能力)
    - 每个 widget 加 props: overlayCaptures?: CaptureRecord[] + computed traces(主 realtime trace + N 历史 trace)
    - Canvas 离屏 + RAF 节流(历史 trace 静态 1 次 · 实时 trace 30fps 重画 · 见 ADR-13 §2.7 多曲线叠加渲染段)
    - 严守:❌ 不改 7 widget 现有 trace 渲染逻辑 · 仅注入 overlay 子能力 · ADR-12 §3 业务行为契约不动

  Step 6 · vitest 测试(≥ 12 cases · 覆盖核心)
    - CaptureDialog.spec.ts(open/cancel/confirm/duplicateName)
    - capture-handler.spec.ts(4 widget 同 groupId / recapture 同名替换 / 无 testProject 引导新建)
    - WorkspacePresetPanel-captures.spec.ts(§ Test Project + § Captures 两段渲染 · 不动 § Layout Preset)
    - widget-overlay.spec.ts(7 widget × overlay 子能力 trace 渲染)
    - 验收:typecheck 0 errors + vitest 全过 · 测试基线 +12 用例(从 365 → 377+)

  Step 7 · commit + 三元组 trailer
    git add . && git commit -m "feat(xitest/realtime-capture): F7 P0.UA13-capture-toolbar-multi-widget · ADR-13 §5.3 fork 7

    capture/recapture 弹框 + 多 widget 同 groupId 抓取 + LeftDock § Test Project/§ Captures + 7 widget overlay 子能力。

    [step=7/7] [pid=P0] [uid=UA13-capture-toolbar-multi-widget]
    [occupies=P0.K-shared-xitest+P0.K-storage-engine] [files=N]"

【验收】
  ☐ typecheck 0 errors · vitest 全过(基线 365 → 377+)
  ☐ ADR-13 §3.4 业务行为契约 5 项 e2e 真值(本 fork 实施 ④ 用户操作流 3 路径 + ⑤ 端到端 capture 4 widget 同 groupId 真值留 F8)
  ☐ 不动 F5 EnginePanel.vue / § Engine / § Device / § Signal Config 范围(grep diff 验证)
  ☐ 不动 ADR-12 §3 7 widget 现有 trace 业务逻辑(仅加 overlay 子能力)
  ☐ 不动 § Layout Preset(b4a8ea2)· 仅在 WorkspacePresetPanel 末尾追加两段
  ☐ description 字段全填(CaptureRecord + TestProject)Ximind 兼容
  ☐ design-token 主题色 + 横竖屏响应式(全局红线 #1 #2)

【禁止】
  ❌ 不实施 capture 跨 testProject 复制(ADR §4.3 Non-Goals)
  ❌ 不实施 capture 导出 CSV/WAV(本期仅 JSON · ADR §4.3)
  ❌ 不动 contract-v1.0(已 frozen)
  ❌ 不动 ADR-12 §3 7 widget 业务行为契约(已 e2e zombie `3a8d376`)
  ❌ 不嵌入完整 SFC > 60 行 / TS interface > 5 行(.clinerules v1.6 prompt 内容硬约束)
  ❌ 不动 F5 P0.UA13-input-output-device-config-panel 范围(EnginePanel.vue · § Engine/§ Device/§ Signal Config 段 · ClaudeA 内部串行避 race)
  ❌ 不主动联动 ADR-08 子图系统(realtime 用 builtin link · 不嵌 subgraph · ADR §4.3)

解锁链(本任务 zombie 后)

  • ✅ F8 P_e2e.UA13-truth(ClaudeC · 0.5d · e2e 真值脚本 4 议题全验)→ ADR-13 整体闭环 🏆

风险评估

风险 缓解
与 F5 ClaudeA 内部 race(同 LeftDock) F5 改 § Engine + § Device + § Signal Config(EnginePanel.vue)· F7 改 § Workspace(WorkspacePresetPanel.vue)· 文件正交 · prompt 显式禁止
7 widget overlay 子能力工作量大 复用 Canvas 离屏 + RAF 节流 · 历史 trace 静态 1 次 · 不改现有业务逻辑
IDB v2 写入延迟(4 widget 同时 capture) F6 已实装双层 SmartStorageEngine(<100KB localStorage · ≥100KB IDB)· 异步写 · UI 不阻塞
多曲线渲染 30fps 卡顿 历史 trace 不重画 · 仅主实时 trace 重画 · design-token 颜色区分(限 5-8 trace)

历史

时间 事件 hash
2026-06-02 14:35 dispatched(ADR-13 fork 6 zombie 解锁 · F7 起 · v1.9 沿用旧 UID 因 ADR-13 沿用 UA13 命名) —