Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
2.1 KiB
2.1 KiB
WR-2 STUDIO 模式基础能力
目标
把 STUDIO 从静态示意画布升级为“可编辑的最小编排画布”。
范围
- NodePalette 节点面板
- FlowCanvas 本地状态
- 节点选中、拖拽、删除
- SVG 连线
- Inspector 与节点配置联动
具体任务
1. 节点模型落地
建立前端类型:
FlowNodeFlowEdgeFlowHandleOrchestrationDraft
补充最小字段:
idtypelabelrolepositionconfigstatus
2. NodePalette
按 spec 至少支持:
- Trigger
- Agent
- Tool
- Condition
- Memory
第一版可先做“点击添加到画布”,第二版再补完整拖拽源体验。
3. 画布交互
最小要求:
- 新增节点
- 选择节点
- 移动节点
- 删除节点
- 建立连接
- 画布缩放和平移
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
验收标准
- STUDIO 中至少能完成一个最小链路:
- Trigger -> Agent -> Condition -> Output
- Inspector 会随着选中节点切换。
- 删除节点后相关连线同步清理。
- 从 FIXED 实例化进入 STUDIO 不丢节点数据。
风险与约束
- 默认不引入新依赖,画布能力优先原生实现。
- 若原生方案复杂度失控,再单独评估依赖引入,不在本阶段默认实施。
验证建议
- 交互测试:
- 节点新增
- 节点删除
- 连线创建
- Inspector 更新
- 手测:
- 缩放和平移
- 复杂布局下的线条表现