feat: expand intelligent investigation workspace

docs/style-design-guide.md

@@ -1,6 +1,6 @@
 # 样式设计指南
 
-供水前端统一以本地 shadcn/ui 为组件基础，使用 Tailwind CSS、共享变体和语义变量。Agent 相关弹窗、面板与菜单保持 shadcn/ui 设计；地图控件与其他工作台浮层使用本文规定的 Acrylic 视觉。适用于工作台、地图控件、Agent、报告、表单和弹层。
+供水前端统一以本地 shadcn/ui 为组件基础，使用 Tailwind CSS、共享变体和语义变量。Agent 相关弹窗、面板与菜单，以及 Dev 测试面板、外围系统面板、调查与本地预览展示面板保持 shadcn/ui 设计；其他地图控件与工作台浮层使用本文规定的 Acrylic 视觉。适用于工作台、地图控件、Agent、报告、表单和弹层。
 
 本文是唯一的样式规范。业务交互见 [Agent 交互与报告设计](agent-chat-ui-design.md)，状态含义见 [状态语言](status-language.md)。本文规定统一目标；历史局部配色和样式覆盖需在后续组件修改中逐步对齐，文档合并不代表运行样式已全部迁移。
 
@@ -16,6 +16,24 @@
 
 ### Agent 弹窗与面板
 
