Workflow Tab 合并 Timeline 需求【免费下载链接】cannbot-skillsCANNBot 是面向 CANN 开发的用于提升开发效率的系列智能体本仓库为其提供可复用的 Skills 模块。项目地址: https://gitcode.com/cann/cannbot-skills目标将 Timeline Tab 合并到 Workflow Tab减少 Tab 数量提供统一的工作流分析入口。Tab 结构变更合并前 (8个Tab): [Overview] [Turns] [Workflow ✦] [Timeline] [Subagents] [Skills] [Interactions] [Workflow (AI)] 合并后 (7个Tab): [Overview] [Turns] [Workflow ✦] [Subagents] [Skills] [Interactions] [Workflow (AI)]Workflow Tab 内部结构顶部汇总条保留3 Phases │ 27 Steps │ 3 Checkpoints │ Active: 1.5h │ Wait: 6.5h │ 18.8%子视图切换[ 树形] [ 时间线] [ 流程图]子视图 1树形视图现有 WorkflowTreeView保留现有功能不变Phase → Step → Checkpoint 树形展示子视图 2时间线视图合并自 TimelineGantt在现有 Gantt 图基础上增强增强项Phase 背景色块时间轴顶部用半透明色块标记 Phase 边界Phase 名称标注在色块上方颜色Phase1蓝, Phase2绿, Phase3橙Checkpoint 标记在时间轴上用 ⛔/⚪ 图标标记 CP 位置等待时间用灰色虚线条表示hover 显示等待时长按 Agent Type 分行现有build / general / architect / developer 各占一行执行条增强Hover tooltipsubagent name, duration, tokens, status点击展开详情面板inline颜色按 subagent type 区分并行执行用虚线框包围时间轴刻度增强增加绝对时间刻度10:28, 11:00, 12:00...保留相对时间刻度0min, 60min, 120min...可切换显示模式图例右上角小图例说明颜色含义子视图 3流程图视图可选后续Mermaid DAG 图显示阶段 → 步骤的依赖关系联动交互树形视图点击 Step → 切换到时间线视图并高亮对应执行条时间线视图点击执行条 → 切换到树形视图并展开对应 Step两个视图共享选中状态删除内容删除独立的 Timeline Tab删除TimelineGantt组件逻辑合并到WorkflowTimelineViewpage.tsx 中 TabKey 去掉 timeline新增文件文件说明WorkflowTimelineView.tsx增强版时间线基于 TimelineGantt 重构WorkflowViewSwitcher.tsx子视图切换控件修改文件文件说明WorkflowTreeView.tsx添加联动逻辑page.tsx删除 Timeline TabWorkflow 内嵌子视图切换TimelineGantt.tsx删除或标记废弃预估工时子视图切换控件1h时间线增强phase色块 CP标记 tooltip 颜色4h树形 ↔ 时间线联动2h删除旧 Timeline Tab 清理0.5h测试1h总计~8.5h【免费下载链接】cannbot-skillsCANNBot 是面向 CANN 开发的用于提升开发效率的系列智能体本仓库为其提供可复用的 Skills 模块。项目地址: https://gitcode.com/cann/cannbot-skills创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考