# 变更提案: connection-card-default-test-button

## 元信息
```yaml
类型: 修复增强
方案类型: implementation
优先级: P2
状态: 已完成
状态说明: SSH 连接卡片默认显示“连接 / 测试 / 更多”，并从更多菜单移除重复测试入口
创建: 2026-04-19
```

---

## 1. 需求

### 背景
连接管理页当前已将连接卡片行内操作收敛为“连接”主按钮和“更多”菜单，但 SSH 连接常用的单连接“测试”仍被藏在更多菜单里。用户当前希望默认直接看到“连接 / 测试 / 更多”三段式操作区，减少进入二级菜单才能测试的额外点击。

### 目标
- 让 SSH 连接卡片默认显示“连接 / 测试 / 更多”三个按钮。
- 复用现有单连接测试状态、文案和禁用逻辑，不新增后端接口或测试链路。
- 保持非 SSH 连接卡片的默认操作区不变，避免把不支持的测试入口暴露出来。

### 约束条件
```yaml
范围约束: 仅调整 packages/frontend/src/views/ConnectionsView.vue 的连接卡片操作区与相关知识库记录
交互约束: “测试”默认显示仅适用于 SSH 连接，RDP/VNC 仍不提供默认测试按钮
实现约束: 必须复用现有 getSingleTestButtonInfo() 与 handleTestSingleConnection() 逻辑
兼容约束: 保持当前 flex-wrap 布局、主题 token 和批量模式下的现有交互行为
```

### 验收标准
- [x] SSH 连接卡片默认操作区显示“连接 / 测试 / 更多”
- [x] SSH 连接的“测试”状态继续显示既有的测试中 spinner、禁用态与 title
- [x] 更多菜单不再重复显示 SSH 的“测试”项，非 SSH 连接的默认按钮区保持现状
- [x] 前端构建通过，连接管理页相关知识库描述已同步

---

## 2. 方案

### 技术方案
在 `ConnectionsView.vue` 的连接卡片操作区中，将原本只在 SSH 更多菜单里出现的单连接“测试”操作提升到行内按钮区，插入到“连接”和“更多”之间，并继续通过 `getSingleTestButtonInfo()` 复用文本、图标、禁用状态和提示文案，通过 `handleTestSingleConnection()` 复用既有测试执行链路。与此同时，从 SSH 的更多菜单中移除重复的“测试”项，避免同一动作出现两个入口。

### 影响范围
```yaml
涉及模块:
  - frontend: ConnectionsView.vue
  - frontend: .helloagents/modules/frontend.md
  - workspace-root: .helloagents/CHANGELOG.md 与 archive 归档记录
预计变更文件: 5-7
```

### 风险评估
| 风险 | 等级 | 应对 |
|------|------|------|
| 行内按钮增加后在窄宽度卡片上更容易换行 | 低 | 保持现有 `flex flex-wrap` 布局与紧凑按钮尺寸，让小屏自动折行 |
| 若保留菜单里的测试项会导致同一动作重复暴露 | 低 | 将 SSH 更多菜单中的测试入口一并移除，只保留默认按钮 |
| 非 SSH 连接误显示测试入口会造成无效操作认知 | 低 | 明确限定 `conn.type === 'SSH'` 时才显示默认测试按钮 |

---

## 3. 技术设计（可选）

> N/A，本次不涉及架构、接口或数据模型变更。

---

## 4. 核心场景

### 场景: SSH 连接卡片的默认操作区
**模块**: frontend
**条件**: 用户进入连接管理页，列表中存在 SSH 类型连接
**行为**: 每张 SSH 连接卡片默认显示“连接 / 测试 / 更多”三个按钮，点击测试后继续走现有单连接测试逻辑
**结果**: 用户无需进入更多菜单即可直接测试 SSH 连接

### 场景: 非 SSH 连接卡片保持现状
**模块**: frontend
**条件**: 用户进入连接管理页，列表中存在 RDP 或 VNC 类型连接
**行为**: 卡片默认操作区仍保持“连接 / 更多”结构，不显示无效的测试按钮
**结果**: 非 SSH 连接不会暴露不支持的测试入口

---

## 5. 技术决策

> 本方案不涉及新的架构级技术决策；沿用现有连接测试能力与连接管理页设计体系。

---

## 6. 成果设计

### 设计方向
- **美学基调**: 延续当前连接管理页的深色运维控制台风格，通过“一主两辅”的按钮层级表达操作优先级，保持克制而明确的操作密度
- **记忆点**: SSH 连接卡片在行尾固定呈现“连接 / 测试 / 更多”的三按钮条，常用操作一眼可达
- **参考**: 现有 `ConnectionsView.vue` 卡片样式与主题 token 体系

### 视觉要素
- **配色**: 保留主操作按钮 `bg-button` / `text-button-text`，测试与更多按钮继续使用 `bg-background`、`border-border`、`hover:bg-border`
- **字体**: 沿用项目现有界面字体体系与 `text-sm` 层级，不引入新的字体表达
- **布局**: 维持右侧按钮区 `flex-wrap`，在主按钮和更多菜单之间插入同级的测试按钮，保证桌面端横排、窄宽度时可自然换行
- **动效**: 延续现有 hover 过渡和测试中 spinner 反馈，不额外引入新动效
- **氛围**: 保持当前卡片式深色面板与边框层次，不改变页面整体视觉基调

### 技术约束
- **可访问性**: 按钮需保留明确文本标签、title 与禁用态视觉反馈
- **响应式**: 不破坏当前 `justify-start xl:justify-end` 与 `flex-wrap` 的响应式布局策略