feat(workbench): expand SCADA monitoring and investigation presentation

docs/style-design-guide.md

@@ -32,9 +32,9 @@ Agent 输入框使用 `--shadow-agent-composer` 的柔和双层阴影区分白
 
 助手回复底部使用单行操作栏：“查看处理过程”靠左，语音与复制组成右侧操作组，复制位于最右。展开区域使用白色背景、细边框和完整圆角，与回答正文区分；外边缘与过程入口左侧对齐，普通进度与工具调用的状态图标统一左对齐；工具调用平铺显示，不额外包裹卡片、边框或背景，参数内容按文字列对齐。过程入口保留标准 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 只显示测试输入、校验与原始数据，业务表格、卡片与图表统一进入展示面板。
+Dev 测试、外围系统、调查实时展示与本地预览展示面板也遵循本节：使用实体表面、语义颜色、细边框和标准控件，复用 `workbench-shadcn-surface` 主题；日期与选择菜单通过 Portal 渲染时继续传递这一主题。外围面板内的工单、SCADA 和 Dev 内的 JSONL 测试区采用同一规则。Dev 按调查测试、通知测试与地图调试三个页签组织；工单用分类标题和摘要列表组织，完整报告按需展开，避免多层边框挤压表单；SCADA 只保留演示区间、调频时间轴、主动监测操作和本周期结论，测点目录与原始读数表不在演示面板重复展示。调查与本地展示面板使用固定标题和状态、独立滚动区、紧凑的地图操作及图表 Card；图表标题与关闭按钮同行，嵌入式渲染不再叠加旧灰色图表容器，长标题与图例可换行。面板与图表进入退出、依据展开使用 Motion 的短时透明度和位移过渡，布局变化采用 transform 投影；键盘操作及减少动态效果模式即时完成。地图定位采用可中断的 450ms 平滑 fit，覆盖层以 180ms 淡入淡出，减少动态效果时关闭这些过渡。两个浮层保持非模态，仅自身表面接收指针输入，外部地图保留点击、拖拽和滚轮操作。 展示面板的动作切换放在固定标题区，使用紧凑的 Select、前后按钮和“回到当前”；历史状态与后续动作数可见。回看切换保留短时淡入淡出，退出画面立即设为 inert 并从无障碍树隐藏，避免旧操作仍可点击。Dev 只显示测试输入、校验与原始数据，业务表格、卡片与图表统一进入展示面板。
 