+回答正文与注意事项、表格等结构块之间使用 20px 的布局间距。Markdown 复制容器使用 `display: contents` 时，不使用直接子元素 margin 实现这段间距，避免间距丢失。
+
+回复生成期间只在正文左侧显示一处“正在回复”状态，状态组与正文左边缘对齐；不再在空正文中重复显示“正在生成”。
+
+过程切换为正式结果时，先将旧内容淡出，再统一切换正文、过程归档与底部操作，最后淡入结果，整体约 200ms；只改变透明度，不对长内容高度做插值。切换期间保护阅读锚点，用户滚动或操作后停止自动位置补偿。系统要求减少动态效果时直接交接，仍保留阅读位置和工具展开状态。
+
+面板头部使用紧凑字号：助手名称为 14px/20px，在线状态和主题选择为 12px/16px，保留原有按钮点击区域。对话中的用户消息、回答正文与输入文字为 16px，消息正文与输入行高为 28px；回复状态、依据轮次、输入引用、协作标签及操作文字为 14px，说明行高为 20px。引用标题通过字重区分，说明与标题间隔 4px。输入框顶部不重复显示等待回答的常驻提示，提问与继续状态由对应提问卡片呈现。
+
+起始推荐问题及其加载、失败提示统一使用 14px/20px、常规字重，窄屏下允许完整换行。
+
+输入框按上方引用、中间编辑、下方工具栏排列，外壳使用 22px 圆角和轻边框。任务引用使用无独立底色的紧凑行，引用图标为 14px，文字为 14px/20px；任务名称与轮次、报告版本放在同一文字流中，窄屏在完整短语之间换行。上下内边距各 4px，不在输入底栏重复显示“任务协作问答”标签。内容引用复用紧凑行，原文与分析方向按需展开。权限、模型和消息发送方式的下拉入口沿用 10px 圆角矩形，箭头不设独立圆形区域；悬停和打开时使用整行的淡底色，箭头保持中性颜色；整行保持可点击。语音与发送按钮继续使用圆形。
+
+Agent 输入框使用 `--shadow-agent-composer` 的柔和双层阴影区分白色阅读背景，桌面、窄屏和浮动输入框复用同一规则。聚焦与未聚焦保持相同边框和阴影，不显示蓝色外圈；工具按钮保留键盘焦点提示。左侧始终显示权限模式与文字，任务协作会话同样保留该入口，运行期间按原规则禁用。右侧依次放模型、语音和发送操作；运行时模型位置切换为引导或排队方式，主按钮沿用原有停止与发送切换；停止使用柔和红底和深红图标，悬停时红底略深，发送保持蓝色。工具图标统一为 16px、2px 描边，下拉箭头统一为 12px 单箭头；语音使用声波图标，监听时保留动态声波反馈。发送使用左右对称的 20px 上箭头和 40px 圆形按钮，图标通过网格居中；禁用时使用浅底、灰色图标，启用时使用蓝底、白色图标。模型名称按输入框实际宽度显示。待处理消息队列位于编辑框上方，区别于尚未发送的草稿。
+
+助手回复底部使用单行操作栏：“查看处理过程”靠左，语音与复制组成右侧操作组，复制位于最右。展开区域使用白色背景、细边框和完整圆角，与回答正文区分；外边缘与过程入口左侧对齐，普通进度与工具调用的状态图标统一左对齐；工具调用平铺显示，不额外包裹卡片、边框或背景，参数内容按文字列对齐。过程入口保留标准 hover 反馈，使用对称的水平留白。普通步骤和工具调用复用同一状态图标组件：24px 圆形容器、14px 线性图标，完成为圆圈勾选、失败为圆圈叉号、进行中为加载图标。操作图标统一为 16px、2px 描边，按钮高 32px；窄容器下语音与复制收起可见标签，保留中文可访问名称和提示。复制反馈不改变操作栏布局，过程展开、语音播放与复制各自独立。
+
+Dev 测试、外围系统、调查实时展示与本地预览展示面板也遵循本节：使用实体表面、语义颜色、细边框和标准控件，复用 `workbench-shadcn-surface` 主题；日期与选择菜单通过 Portal 渲染时继续传递这一主题。外围面板内的工单、SCADA 和 Dev 内的 JSONL 测试区采用同一规则。Dev 按调查测试与地图调试两个页签组织；工单用分类标题和摘要列表组织，完整报告按需展开，避免多层边框挤压表单；SCADA 先展示最新值，再提供异常演练。调查与本地展示面板使用固定标题和状态、独立滚动区、紧凑的地图操作及图表 Card；图表标题与关闭按钮同行，嵌入式渲染不再叠加旧灰色图表容器，长标题与图例可换行。面板与图表进入退出、依据展开使用 Motion 的短时透明度和位移过渡，布局变化采用 transform 投影；键盘操作及减少动态效果模式即时完成。地图定位采用可中断的 450ms 平滑 fit，覆盖层以 180ms 淡入淡出，减少动态效果时关闭这些过渡。两个浮层保持非模态，仅自身表面接收指针输入，外部地图保留点击、拖拽和滚轮操作。 展示面板的动作切换放在固定标题区，使用紧凑的 Select、前后按钮和“回到当前”；历史状态与后续动作数可见。回看切换保留短时淡入淡出，退出画面立即设为 inert 并从无障碍树隐藏，避免旧操作仍可点击。Dev 只显示测试输入、校验与原始数据，业务表格、卡片与图表统一进入展示面板。
+
 Agent 相关界面保持项目本地 shadcn/ui 组件的设计，包括背景、边框、圆角、阴影、排版、间距及交互状态。该规则覆盖主对话面板、手机 Agent 面板、历史对话、主题新建与管理、模型菜单、权限与问题确认、Agent 回答的展开阅读面板，以及这些界面的子弹窗和提示。
 
 | 场景 | 组件与组合 |
@@ -23,7 +41,7 @@ Agent 相关界面保持项目本地 shadcn/ui 组件的设计，包括背景、
 | 历史、主题表单、独立详情与确认 | `Dialog`、`DialogTitle`、`DialogDescription`，组合 `Input`、`Button` 和列表 |
 | 对话、审批、问答与展开阅读面板 | 本地 shadcn/ui 面板布局，按需组合 `Card`、`Separator`、`Tabs`、`ResizablePanelGroup` 与 AI Elements |
 | 模型、主题与会话操作菜单 | `DropdownMenu` 及其菜单项、分组和分隔线 |
-| 辅助说明与状态 | `Tooltip`、`HoverCard`、`Badge` 及共享状态组件 |
+| 辅助说明与状态 | `Alert`、`Tooltip`、`HoverCard`、`Badge` 及共享状态组件 |
 
 - 使用已配置的 shadcn/ui 主题变量：`bg-background`、`bg-card`、`bg-popover`、`text-foreground`、`text-muted-foreground`、`border-border`、`ring-ring` 等。按钮、输入和菜单项优先使用本地默认样式及 `variant`、`size`，不为 Agent 另建配色和控件外观。
 - 历史和主题弹窗使用 `bg-card`，与 Agent 主对话区保持白色实体表面，标题区和列表不另铺灰色底。通过 Portal 渲染的弹窗及菜单标记 `data-agent-theme="chat"`，复用主面板的现有主题变量，避免继承工作台银灰色底板；保留本地 `Dialog` 的遮罩、边框、阴影与交互样式。
