# 应用导航与系统工具入口 UI 设计

## 文档信息

| 项目 | 内容 |
| --- | --- |
| 状态 | 应用中心与本机推理监控已接入源码，整体验收待完成 |
| 版本 | 0.4 |
| 日期 | 2026-09-17 |
| 关联 PRD | [应用导航与系统工具入口 PRD](./prd.md) |
| 功能逻辑 | [功能逻辑设计](./logic-design.md) |
| 全局规范 | [GoodBuddy 统一界面设计系统](../../../UI-DESIGN.md) |

本文定义已接入的应用中心、共同设置和本机推理监控界面，以及待实现的右侧资源监控界面。
行为以[功能逻辑](./logic-design.md)为准，需求保留 FR-1 至 FR-16 与既有 US 编号。
根 UI 规范已同步应用中心与工具入口规则；共享控件、主题、设置 Modal 与工作栏布局遵守根规范。

## 1. 侧栏信息架构

```text
品牌
项目选择
项目活动汇总（仅有活动时显示）
新对话
搜索

当前对话
应用（按保存顺序；知识库、智能心跳始终显示，可选应用仅显示启用且常驻项）
运行记录

最近对话
...

────────────────────────
[应用中心]                       [设置]
```

“当前对话”和“运行记录”属于固定系统入口，常驻应用位于二者之间。首期应用清单为魔法笔记、
知识库、智能心跳及本轮追加的本机推理监控，应用中心与设置始终可见。侧栏底部不再显示“本地工作区”和 `platform · arch`；
排障信息移至关于或诊断页面。左侧不再提供文件、终端、浏览器、资源监控的重复入口。

## 2. 底部应用中心入口

底部使用连续平整表面和顶部分隔线，应用中心在前，固定设置靠右，二者为独立按钮：

| 位置 | 图标 | 可见工具提示 | 点击结果 |
| --- | --- | --- | --- |
| 1 | `Grid2X2` | 应用中心 | 向上展开已启用应用菜单，底部“管理应用”进入管理 Modal |
| 末位 | `Settings` | 设置 | 在当前工作区上打开设置 Modal |

图标使用项目现有 Lucide 库。应用中心保留文字，设置图标采用统一的 `34px × 34px` 点击区域。
底部使用共享间距和焦点样式，设置通过弹性空白靠右；不得把整个容器做成设置按钮。

### 2.1 状态

- 默认：透明背景，图标使用次级文字色。
- 悬停：使用弱表面色，不能强于当前选中状态。
- 展开：应用中心按钮显示展开反馈，不能当作当前应用的选中状态。
- 键盘焦点：显示统一焦点环，不能被侧栏边缘裁切。
- 加载：读取应用配置时保留入口，中心内显示加载状态；失败提供重试，不用默认值冒充已保存配置。

应用中心入口不承载工具运行徽标。全部可选应用关闭时菜单仍显示知识库、智能心跳及“管理应用”，可进入 Modal 重新开启可选应用。

## 3. 主导航应用区

应用入口沿用现有 `nav-item` 行，不使用应用卡片。图标、名称和徽标保持单行：

```text
[图标] 知识库
[图标] 智能心跳                         1
[图标] 魔法笔记                         3
[图标] 本机推理监控
```

取消常驻或关闭可选应用后不留下空白。知识库、智能心跳始终启用并显示，位置遵守共享应用顺序。运行记录始终位于应用区之后。
四个应用均在管理卡片上通过拖动及“上移”“下移”按钮排序；首尾无目标时禁用对应按钮。两种方式提交完整应用顺序，保存成功后更新，重启保留。当前对话、运行记录和底部系统入口不参与排序。

取消常驻不关闭当前页面或本机推理监控 Modal。重新常驻按已保存顺序恢复，关闭应用保留常驻与顺序偏好。
主侧栏始终读取最后确认配置，不展示尚未保存成功的排序或开关目标值。

## 4. 应用中心与共同设置