-SCADA 演示时间轴按用户指定采用 FM 调频盘样式：在选定时间区间内，玻璃刻度窗中的时间刻度带横向移动，红色细指示线固定居中。半透明、背景柔化、边缘高光和轻微内阴影仅用于这块刻度窗，数字、刻度和指示线保持清晰，其他外围区域继续采用实体表面。时间定位红色使用独立语义变量，不表示危险告警；背景模糊不可用时回退到实体底色。时间轴按 5 分钟时间戳组织刻度，不读取项目监测周期；鼠标和触摸拨动过程保持连续无缝，选定值及起止时间仍量化到 5 分钟。时间轴只用于回看且不能触发数据处理，方向键也按 5 分钟移动，监测按钮另按项目周期推进后台处理。减少动态效果时关闭连续平滑位移。详细区间与回放语义见 [SCADA 外围系统时段回放与异常检测设计](../../next-tjwater-server/docs/scada-peripheral-replay-design.md)。
+SCADA 演示时间轴按用户指定采用 FM 调频盘样式：在选定时间区间内，玻璃刻度窗中的时间刻度带横向移动，红色细指示线固定居中，上下三角箭头与指示线严格同轴并指向刻度。半透明、背景柔化、边缘高光和轻微内阴影仅用于这块刻度窗，数字、刻度和指示线保持清晰，其他外围区域继续采用实体表面。时间定位红色使用独立语义变量，不表示危险告警；背景模糊不可用时回退到实体底色。时间轴按 5 分钟时间戳组织刻度，不读取项目监测周期；鼠标和触摸拨动过程保持连续无缝，松手后以约 220ms 的减速动画吸附到最近的 5 分钟刻度，选定值及起止时间仍量化到 5 分钟。时间轴只用于回看且不能触发数据处理，方向键按 5 分钟移动并沿用同一段减速动画，动画期间保留当前位置到目标位置所需的完整刻度；Home、End 与 Page 键直接定位，监测按钮另按项目周期推进后台处理。时间轴获得键盘焦点时不额外绘制焦点外圈，减少动态效果时取消吸附及键盘动画并直接对齐。自动播放时，以连续演示时钟平滑移动刻度并标明“播放时间”，手动浏览继续按 5 分钟对齐。自动监测按项目周期等待后端回执后推进；播放控制与实际处理状态分开。播放区固定显示“播放”“暂停”“重新开始”三个独立按钮，按状态启用；暂停后播放从当前位置继续。“重新开始”先停止旧轮次并准备一轮新的待播放回放，时间回到区间起点，用户再次点击播放或单步监测后才推进。单步监测、停止本轮和失败重试放在下一行；正在处理时间步时禁止重新开始，区间完成后通过重新开始准备下一轮。监测状态区分别显示项目周期、演示倍速与每步播放耗时，后台处理耗时另计。最新监测通知置于时间轴上方，待监测、处理中和各类结果统一固定为 160px，统一按监测时间、状态说明和底部操作三行排列，使用小尺寸方形状态图标；待机为中性灰、处理中为信息色、正常和恢复为轻量绿色，异常使用警示色。各状态的时间行、图标、主副标题和底部说明共用同一排版，未显示调查按钮时也保留操作槽位，状态切换不推动下方控件；首次新异常使用两轮圆环扩散和面板边框透明度强调，总计 2.6 秒，随后保留静态提示，同一异常不重复，减少动态效果时关闭。后台持久化的 SCADA 新告警进入系统通知中心，并通过系统通知在工作台顶部居中显示弹窗；带“查看调查”等操作入口的通知持续保留至手动关闭，忽略调用方的自动关闭时长。点击“查看调查”关闭外围面板并定位对应工况任务，保留通知；关闭外围面板仍能接收通知，首次加载项目不重放历史告警。通知与调查任务关联，恢复后从待办与告警中移除活动事项，已弹出的关联通知保留至手动关闭；切换项目或离开工作台时清理原项目弹窗。详细区间与回放语义见 [SCADA 外围系统时段回放与异常检测设计](../../next-tjwater-server/docs/scada-peripheral-replay-design.md)。
 
 Agent 相关界面保持项目本地 shadcn/ui 组件的设计，包括背景、边框、圆角、阴影、排版、间距及交互状态。该规则覆盖主对话面板、手机 Agent 面板、历史对话、主题新建与管理、模型菜单、权限与问题确认、Agent 回答的展开阅读面板，以及这些界面的子弹窗和提示。
 
@@ -52,8 +52,18 @@ Agent 相关界面保持项目本地 shadcn/ui 组件的设计，包括背景、
 - 危险操作使用明确的确认步骤和 `destructive` 按钮变体；失败保留输入与原内容。审批、提问与历史操作的业务规则由对应功能文档维护。
 - Agent 打开的既有地图或业务工具仍遵循其所属模块规范。`AgentPersona` 动画资源按专用设计文档维护，周边面板与控件遵循本节。
 
+### 系统弹窗通知
+
+通知沿用 `glass-transient` 亚克力透明材质、12px 圆角、背景模糊与浮层阴影，复用工作台透明度、字体和语义色状态图标。标题、正文、操作与关闭区域分开排布，长文本自然换行。操作区使用宝石蓝入口，并提示“保留至手动关闭”；点击查看不移除通知。
+
+通知沿用原有堆叠、按钮外观和动画实现，定位与尺寸保留新排版，不另建滚动容器，不覆盖材质与阴影。每条通知均可单独关闭；支持 320px 窄屏。普通信息与成功提示默认 3.2 秒后关闭，警告与错误默认手动关闭，加载通知由其所属操作更新或结束。带操作入口时始终提供手动关闭按钮。Dev 的“通知测试”提供五种状态、加载完成、报告与任务入口、长文本、连续六条通知和清除测试通知。
+
 ## 2. Tailwind 定制方式
 