@@ -79,6 +97,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/shared/ui/card";
 
 地图中的管线一起显示，以管径对应的颜色和线宽体现差异。水库、泵站、水箱和水质监测点保持清晰；阀门、普通节点与常规 SCADA 使用随缩放连续变化的大小和透明度。密集设施的工程符号自动避让，底层保留轻量圆点以表达位置和支持点选。选中与异常分析标记单独突出，普通设施以连续变化为主；普通节点从 12 级、阀门从 13 级开始显示，图标、标注与命中范围同步限制。
 
+Agent、调查展示和 Dev 本地预览的要素定位复用地图调试的选中样式，按原业务源保留线宽、边框、圆环半径、设备类型过滤和缩放规则。展示覆盖层从当前地图样式派生，独立管理高亮与清理范围；闪烁只改变强调透明度，结束后恢复静态样式。
+
 管道透明度不随缩放变化，缩放渐变体现在管线与描边的宽度上，远看纤细、放大清晰；图层开关时仍使用透明度淡入淡出。
 
 图层开关统一使用约 320ms 的透明度淡入淡出，覆盖管线、设施、监测点、GIS 原始数据和模拟结果。矢量瓦片可绘制后才开始淡入计时，避免加载期间耗尽过渡时间。淡入淡出只临时叠加透明度系数，结束后恢复图层原有样式；快速反向切换从当前进度继续。隐藏时立即关闭命中层与交互强调层，淡入结束后恢复；减少动态效果偏好下直接切换。管线用过滤器区分开关状态，透明度保持统一数值，避免逐帧重写属性表达式触发瓦片重算。
@@ -93,7 +113,7 @@ Agent 使用 shadcn/ui 的实体表面和现有主题色，不将这种外观列
 
 ## 4. 材质与层级
 
-本节的 Acrylic 材质规则适用于地图与其他工作台界面；Agent 弹窗与面板按前述 shadcn/ui 规则执行。Acrylic 通过半透明色调、背景模糊、混合层和细噪点建立层级，边缘高光与阴影保持克制。常驻、参与布局的业务区域使用实体底板；Mica 仅作为这一底板角色的设计参考，Web CSS 实体色不等同于原生系统 Mica。
+本节的 Acrylic 材质规则适用于地图与其他工作台界面；Agent、Dev 测试、外围系统、调查与本地展示面板按前述 shadcn/ui 规则执行。Acrylic 通过半透明色调、背景模糊、混合层和细噪点建立层级，边缘高光与阴影保持克制。常驻、参与布局的业务区域使用实体底板；Mica 仅作为这一底板角色的设计参考，Web CSS 实体色不等同于原生系统 Mica。
 
 | 表面类 | 用途 |
 |---|---|
@@ -179,5 +199,3 @@ Agent 界面另检查所有弹窗、面板及其子菜单是否沿用本地 shad
 - [shadcn/ui 组件原则](https://ui.shadcn.com/docs)、[主题变量](https://ui.shadcn.com/docs/theming)、[Vite 接入](https://ui.shadcn.com/docs/installation/vite)、[CLI 配置](https://ui.shadcn.com/docs/components-json)。
 - [Tailwind CSS 主题变量](https://tailwindcss.com/docs/theme)、[自定义样式与层叠](https://tailwindcss.com/docs/adding-custom-styles)。
 - [Fluent Acrylic](https://learn.microsoft.com/en-us/windows/apps/design/style/acrylic)、[Mica](https://learn.microsoft.com/en-us/windows/apps/design/style/mica)。
-
-聊天的生成、续接与刷新恢复共用一个过程容器和一份步骤列表。过程入口在回复底部靠左，语音和复制靠右。发送保持蓝色圆形按钮，停止使用柔和红底与深红图标，悬停时红底略深。