goodbuddy/docs/features/remote-host/ui-design.md

# 主机管理与云环境界面设计

状态：2026-09-28 设计，待实现。范围见[PRD](./prd.md)，状态及依赖遵守[功能逻辑](./logic-design.md)。视觉、页面壳层和组件遵守[统一界面设计系统](../../../UI-DESIGN.md)。

## 应用入口

应用中心新增“主机管理”和“云环境管理”两个同级应用。应用菜单、管理应用中的“打开”和常驻侧栏入口进入同一主内容区页面，关闭来源菜单或管理 Modal，不在应用中心 Modal 内管理主机。业务页面使用全局范围标识；打开页面不切换当前项目、不连接主机或执行安装。

通用启用、常驻和排序遵守[应用导航设计](../application-tool-navigation/ui-design.md)。设置中心移除主机操作表单，保留必要的迁移跳转；共享远程能力开关归入主机管理的应用设置。Agent 包下载、导入等现有全局包管理暂留原位置，主机执行环境页提供相关入口，不复制包状态存储。

## 主机页面

页面使用共享 `dashboard` 壳层。标题区显示“主机管理”、全局范围和主操作“添加主机”。工具栏提供名称或地址搜索、来源筛选、连接状态筛选。列表显示名称、地址、来源、SSH 状态和执行环境摘要，避免每行展开安装表单。

宽窗口使用列表与详情两栏，点击主机只更新详情，不重排列或滚动列表。详情使用共享 `PageTabs`：

| 页签 | 内容与操作 |
| --- | --- |
| 概览 | 名称、来源、系统架构、独立状态及检查时间；关联云实例时提供“查看云实例” |
| 连接配置 | 地址、端口、用户名、认证配置状态、Host Key；编辑与重新验证复用既有流程，不回显凭据 |
| 执行环境 | Agent / Runtime 版本、检查结果、安装进度；保留安装、更新、重装及既有下载方式选择 |
| 关联项目 | 所有引用该主机的项目，明确归档状态；提供打开项目和创建远程项目 |

云关联字段按需显示，手工主机不出现必填平台、区域和实例 ID。删除主机置于次要操作，确认内容列出本地项目影响及远端资源保留范围。

未选择主机时提示选择列表项；没有主机时提供添加入口；搜索无结果时提供清除筛选。连接失败、安装失败和数据读取失败分别显示原因与对应重试操作。用户主动检查所选主机时才连接远端，不能因列表渲染而检查全部主机。

## 云环境页面

标题区显示“云环境管理”、全局范围及“添加平台连接”。通过平台连接和适用的区域或资源范围筛选实例，列表展示名称、平台、位置、实例状态、地址和接入状态。刷新明确针对当前查询范围，并显示上次成功时间。

未接入实例提供“接入主机”，进入地址与认证选择，再完成现有验证向导。已接入实例提供“打开主机”；关联已有主机时可搜索选择，明确展示目标后验证。两个页面之间往返恢复来源筛选、所选记录和滚动位置。

实例运行、SSH 连接和环境就绪分别显示文字状态。只读平台账号可以查询实例并接入 SSH；权限不足时说明失败操作，不把整个平台笼统标为不可用。平台 API 可达但 SSH 不通时保留资源详情与修正连接的入口。

首版不展示尚未实现的创建、销毁或网络编排按钮。各适配器随真实能力交付，不能用不可操作的平台卡片代替接入功能。

## 响应式与交互

两栏无法满足共享最小宽度时改为单面板，选择主机进入详情并提供“返回主机列表”，返回恢复筛选、滚动和列表项焦点。页签可横向滚动，搜索与筛选换行，长地址和错误信息折行，页面不整体横向溢出。

列表项及操作使用语义按钮，提供可访问名称和可见焦点；页签沿用 `tablist`、`tab`、`tabpanel`、方向键及 Home/End。弹窗遵守共享焦点恢复及未保存编辑规则。通知使用全局应用通知，进行中的安装进度保留在对应主机，页面切换不重启操作。

验收对应 AC-RH-1 至 AC-RH-7，覆盖浅深主题、窄窗口、键盘操作、空列表、长名称、认证失败及安装取消；具体实施记录需附真实 UI 验证结果。