+SCADA 回放控制使用一个有边框的连续区域：顶部集中显示演示区间和事件时间；中部将模式、日期与时间读数放在同一行，下接 FM 刻度窗，播放按钮组居中并限制最大宽度；底部集中放置单步监测、停止和重试入口，已处理与下次监测时间并排呈现，窄屏自然换行。保留播放、暂停和重新开始三个独立控制，“监测选定时刻”与“下一步并监测”并排，前者检测指针指向的精确时间，后者按项目周期推进；“回到开始时间”只定位到区间起点。监测已处理进度之前的历史时刻会建立新一轮回放，操作前说明原记录保留，避免使用后续状态影响历史判断。
+
+SCADA 监测事件采用持续视觉警告，跟随关联事件至完成或取消；指标恢复后，仍在处理的事件继续显示。刷新页面时恢复进行中的事件，手动关闭以当前标签页的项目与事件编号记忆；新事件重新提示。采用1px细边框、轻量边缘光和4.8秒四角呼吸光。四角通过横向渐隐与纵向遮罩相乘，形成沿两条相邻边衰减的柔和光晕；宽度随视口限制在72至180px，高度在52至100px。默认“标准”强度，中央保持清晰与可操作。底部状态提示复用系统弹出通知的 `glass-transient` 亚克力透明材质、背景模糊、细边框与浮层阴影，避开时间轴；关闭按钮固定在提示右上角；手机将“查看调查”放在下一行，查看操作保留警告。减少动态效果时使用静态光，强制颜色模式使用系统边框。Dev面板的“调查测试”提供“柔和／标准／醒目”强度比较、“测试爆管告警效果”和“模拟事件处理结束”，均为本地视觉操作。
+
 样式统一进入 [src/styles.css](../src/styles.css)。Tailwind 工具类负责布局、间距、尺寸、排版、响应式及交互状态；共享变量负责颜色和材质参数，共享变体负责重复的组件外观。
 
 1. 先选组件，再选语义表面，最后调整布局与状态。常用差异通过组件的 `variant`、`size` 表达；局部差异通过 `className` 与 [cn](../src/shared/ui/cn.ts) 合并。
@@ -178,6 +188,8 @@ Agent 与主工作区、地图与报告使用共享 `Resizable` 分栏；连续
 
 `WorkbenchSection` 统一标题、说明、状态和操作；`WorkbenchNotice` 使用局部状态线；`WorkbenchEmptyState` 只说明为空原因与下一步。以分隔线、留白和浅色差组织内容，避免重复嵌套同级卡片。
 
+带查看入口的系统弹出通知采用上下两区：上方排列状态图标、标题和正文，右上角预留关闭按钮；下方用细分隔线划出操作行，查看入口靠右并带跳转箭头，使用轻量按钮。无操作的通知不显示底部操作行，长正文自然换行，关闭与查看入口的点击区域互不重叠。
+
 每个业务区最多一个醒目的主操作。按钮覆盖默认、hover、按压、焦点、禁用和加载态；hover 仅用于支持 hover 的设备，加载时阻止重复提交并保留可读状态。地图与业务控件沿用共享按压反馈，Agent 控件保留本地 shadcn/ui 交互状态；具有专用资源交互的 `AgentPersona` 保留原版悬停，不额外缩放或变暗。
 
 地图与业务表单字段复用 `.form-field`，聚焦只改变原有 1px 边框；组合输入由外层承担焦点边界，无边框输入使用内描边。Agent 字段保留本地 shadcn/ui 输入组件的边框、焦点和错误样式。错误通过文字、`aria-invalid` 和关联说明表达，失败后保留输入。选中与焦点不改变控件尺寸，底图选择卡片使用主题边框和勾选标记，键盘焦点使用共享内描边。