Files
JARVIS/development-doc/plan/war-room-update/phase-wr-2-studio-foundation.md

2.1 KiB

WR-2 STUDIO 模式基础能力

目标

把 STUDIO 从静态示意画布升级为“可编辑的最小编排画布”。

范围

  1. NodePalette 节点面板
  2. FlowCanvas 本地状态
  3. 节点选中、拖拽、删除
  4. SVG 连线
  5. Inspector 与节点配置联动

具体任务

1. 节点模型落地

建立前端类型:

  • FlowNode
  • FlowEdge
  • FlowHandle
  • OrchestrationDraft

补充最小字段:

  • id
  • type
  • label
  • role
  • position
  • config
  • status

2. NodePalette

按 spec 至少支持:

  • Trigger
  • Agent
  • Tool
  • Condition
  • Memory

第一版可先做“点击添加到画布”,第二版再补完整拖拽源体验。

3. 画布交互

最小要求:

  1. 新增节点
  2. 选择节点
  3. 移动节点
  4. 删除节点
  5. 建立连接
  6. 画布缩放和平移

4. Inspector 联动

选中节点后展示:

  • 节点类型
  • 角色/标签
  • 配置摘要
  • 删除/复制/断开操作

5. FIXED 到 STUDIO 的桥接

WR-1 里 INSTANTIATE 生成的草稿,必须能在 STUDIO 中打开并编辑。

建议文件变更

Frontend

  • 新增 frontend/src/pages/war-room/components/stage-studio/StageStudio.vue
  • 新增 frontend/src/pages/war-room/components/stage-studio/NodePalette.vue
  • 新增 frontend/src/pages/war-room/components/stage-studio/FlowCanvas.vue
  • 新增 frontend/src/pages/war-room/components/stage-studio/StudioNode.vue
  • 新增 frontend/src/pages/war-room/components/stage-studio/FlowEdges.vue
  • 扩展 useWarRoomPage.ts

验收标准

  1. STUDIO 中至少能完成一个最小链路:
    • Trigger -> Agent -> Condition -> Output
  2. Inspector 会随着选中节点切换。
  3. 删除节点后相关连线同步清理。
  4. 从 FIXED 实例化进入 STUDIO 不丢节点数据。

风险与约束

  1. 默认不引入新依赖,画布能力优先原生实现。
  2. 若原生方案复杂度失控,再单独评估依赖引入,不在本阶段默认实施。

验证建议

  1. 交互测试:
    • 节点新增
    • 节点删除
    • 连线创建
    • Inspector 更新
  2. 手测:
    • 缩放和平移
    • 复杂布局下的线条表现