Lv, Qi b90388b76e feat: add task display names and improve report page UX

- Backend: Add display_name to TaskNode and DagNode for human-readable names
- Frontend: Update visualizer and tabs to use display_name
- UX: Implement global scrolling layout for ReportPage
- UX: Add sticky behavior with visual feedback for Workflow Sidebar
- UX: Fix RealtimeLogs scrolling and layout issues

2025-11-28 01:01:17 +08:00

2.3 KiB

Raw Blame History

[Pending] 为工作流任务添加人类可读名称 (Display Name)

背景

目前，前端在显示任务名称时使用的是任务 ID（例如 analysis:news_analysis，或者是经过简单格式化后的 news analysis）。然而，真正的人类可读名称（例如 “新闻分析”）是定义在 AnalysisTemplate 配置中的，但这些名称并没有通过工作流事件传播到 WorkflowOrchestrator 或前端。

目标

确保前端可以在工作流可视化图表（Visualizer）和标签页（Tab Headers）中显示模板中定义的本地化/人类可读的任务名称。

需要的变更

1. Common Contracts (`services/common-contracts`)

文件: src/workflow_types.rs 或 src/messages.rs
行动: 更新 TaskNode 结构体（用于 WorkflowStateSnapshot），增加一个 display_name (Option<String>) 字段。
行动: (可选) 如果我们需要实时更新也携带名称，可以更新 WorkflowTaskEvent，虽然对于静态拓扑来说，快照（Snapshot）通常就足够了。

2. Workflow Orchestrator Service (`services/workflow-orchestrator-service`)

文件: src/dag_scheduler.rs
行动: 在通过 add_node 添加节点时，接受一个 display_name 参数。
文件: src/workflow.rs
行动: 在 build_dag 函数中，遍历 template.modules 时：
- 提取 module_config.name（例如 “新闻分析”）。
- 在创建 DAG 节点时传递这个名称。

3. Frontend (`frontend`)

文件: src/types/workflow.ts
行动: 更新 TaskNode 接口以匹配新的后端 DTO。
文件: src/components/workflow/WorkflowVisualizer.tsx & src/pages/ReportPage.tsx
行动: 如果 node.display_name 存在，则优先使用它；否则回退到使用 formatNodeName(node.id)。

替代方案 / 临时方案 (纯前端)

由于前端已经（通过 useAnalysisTemplates hook）获取了 AnalysisTemplate，我们可以：

从 URL 参数中获取当前的 templateId。
查找对应的模板定义。
创建一个映射表：module_id -> module_name。
在 ReportPage 和 WorkflowVisualizer 中使用此映射表来动态解析名称。

优先级

中等 - 能够显著改善用户体验 (UX)，但现有功能不受影响。

2.3 KiB Raw Blame History Unescape Escape