前言¶

在 DeepSeek Harness（DSH）里跑多智能体协作时，队长、成员、共享任务和依赖关系往往散落在会话状态或工具输出里，要靠脑补才能对齐「谁在做哪件事、哪条边还没满足」。桌面端 cc-haha 已经有一套成熟的 Agent Teams 视觉语言；若在 Web / Desktop 的 DSH 输入区上方也能看到同一套泳道与连线，排查并行与阻塞会直观很多。下面介绍社区插件 dsh-team-canvas（维护者 lj100886，分类：工作流），它把 cc-haha 的布局与路径算法移植进 DSH，并接上当前会话的 Agent Teams 投影。

这是什么¶

dsh-team-canvas 是 DSH 插件：在会话输入框上方注入一块 Agent Teams 可视化画布——队长居中、成员在下，任务按依赖深度分泳道排列，中间用 SVG 贝塞尔虚线标出任务依赖、队长总线、成员 peer 总线与「正在执行」的 tether。布局常量与几何算法来自 cc-haha 的 desktop/src/components/agentTeams/（MIT），不是近似重画。

• 目录页：skillhub.cn/plugins/lj100886/dsh-team-canvas
• 源码：github.com/lj100886/dsh-team-canvas
• 许可证：MIT；当前 package 版本 2.1.0（以仓库为准）
• 要求：DSH >=0.2.0，Node >=20.18；注入槽位 conversation.input.dock，客户端依赖 @deepseek-ai/dsh-client-ui-conversation

DSH 生态是「一切皆插件」；SkillHub 等社区目录独立于 DeepSeek / 幻方，本文仅作插件能力说明，不代表官方应用商店条目。

面板里有什么¶

打开会话后，输入框上方会出现 Agent Teams 面板（团队名、实验特性标签等以宿主为准）。README 中的示意结构包括：

1. 统计行：并行执行、完成、进行中、待办等计数。
2. 团队区：队长卡片居中，成员卡片在下方一排；队长总线与成员 peer 总线用折线虚线连接。
3. 任务泳道：共享任务按「最长依赖路径」分层——无依赖可立即做的任务在最左，后继任务向右递进；任务卡带状态徽章。
4. 通讯侧栏：全部 / 报告 / 私信等 Tab；当前投影未携带团队消息流，无数据时显示占位空态（见下文「注意」）。
5. 图例：依赖未满足、依赖已满足、正在执行、刚解锁、飞行中等连线语义。

卡片为绝对定位 DOM，连线叠在同一区域的 <svg> 上，共用 TASK_WIDTH、TASK_HEIGHT、LANE_TOP、MEMBER_PITCH 等常量，主题切换时不易错位。

四类连线¶

连线是插件的核心展示逻辑，README 归纳为四条：

依赖边路径示例（与仓库 README 一致）：

function dependencyPath(from, to) {
  const fromX = from.x + TASK_WIDTH
  const fromY = from.y + TASK_HEIGHT / 2
  const toX   = to.x
  const toY   = to.y + TASK_HEIGHT / 2
  const middle = fromX + (toX - fromX) / 2
  return `M ${fromX},${fromY} C ${middle},${fromY} ${middle},${toY} ${toX - 5},${toY}`
}

泳道深度对带环图与缺失节点有兜底：访问中再次遇到同一 id 时深度回退为 0，缺失任务 id 同样回退为 0，避免布局算崩。

数据从哪来¶

已实现：完整布局引擎、四类 SVG 连线、状态徽章、通讯面板 UI、亮暗主题、i18n（zh/en，键位一致）、实时 Agent Teams 投影接入。

数据主路径是当前会话的 state.projectionsBySession[sessionId].values.agentTeam——roster、共享任务、依赖边、执行态均读该投影。若会话里还没有团队，则回退到本会话的 todo_write 工作清单；两者都没有时显示空态。

未接入：团队消息流内容；通讯面板暂无真实消息，仅为占位。

安装与启用¶

在 Desktop profile 下添加插件（命令来自仓库 README）：

dsh plugin --profile desktop add dsh-team-canvas

重启 DSH 后，打开任意会话，输入框上方应出现面板。本地开发可用 dsh plugin --profile desktop add file:/path/to/dsh-team-canvas 指向已下载的插件目录（路径换成你机器上的实际位置）。

安装前建议浏览 GitHub 源码与 MIT 许可证；插件以当前 DSH 进程权限运行，与安装任意社区插件一样需要自行评估信任边界。

主题与成员色¶

主体配色走宿主主题 token，亮色/暗色自动跟随，例如：

• --dsw-alias-bg-layer-1/2/3：背景层次
• --dsw-alias-border-l2：边框与虚线
• --dsw-alias-label-primary/2/3：文字层次
• --dsw-alias-state-business-primary：强调色
• --dsw-alias-state-success-primary：完成态

成员身份色是例外：八名成员需要稳定区分，宿主单一强调色不够，因此在样式表中用 --tc-m0 … --tc-m7 固定色相，饱和度与明度通过 color-mix() 从 --tc-accent 派生；client.js 只引用变量，避免把 color-mix() 写进 SVG stroke（会导致连线不显示）。

典型用法¶

无需单独配置文件：安装并重启后，在已启用 Agent Teams 或存在 todo_write 的会话中打开对话即可。

1. 创建或进入一个使用 Agent Teams 的 DSH 会话，等待投影更新。
2. 在输入框上方查看队长/成员与泳道任务卡，对照虚线判断依赖是否满足、谁在执行哪张卡。
3. 若尚无团队数据，可依赖同会话的 todo_write 作为回退视图，直到 agentTeam 投影出现。

维护者在仓库中提供静态自检（开发插件时可用，不依赖宿主联网）：

node scripts/check-locale.mjs
node scripts/check-accents.mjs

或执行 npm run check（等同上述两条）。

适用场景与注意¶

适合：在 DSH Web / Desktop 上做多智能体任务编排、需要一眼看清 DAG 与执行 tether 的开发者；习惯 cc-haha 泳道语义、希望在 Harness 里复用同一套布局的读者。

注意：

• 平台：Web / Desktop；DSH >=0.2.0，Node >=20.18。
• 通讯侧栏目前无真实消息流，不要把它当作团队协作聊天记录。
• 社区目录星标等元数据以 SkillHub / GitHub 页面为准（撰写时 GitHub 星标为 0）。
• 插件非 DeepSeek 官方发行物；安装前请自行审阅 lj100886/dsh-team-canvas 源码。

结尾¶

dsh-team-canvas 把 Agent Teams 的泳道、依赖 DAG 与四类 SVG 连线搬进 DSH 会话输入区，数据跟 agentTeam 投影（及 todo_write 回退）走，主题与 i18n 已对齐宿主。若你正在 Harness 里调试多智能体工作流，可以先按 README 安装，再在真实会话里对照连线状态排查阻塞。

• 目录：https://www.skillhub.cn/plugins/lj100886/dsh-team-canvas
• 仓库：https://github.com/lj100886/dsh-team-canvas