feat(workspace): enhance status cards and terminal groups

add memory and disk monitoring cards with richer server metrics and localized labels in the workspace status panel group ssh terminal tabs by server with per-group add actions to make multi-terminal relationships clearer sync helloagents archive and module documentation for the completed workspace updates
2026-03-25 22:58:27 +08:00
parent d730d06c5e
commit 7af8812e26
23 changed files with 1644 additions and 839 deletions
@@ -0,0 +1,70 @@
+# 变更提案: terminal-tab-group-visual
+
+## 元信息
+```yaml
+类型: 功能增强
+方案类型: implementation
+优先级: P1
+状态: 已完成
+状态说明: 已完成实现，前端构建验证通过
+创建: 2026-03-25
+```
+
+---
+
+## 1. 需求
+
+### 背景
+上一轮已经让同一 SSH 服务器支持多个终端，并补上了终端序号，但顶部标签栏仍然更像“连接名 + 终端编号”的单层标签，不够接近参考图里“同服务器终端属于一组”的视觉关系。
+
+### 目标
+- 将顶部终端标签栏改成更明显的“同服务器终端组”视觉。
+- 采用“分组头 + 子标签”的表现方式。
+- 保留现有单连接多终端能力，不回退为单终端模型。
+- 继续保持当前黑绿主题和工作区整体风格。
+
+### 约束条件
+```yaml
+范围约束: 优先限制在 TerminalTabBar.vue 和相关前端文案，不改后端协议
+结构约束: 复用现有 session 排序与 terminalIndex 数据，不重写 session store 主模型
+交互约束: 同服务器组内仍能快速新增终端，其他服务器入口继续保留
+兼容约束: 不影响 RDP/VNC 既有入口和会话关闭逻辑
+```
+
+### 验收标准
+- [ ] 连续同连接终端在标签栏中具备明确的“分组头 + 子标签”视觉关系
+- [ ] 组头能清晰展示服务器身份，子标签主要表达终端实例
+- [ ] 同组内仍能继续新增终端，且不影响现有关闭/切换逻辑
+- [ ] 前端构建通过
+
+---
+
+## 2. 方案
+
+### 技术方案
+保留当前按 `sessionId` 排序的平铺会话数组，不引入新的嵌套 store 结构；在 `TerminalTabBar.vue` 内根据相邻会话的 `connectionId` 判定组起点与组终点，在连续同连接会话的首项前渲染组头，在末项后渲染组内新增终端按钮，子标签本身则弱化连接名、强化终端编号与激活态。这样能在不打破现有拖拽键和会话事件路由的前提下，得到更接近参考图的组视觉。
+
+### 影响范围
+```yaml
+涉及模块:
+  - frontend: TerminalTabBar.vue, locales
+预计变更文件: 2-4
+```
+
+### 风险评估
+| 风险 | 等级 | 应对 |
+|------|------|------|
+| 分组头和子标签都在 draggable item 中渲染，样式边界容易错位 | 中 | 让分组逻辑完全依赖前后相邻项判定，避免额外 DOM 状态 |
+| 子标签弱化连接名后识别度下降 | 低 | 组头保留服务器名，子标签保留终端编号与 tooltip |
+| 组内新增终端按钮和现有全局按钮职责重叠 | 中 | 将全局按钮收口为“选择其他服务器”，组内新增由组尾按钮承担 |
+
+---
+
+## 3. 技术决策
+
+### terminal-tab-group-visual#D001: 用相邻项判定的轻量分组视觉替代嵌套数据重构
+**日期**: 2026-03-25  
+**状态**: ✅采纳  
+**决策**: 不新增“连接组” store 层，而是在 `TerminalTabBar.vue` 里通过相邻 `connectionId` 判断组首/组尾，渲染组头、子标签和组尾新增按钮。  
+**理由**: 当前 session 数据和事件路由已经稳定，视觉分组是展示层问题，没必要为此重写状态结构。轻量分组实现可以最大限度复用现有逻辑，同时更容易回滚。  
+**影响**: 主要影响 `TerminalTabBar.vue` 的结构和样式，以及少量终端标签栏文案。