底部点击打开轻量菜单，锚定按钮向上展开，无模态遮罩、背景隔离或焦点循环。菜单按共享保存顺序列出已启用应用，不按打开历史或常驻状态过滤。点击应用行关闭菜单，本机推理监控打开独立 Modal，知识库、智能心跳和魔法笔记在主内容区打开页面。分隔线下的“管理应用”关闭菜单并打开既有管理 Modal。

菜单通过共享 `AnchoredMenu` 挂载到 body，宽度最多 `280px`，距窗口边缘至少 `16px`，与按钮上缘间隔 `8px`；短窗口限制高度并内部滚动，滚动、窗口和内容尺寸变化时重算位置。原生浏览器相交遮挡复用共享机制。

管理 Modal 沿用设置 Modal 的表面、遮罩和焦点规则，提供全部内置应用的名称及用途搜索、打开，以及可选应用的常驻和设置：

应用管理采用 `auto-fit/minmax` 网格，卡片最小宽度 `260px`，不足时收缩为容器宽度；按 Modal 可用宽度排列三列及以上、双列或单列。Modal 最大宽度保持 `960px`，当前最大宽度可容纳三列，
高度随内容增长并受窗口限制。卡片显示图标、名称、状态和用途，底部放置操作；名称旁区分
“始终显示”（英文 `Always shown`）和“可选 · 已启用／已关闭”。长名称可换行，正文与控件均不可横向溢出。

```text
应用中心
[搜索内置应用]
知识库     始终显示         [打开] [上移] [下移]
智能心跳   始终显示         [打开] [上移] [下移]
魔法笔记   可选 · 已启用    [打开] [设置] [上移] [下移]
本机推理监控   可选 · 已启用    [打开] [设置] [上移] [下移]
```

已启用但未常驻的应用可以直接打开，打开不自动常驻。关闭的应用仍能被搜索和配置，
保留禁用的“打开”按钮，可通过“设置”重新开启。启用、常驻放在设置详情中；每张卡片底部提供成组的上下箭头，与打开、设置操作按空间换行。箭头使用共享图标按钮，名称和提示包含方向及应用名；目标取完整保存顺序中的相邻应用，仅首尾无目标或修改锁定时禁用对应箭头。无搜索词且未锁定修改时，所有卡片均支持拖动排序，包括关闭或未常驻的应用；搜索时禁用拖动，箭头仍按完整保存顺序操作，未命中的应用保留在顺序中。无搜索结果显示清除搜索入口。
首期不展示商店页签、推荐、安装按钮、市场 URL 或 YAML 操作，系统工具也不在此列出。

### 4.1 共同应用设置页

