Merge pull request 'Pin the chat timeline and document the preview pane' (#122) from feature/chat-timeline-preview into main

Merged by the timeline task after the owner asked to land the open pull requests.

.task/feature-chat-timeline-preview.md

@@ -0,0 +1,27 @@
+# feature/chat-timeline-preview 任务卡
+
+任务主记录：<PR 链接，task-finish 时填写>；状态：进行中；owner：weichen
+
+## 基线与授权
+
+- 权威仓：ssh://git@git-ssh.u1680832.nyat.app:31411/weichen/Agent-System-Dev.git；目标分支：main；R0（initial_base_sha）= 4adc4cc458f15546e5605dc55843acc26b310c41
+- 工作区：/home/weichen/projects/Agent-System-Dev-wt-feature-chat-timeline-preview（worktree）；分支：feature/chat-timeline-preview
+- 授权与交付终点：用户已批准方案并要求按方案实施到提 PR。允许改 Core / Backend / UI / Frontend 与 Dev 仓 DESIGN.md、推进 gitlink、推送 feature/chat-timeline-preview 并建 PR。合入、部署生产、改写历史不在本次授权内。
+
+## 目标与非目标
+
+- 目标：助手消息按工作时间线呈现（运行中展开，终轮后折成「已工作 X」）；工件以可点击卡片出现；点击在对话右侧多标签预览区打开（docx 按页面版式）；后端拦截没调用工具却声称已生成文件的终轮回复。
+- 非目标：项目文件目录树；服务端 Office 转 PDF；改右栏收件箱/文件列表的业务。
+
+## 同步记录
+
+| 节点 | sync_base_sha | tested_head_sha | checked_at |
+|---|---|---|---|
+| 启动 | 4adc4cc458f15546e5605dc55843acc26b310c41 | 4adc4cc458f15546e5605dc55843acc26b310c41 | 2026-10-01T05:58:53Z |
+
+## 结果与验证（完成后填写）
+
+- 结果：Core / Backend / UI / Frontend 与 Dev 的 `feature/chat-timeline-preview` 已推送。PR：Core #13、UI #24、Backend #37、Frontend #30、Dev #122。合入顺序为 Core、UI，然后 Backend、Frontend，最后 Dev。
+- 验证：同步 `origin/main` 后 `make test` 通过。开发环境已部署 `dev@5192a53`（core d437530、backend ca8aa5d、frontend 0ed8ad3、ui 8bfe8a8）。浏览器实测：终轮折成「已工作 X」并出现文件卡片；点击打开可关闭标签，换会话后按会话恢复，关掉最后一张标签后右栏回来；真实 docx 用分页渲染出标题「验收」；谎称 `art_4f9d2c1a8b3e` 的终轮被标成过程，最终回复改为没有生成文件。
+- 影响与剩余项：合入与生产部署不在本次授权内。开发库里多了一轮验收会话和 `验收.docx`。
+| 同步前验收 | 47ebd71667859729a6cbe826fcddfe3da4bb5610 | 35757021638108eda761afa7864777bca9bfcd9e | 2026-10-01T06:18:40Z |

DESIGN.md

@@ -96,11 +96,15 @@ Agent-System-Dev 是桌面优先、Web 兼容的 AI 工作台。界面应**冷
 
 ## 6. 布局：面板化工作区
 
-桌面工作区 = 浮在 `--bg-inset` 底座上的**独立圆角面板**（左栏 / 对话主区 / 右栏）：
+桌面工作区 = 浮在 `--bg-inset` 底座上的**独立圆角面板**（左栏 / 对话主区 / 预览区 / 右栏）：
 面板 `--radius-lg` 圆角 + `--border-soft` 发丝描边，面板之间 **4px 间隙**，应用四周 4px 内衬。
 拖拽分隔条：透明 4px 命中区，hover/拖拽时显示 2px `--border-strong` 指示线（两端留出面板圆角）。
 
-层次规则：左栏与右栏用 `--bg-panel`，对话主区用 `--bg`；窄屏可退化为通栏。
+预览区插在对话与右栏之间，只在当前会话有打开的文件时出现。宽度可拖（420–1100），
+用 `--bg`，不受右栏 560 上限约束。打开第一张标签时收起右栏，关掉最后一张时恢复右栏原状。
+标签按会话记住，切回该会话时恢复。
+
+层次规则：左栏与右栏用 `--bg-panel`，对话主区与预览区用 `--bg`；窄屏可退化为通栏。
 信息架构原则：**对话优先**——普通用户仅凭对话即可完成全部工作，右栏纯辅助、可完全收起；
 系统管理类视图独立成区（管理员专属入口），不混入用户设置。
 
@@ -153,8 +157,9 @@ Agent-System-Dev 是桌面优先、Web 兼容的 AI 工作台。界面应**冷
 
 ### 9.3 一个动作一个入口
 
-同一对象只允许一个主要操作路径：一个工件 = 一个预览落位（右栏）+ 一个下载按钮；
-全屏 overlay 是唯一"大窗"形态。禁止弹窗套弹窗。
+同一对象只允许一个主要操作路径：一个工件 = 一个预览落位（对话右侧预览区）+ 预览区标题栏上的一个下载。
+对话里的文件卡片负责打开这个预览区；卡片菜单里的下载是同一下载动作的就近入口，不另开预览器。
+全屏 overlay 是预览区的放大，不是第二落位。禁止弹窗套弹窗。
 
 ### 9.4 按钮
 
@@ -166,6 +171,18 @@ Primary（`--primary` 反色）、Ghost（透明，hover 出表面）、Danger
 菜单壳 `--radius`(8) + `--shadow-md` + 紧凑行（`--radius-sm` 6 的行、`--fs-ui-base`）；
 菜单是紧凑动作行，不是迷你按钮。交互浮层必须盖过被动 tooltip。
 
+### 9.6 工作时间线与标签条
+
+助手消息在运行中按时间线逐行展开，终轮结束后折成一行。
+
+- 运行中始终展开：思考行显示「思考中」并带 `mk-sweep`；对用户的解说按正文样式直接显示；
+  同类工具合并成一行（查阅、搜索、已运行命令、写入、卡片、委派、计划）。
+- 终轮（没有后续工具调用）结束后，过程段收进 Collapsible，触发行为「已工作 X 分 Y 秒」。
+  最终回复留在折叠行下面。不在每一轮 `responding` 时来回折叠。
+- 文件卡片：图标、名称、「类型 · 大小」、右侧「预览」。正文里的 `art_` 编号若对得上工件，在正文后补一张卡片；
+  对不上则显示「未找到该文件」，不伪装成可打开的文件。
+- 标签条用 `@ui` `TabStrip`：点击激活、× 关闭、中键关闭，溢出横向滚动。只消费令牌与 `mk-*`。
+
 ## 10. 信息架构与文案
 
 - 普通用户界面只暴露任务与对话；插件/代理/治理类能力归系统管理区（管理员可见）。
@@ -180,7 +197,7 @@ Primary（`--primary` 反色）、Ghost（透明，hover 出表面）、Danger
 3. TSX 行内 `font-size`——走字号标尺；
 4. 运行态用旋转 spinner——用 `mk-sweep`/`mk-breathe`；
 5. 弹窗套弹窗；
-6. 同一对象出现第二个下载/预览入口；
+6. 同一对象出现第二个预览落位（预览只在预览区，全屏是它的放大）；
 7. `<details>` 折叠——用 Collapsible。
 
 ## 12. 演进规则