魔法笔记、本机推理监控的通用应用设置统一从应用中心卡片的“设置”进入；应用页面不再提供重复快捷入口。本机推理监控保留“模型与连接设置”。知识库和智能心跳在管理 Modal 中提供“打开”和排序，不提供启用、常驻开关或通用空设置；原工作区实际配置入口保留。
共同页遵守[设置中心 UI 规范](../../../UI-DESIGN.md#138-设置中心)，不为每个入口建立一套设置。
全局设置移除魔法笔记页签及跳转入口。旧“显示魔法笔记入口”绑定业务启用值，迁为“启用应用”并保留原值；
“常驻左侧菜单”使用独立配置，只有已发布的独立显隐偏好才映射到常驻。

| 控件 | 表达含义 |
| --- | --- |
| 启用应用 | 控制业务可用性及主导航、会话等业务入口 |
| 常驻左侧菜单 | 仅控制主导航捷径，关闭应用时保留该偏好，并说明开启后才显示 |
| 显示未完成待办数量 | 仅控制魔法笔记导航徽标 |
| AI 评论方式 | 即时／保存后自动／保存后手动，单选 |
| AI 评论形式 | 长评 + 要点／长评／要点，单选 |

二元配置使用共享 Switch 和 `role="switch"`；评论选项使用共享单选控件。本机推理监控
默认启用但不常驻，其余未配置布尔项默认开启；评论默认值沿用既有值，已有保存的选择保留。启用与常驻不可合并。
设置详情最大宽度 `640px`，紧凑标题栏包含返回图标、应用名称、用途及关闭按钮。进入详情和
返回卡片时正文滚动位置重置到顶部；进入详情聚焦关闭按钮，返回后聚焦搜索框。
共同设置表单使用共享 Switch，相关字段分组，组间使用弱分隔线；说明沿用正文字号。
评论分段控件按内容占宽，窄窗口中标签与选项上下排列；详情不提供排序控件。
智能心跳单条计划 CRUD 及 enabled 仍由其业务页面负责，没有应用级心跳启用开关。

所有入口共享保存中状态。串行保存期间禁用相关启用、常驻、排序及笔记配置控件，保留
最后确认值；持久化成功后的设置事件同步中心、侧栏、会话、应用页及其他设置入口，包括工具配置写入。重开中心刷新期间锁定修改，迟到的旧读取不能覆盖更新快照。失败在发起操作
附近显示可重试错误并保留焦点；结果未知时显示“正在确认保存结果”，重读成功后再开放修改。

### 4.2 关闭后的页面与会话

关闭当前可选应用成功后，原页面或本机推理监控 Modal 显示“应用已关闭”，重新启用通过应用中心卡片设置完成；本机推理监控需先关闭 Modal。保留草稿和内容状态，
暂停该页面的新业务操作。重新开启后恢复可用性，不自动跳到已离开的应用页或重放任务。

知识库和智能心跳不显示应用关闭状态；会话知识控件、历史引用、工作区配置及心跳计划遵守原功能规则。可选应用的已有请求和后台任务继续按功能生命周期展示，详细边界见[关闭应用与恢复](./logic-design.md#32-关闭应用与恢复)。

## 5. 助手工作栏反馈

系统工具仅从右侧工作栏已有 Tab 或“+”目录进入，工作栏按现有布局回流，主内容页面保持不变。

- 文件：激活默认存在且不可关闭的“工作区”Tab，焦点进入目录区域或错误修复入口。
- 终端：选择已有 Tab 激活该确切终端并保留目标与历史状态；“+”每次创建额外终端，按当前
  项目选择本机或托管 SSH，无项目时使用本机 Home。新建期间显示进度，失败保留诊断。
- 浏览器：选择已有 Tab 保留其 Conversation、页面及导航状态；“+”每次创建额外浏览器，
  无活动 Conversation 时新建待绑定空实例。不会按当前会话改选其他 Tab 或重绑已有实例。
- 资源监控：激活“资源监控”Tab，焦点进入指标摘要；首个样本加载后开始绘制历史。

文件和资源监控在“+”中按单实例规则聚焦或创建，终端和浏览器不按目标去重。
后台事件可以更新 Tab 徽标，不能自动展开工作栏或切换当前 Tab。

### 5.1 资源监控面板

资源监控使用紧凑单列，不使用指标卡片墙：

```text
资源监控                                      本机

CPU                                  18%
[最近 5 分钟折线图]

内存                         9.6 / 32 GB
[使用量进度条]

磁盘 IO                 读 12 MB/s · 写 3 MB/s

GoodBuddy
CPU 4% · 内存 620 MB · 桌面进程 7

更新于 14:32:08
```

- CPU 折线纵轴固定为 `0%` 至 `100%`，不能根据当前低负载动态放大波动。
- 内存同时显示使用量、总量和百分比；进度条不代替文字数值。
- 磁盘 IO 使用每秒读写字节并按统一单位格式化，不显示累计设备字节数。
- GoodBuddy 摘要只显示聚合值，不列 PID、命令行或环境变量。
- 首次加载或停止后恢复时，CPU 和磁盘 IO 显示“正在建立采样基线”，不先渲染 `0%`；内存
  等瞬时指标可以立即显示。
- 部分可用时只在对应指标行显示“不可用”和简短原因；全部失败时显示重试入口。
- 图表不使用动效平移；`prefers-reduced-motion` 下行为不变。
- 面板失去活动状态、工作栏收起或窗口隐藏、最小化时停止更新；返回后重新建立区间指标基线，
  不填补离开期间的历史。

## 6. 文案

固定使用以下名称：

| 对象 | 文案 |
| --- | --- |
| 底部入口 | 应用中心 |
| 菜单底部管理入口 | 管理应用 |
| 应用设置开关 | 启用应用 |
| 文件系统工具 | 文件 |
| 终端系统工具 | 终端 |
| 浏览器系统工具 | 浏览器 |
| 浏览器说明 | GoodBuddy 受控浏览器 |
| 资源系统工具 | 资源监控 |
| 资源范围 | 本机 |
| 指标缺失 | 不可用 |
| 应用常驻开关 | 常驻左侧菜单 |
| 关闭的应用页 | 应用已关闭 |
| 内置来源 | 内置 |

不再使用“本地工作区”作为侧栏底部身份名称。项目和默认工作区的路径继续由项目选择器、页面
范围或工作区面板显示。

## 7. 键盘和无障碍

- 底部应用中心和设置均为独立 `button`，Tab 顺序与视觉顺序一致，不嵌套按钮。
- 图标按钮通过 `aria-label` 提供名称，工具提示不能作为唯一可访问名称。
- 工作栏打开后按现有焦点策略聚焦目标面板；用户通过固定工作栏开关关闭时，焦点返回该开关。
- 应用中心按钮提供 `aria-haspopup="menu"`、`aria-expanded` 和控制关系；菜单使用 `menu`／`menuitem`，打开后聚焦首个可用项，上下方向键循环选择，Home、End 到首尾，Enter、Space 激活。
- Escape 关闭菜单并恢复入口焦点；Tab 关闭后继续正常焦点顺序，点击外部、焦点离开或再次点击入口也关闭。菜单不隔离背景，不增加遮罩。
- “管理应用”打开的 Modal 使用共享 Portal、整窗遮罩、原生浏览器遮挡、背景隔离和焦点循环，初始焦点进入搜索。卡片操作与详情控件按正常 Tab 顺序访问，不伪装成单个菜单项；详情切换焦点见共同应用设置页。
- 工作栏使用 `tablist`、`tab`、`tabpanel`、`aria-selected`、游标焦点和方向键、Home、End。
  “+”使用普通按钮语义，同类型 Tab 仍按实例独立标记。
- 徽标数量或状态合并进可访问名称；Switch 支持 Space，失败保留焦点。排序按钮名称包含
  应用名，操作结果通过 polite 状态区播报；拖动不是唯一排序方式。

## 8. 响应式

- 侧栏宽度 `220px` 至 `420px` 时，应用中心与设置均可操作，不随宽度缩小点击区域。
- 窄窗口继续使用现有侧栏抽屉，底部入口不重叠；应用菜单向上展开并限制窗口边界、内部滚动。管理 Modal 的长名称可换行，搜索、设置与重新开启入口始终可达。
- 右侧 Tab 单行横向滚动，“+”持续可见；工作栏保持停靠回流，不遮罩主页面。
- 工具提示不得超出窗口；靠近底边时显示在按钮上方。
- 粗指针设备不依赖悬停，按钮的可访问名称和选中反馈保持有效。

### 会话置顶与操作菜单

会话行的“更多会话操作”提供“置顶会话／取消置顶”，本地与消息通道会话均可使用。
置顶会话显示带“已置顶”可访问名称的图标；当前项目和搜索过滤仍生效，过滤后的列表先显示
置顶会话，两组内各按更新时间倒序。取消置顶恢复时间排序，不改变会话更新时间。
置顶状态重启后保留；保存成功后更新图标和顺序，失败保留原状态并显示应用错误通知。
存储尚未就绪或置顶请求进行中时禁用置顶操作。

操作菜单通过 body Portal 浮在会话列表上方，不撑开会话行。菜单锚定更多按钮，默认位于
按钮下方，随滚动、窗口及菜单尺寸变化重新定位，距窗口边缘至少 `8px`；空间不足时限制
宽高并允许菜单内部滚动。使用共享表面色、边框、圆角与浮层阴影。

入口提供 `aria-haspopup="menu"`、展开状态和控制关系；菜单使用 `menu`／`menuitem`。
打开后聚焦首个可用按钮，上下方向键循环移动，Home／End 到首尾；Escape 关闭并返回
触发按钮，点击外部或焦点离开时关闭。本地会话继续提供分支、重命名和删除确认，复制与
导出也适用于消息通道会话。持久化与刷新规则见
[会话置顶存储](../assistant-workbar/execution-history-storage.md#会话置顶)。

## 9. 未来插件入口

FR-15、US-F1／US-F2 的市场 URL、YAML 导入导出及 ShareServer 分发在后续设计中定义。
首期中心只浏览本地内置清单，不显示未来市场的空壳界面。

### 9.1 本机推理管理

FR-16 的 `local-inference` 入口已纳入本轮应用清单，可常驻主导航。从常驻入口、应用菜单和管理 Modal 的“打开”均进入同一本机推理监控 Modal，关闭来源菜单或管理 Modal，保留底层工作区、项目、会话和草稿。其他内置应用仍打开主内容区页面。
Modal 与真实执行模块已接入；支持清单及验证范围分别见技术设计和实施进度。
复用 `custom-task-dialog` 的整窗 body Portal、遮罩、背景隔离及浏览器遮挡机制。主 Modal 最大宽度 `960px`，高度随内容增长，最大高度为 `min(720px, 100dvh - 2 × --space-6)`；紧凑标题栏和关闭按钮固定在顶部，正文独立滚动。直接显示服务列表，没有页签或任务历史。工具栏显示“每 5 秒刷新 · CPU 100% = 一个逻辑核心”、模型与连接设置、刷新状态，窄屏可换行。服务行显示“服务进程 PID … · CPU …% · 工作集 … MiB”，预热时显示“正在建立采样基线”；共享进程的 worker 在该行显示无法独立统计的原因。
初始焦点进入“关闭本机推理监控”，Tab／Shift+Tab 在当前 Modal 内循环。没有影响确认且没有操作提交时，关闭按钮或 Escape 关闭 Modal；点击遮罩不关闭。关闭后优先恢复仍可用的原触发元素，入口已移除时回到应用中心，窄侧栏已隐藏时回到侧栏开关。
服务采用弱分隔列表；名称使用区块标题字号，状态及引擎元数据使用
辅助字号，状态与名称同组并与操作区分开，原因与操作说明使用正文字号。桌面操作独立位于右侧；
窗口宽度不超过 `720px` 时移到正文下方并左对齐，保留完整状态和原因。

- US-F3 每行显示服务名、简短状态、引擎、模型及错误。ASR 可用时显示“按需运行（状态未知）”；OCR 和向量使用执行模块的状态。TTS 显示不可用，外部连接不列入本机服务。
- US-F4 不再提供单任务取消入口；活动任务仅在服务操作的影响确认中出现。
- US-F5 服务行右侧保留实际支持的启动、停止、重启或模型加载、释放。
- 停止、重启、释放前打开最大宽度 `480px` 的紧凑嵌套确认，列出正在使用的任务与影响；无已登记任务时说明执行前再次核对。初始焦点进入“保留运行状态”，最终危险按钮写明“确认停止服务／重启服务／释放模型”；取消保留运行状态。
  确认使用独立 body Portal，隔离底层管理 Modal，Tab／Shift+Tab 只在确认中循环；Escape 只关闭确认，关闭后恢复原服务操作按钮，按钮不可用时回到管理 Modal。确认存在时禁用主 Modal 关闭按钮；提交期间禁用确认和取消按钮，两层 Escape 均不能关闭，也不能重复执行。失败关闭旧确认，在服务列表显示错误并刷新；再次操作须重新确认当前影响。成功只关闭确认。
  操作失败呈现实际状态和可重试错误，无法确认则显示未知。服务恢复不自动重放任务。
  关闭 Modal、关闭管理应用或取消常驻不停止服务，模型文件卸载另行操作。

服务列表提供首次加载、无服务、加载失败重试及保留旧快照的刷新失败状态；刷新期间或失败时禁用服务操作。
OCR 忙碌或模型不可用时禁用加载与释放，并在执行模块再次检查。
页面不显示无来源的进度条或资源数值。US-B6 至 US-B9 的应用中心、顺序、启用联动、笔记共同设置映射见
[需求对应](./logic-design.md#6-与需求的对应关系)。

## 10. 项目活动汇总

对应 [FR-14](./prd.md#fr-14-项目活动汇总)，状态与计数遵守
[活动逻辑](./logic-design.md#9-项目活动汇总)。

- 全局汇总按钮仅在有活动行时显示在项目选择器下方，紧凑显示待处理、运行中与已完成数量，无活动行时整行隐藏，
  右侧显示展开箭头，与下方新建会话保留 `8px` 间距。可访问名称明确数量属于“全项目活动”。
- 项目菜单在项目行显示同口径数量，保留“本地项目 / 远程项目 / 远程通道”分组和 SSH Host
  层级，不因活动状态重排项目。数量为零时不显示标记，连接状态仍独立显示。
  项目名独占一行，状态数量排列在名称下方，避免窄侧栏中数量挤占名称宽度。
- 点击汇总在按钮下方打开项目菜单，只列有活动会话的项目，每项显示项目名和同口径计数。
  桌面鼠标悬停或点击项目展开右侧会话菜单，右侧空间不足且左侧可容纳时向左展开。两个面板
  相接，各自拥有边框、圆角与阴影；会话层对齐所选项目行，底部空间不足时仅上移会话层，
  不改变项目层的位置或高度。指针离开项目行进入会话层时不收起。展开项目不切换当前会话。
- 会话层顶部显示项目名，每行显示完整可换行的会话标题与明确状态文字，待处理会话排在
  运行中会话之前，已完成未查看会话排在最后并显示“已完成”。项目行保留子菜单箭头，会话行不显示箭头。不展开 Task、Job 或 Run 列表。
- 点击会话先关闭菜单并恢复入口焦点，再请求进入该条会话；允许离开当前页面后，
  选择所属项目、清除搜索和该会话未读标记、清除任务选择与会话操作菜单，窄窗口同时关闭侧栏。
  设置页沿用未保存修改的离开检查，取消离开时保留原页面和完成通知。完成通知在目标聊天
  实际可见后清除，从普通侧栏进入也相同；设置覆盖下的聊天或隐藏文档不触发清除。
- 菜单挂载到 body，使用 `menu`、`menuitem`、`aria-haspopup`、`aria-expanded` 与控制关系，
  不隔离背景、不增加遮罩。原生浏览器相交遮挡沿用共享机制。
- 打开后焦点进入首个项目；上下方向键循环选择当前层项目或会话，Home、End 到首尾，
  Enter、Space 激活，右方向键进入会话层。左方向键或 Escape 返回项目层并恢复对应项目
  焦点；顶层 Escape 关闭并恢复汇总焦点，不继续关闭窄侧栏。Tab 关闭菜单后继续正常焦点
  顺序；点击外部、焦点离开、再次点击入口或隐藏侧栏也关闭菜单。
- 单面板宽度为 `264px`，窗口小于 `620px` 或项目菜单两侧均无法容纳子菜单时，就地进入会话层并显示“返回项目列表”，
  触控无需悬停。浮层距窗口边缘至少 `16px`，每层最大高度为 `480px`，短窗口进一步限制
  高度并独立滚动。成功完成但尚未查看的会话继续保留；所有活动行移除后，关闭已打开菜单并隐藏摘要。