agent-loft 0.2.20 → 0.2.22

package/README.md

@@ -2,7 +2,11 @@
 
 # agent-loft
 
-**多个 agent 的工作台。** 把本机的 **Claude Code**、**Codex**（以后还有更多）放到同一张台面上统一管理，用飞书（以后还有 Telegram 等）和 Web 页面随时随地驱动它们。
+**多个 agent 的工作台。** 把本机的 **Claude Code**、**Codex**（以后还有更多）放到同一张台面上统一管理，在网页、飞书和桌面端（macOS / Windows / Linux）随时驱动它们，进展推送到飞书、iPhone 和 Mac。
+
+![Web 工作台](docs/images/web-chat.png)
+
+> 📖 完整的产品介绍和使用指南见 **[docs/产品介绍.md](docs/产品介绍.md)**：六大核心亮点、快速上手、使用指南、命令速查、常见问题和故障排查。
 
 由 `feishu-claude-bridge` 和 `feishu-codex-bridge` 合并而来：一个进程、一份配置，飞书和网页共用同一套会话、审批和模型切换。
 
@@ -10,57 +14,77 @@
 
 这里的 Loft 不是阁楼，是**工作台**：agent 是干活的人，agent-loft 是它们共用的那张台面。
 
-- **多 agent，一张台面**：Claude Code、Codex 各有所长，不该各开一个窗口、各记一套会话。它们在这里共用工作目录、会话列表、审批和模型切换，同一条对话里随时换人接手，各自的上下文都还在。
+- **多 agent，一张台面**：Claude Code、Codex 各有所长，不该各开一个窗口、各记一套会话。它们在这里共用工作目录、会话列表、审批和模型切换，同一条会话里随时换人接手，各自的上下文都保留着。
 - **统一管理，而不是再造一个 agent**：agent-loft 不自己做模型、不改 agent 的行为，只负责把官方的 agent 接进来、管起来。新的 agent 接一个驱动就能上台。
 - **人在哪，台面就在哪**：电脑上用网页，手机上用 PWA 或飞书。同一个会话、同一个授权请求，在哪个渠道处理都行，其他地方自动同步。
 - **跑在你自己的机器上**：代码、凭据和会话都留在本机，agent-loft 只是一层安全的遥控。
 
 Logo 就是这个意思：一大两小几颗星（多个 agent）站在同一张台面上。
 
+## 六大核心亮点
+
+| | 亮点 | 说明 |
+|---|---|---|
+| 🤖 | **同时管理多个 agent** | Claude Code（官方 Claude Agent SDK）和 Codex（官方 `codex app-server`）共用会话列表、工作目录和授权。同一条会话里用 `/claude`、`/codex`、`/agent` 切换，每个 agent 保留自己的上下文 |
+| 🔀 | **飞书机器人灵活绑定 agent** | 机器人数量不限，每个机器人可以只对应一个 agent，也可以对应多个（在会话里切换）。网页上扫码就能创建，改完立即生效；由服务端主动连向飞书，家里没有公网 IP 也能在外面用 |
+| 🔗 | **飞书续接 Web 任务** | 飞书里发 `/web` 接上一条 Web 会话，或者在网页侧栏右键会话选「在飞书继续…」。之后回复、授权、提问都发到飞书，发 `/detach` 回来 |
+| 🖥️ | **完整的 Web 工作台** | 流式回复、附件、语音输入、模型和思考程度切换、上下文占用、从任意回复分叉、按项目分组的侧栏、全部设置，电脑和手机（PWA）都能用 |
+| 🔔 | **飞书 + 苹果系统推送** | 除了飞书消息，Web 会话还能推送到 iPhone、iPad 锁屏和 Mac 通知中心（标准 Web Push，不需要开发者账号），图标上显示未读数 |
+| 🗂️ | **桌面端同时接入多台设备** | 桌面端（macOS / Windows / Linux）同时连多台服务器，菜单栏 / 托盘一眼看完各台的额度、待处理和运行中的会话 |
+
 ## 能做什么
 
-- **多个 agent**：Claude Code（官方 Claude Agent SDK）、Codex（官方 `codex app-server`）。在同一条会话里 `/agent` 切换，各 agent 的上下文各自保留。
-- **多个飞书机器人**：一个机器人对应一个 agent，或者一个机器人能切换多个 agent，都在设置页里勾选。机器人能在 Web 上扫码创建，改完配置立即生效，不用重启。
-- **Web 聊天页**：电脑和手机都能用，界面参照 ChatGPT。
-  - 回复逐字显示，markdown 和代码高亮，思考过程和工具调用可以折叠。
+- **多个 agent**：Claude Code、Codex。两个 agent 共用工作目录，能看到对方改过的文件，但聊天记录各自独立。
+- **多个飞书机器人**：一个机器人对应一个 agent，或者一个机器人能切换多个 agent，都在设置页里勾选。机器人能在 Web 上扫码创建（Lark 国际版用「手动添加」），改完配置立即生效，不用重启。
+  - 群聊里要 @ 机器人；不同话题是各自独立的会话；支持文字、富文本、图片、文件、语音和视频。
+  - 思考和工具调用显示在实时刷新的过程卡片里，最终回复是普通消息。
+  - 陌生人发消息会拿到配对码，在设置页批准后才能使用；每个机器人单独授权。
+- **Web 工作台**：电脑和手机都能用，界面参照 ChatGPT。
+  - 回复逐字显示，markdown 和代码高亮，思考过程和工具调用可以折叠；每条回复下方显示用时、费用和完成时间，可以复制，也可以「从这里分叉」成一条新会话（原会话不动）。
   - 授权卡、提问卡直接在页面上点。
-  - 支持上传附件（粘贴、拖拽，手机上可以拍照）。
-  - 可以「添加到主屏幕」当 App 用。手机切到后台再回来会自动重连，并补上错过的内容。
-  - 系统通知：回复完成、出错、需要授权或提问时推送到手机 / 电脑（设置 → 通知 里按设备开启）。标准 Web Push，不用注册任何开发者账号；需要 HTTPS 访问，iPhone 需 iOS 16.4+ 且从主屏幕图标打开。
-  - 收到推送时，主屏 / 桌面 PWA 图标上显示未读角标（iOS 16.4+、桌面 Chrome / Edge），打开页面自动清零。
-  - 切换工作目录可以在目录树里一层层点选；新对话发第一条消息前也能先选好目录。
-  - 语音输入：输入框旁的麦克风按钮，用浏览器自带的语音识别（Chrome / Edge / Safari，需要 HTTPS）。
-  - 新对话页：大标题里点目录名切换工作目录；输入框上方的条里选目录和 agent，右下角直接选模型和思考程度（弹出菜单，不用开弹窗）。会话中 agent 不切换（命令 `/agent` 仍可切），模型和思考程度随时可换。
-  - 输入框里显示上下文窗口占用（小圆环，悬停看已用 / 剩余 token）。
-  - 输入框的模型按钮直接显示实际的模型和思考程度（如「Opus 5.5 high」），和选项里的名字一致；列表里显示哪些模型在 设置 → Agent 里勾选。
-  - 每条回复下方显示用时、费用和完成时间，最后一条常驻，前面的悬停才出现；可以复制，也可以「从这里分叉」成一条新对话（只保留到这条回复，原对话不动）。
-  - 侧栏分「最近」和「项目」两组：Web 会话按工作目录归类，飞书机器人各占一行并带飞书图标；分叉出来的对话挂在主对话下面，用虚线连起来；分组可折叠，宽度可拖动，双击会话重命名，名字太长时悬停滚动显示。
-  - 侧栏底部显示 Claude / Codex 的订阅额度（5 小时 / 7 天窗口，悬停看重置时间）；空闲时按设置的间隔自动刷新（默认 10 分钟），跑完一轮后也会刷新。
-- **跨渠道同步**：飞书里的会话在 Web 上也能打开，接着聊。同一个授权请求同时出现在飞书卡片和网页上，哪边先点算哪边，另一边自动变成「已处理」。
-- **在飞书里接着 Web 会话**：飞书里发 `/web` 列出最近的 Web 会话，点「接上」后这个飞书聊天说的话、发的命令都进那条会话，它的回复、授权和提问也发到飞书，Web 上说的话同步过来；发 `/detach` 回到这个聊天自己的会话。也可以在 Web 侧栏右键会话 →「在飞书继续…」，选一个机器人聊过的飞书聊天直接接上（只有一个聊天时不用选）。Web 会话被删除时飞书那边自动退回来。
-- **设置都在网页上**：工作目录、各 agent 的默认模型和思考程度、Codex 沙箱、飞书机器人、配对批准、Claude 的「总是允许」名单、登录设备管理。
+  - 附件：粘贴、拖拽，手机上可以拍照；可以预览和下载。附件存在服务端的专用上传目录里，开新会话或切换目录时清理。
+  - 语音输入：用浏览器自带的语音识别（Chrome / Edge / Safari，需要 HTTPS）。
+  - 新对话页：点大标题里的目录名，在目录树里逐层选工作目录；输入框上方选 agent，右下角选模型和思考程度。会话进行中用 `/agent` 切换 agent，模型和思考程度随时可换。
+  - 输入框里的小圆环显示上下文窗口占用；模型按钮显示实际的模型和思考程度（如「Opus 5.5 high」）。
+  - 侧栏分「最近」和「项目」两组：Web 会话按工作目录归类，飞书机器人各占一行（右键看历史会话）；分叉出来的会话用虚线挂在原会话下面；会话标题由 agent 自动生成，双击重命名。
+  - 侧栏底部显示 Claude / Codex 的订阅额度（5 小时 / 7 天窗口，以及多久后重置）。
+  - 「添加到主屏幕」后当 App 用；切到后台再回来会自动重连，补上错过的内容。
+- **系统通知**：Web 会话回复完成、出错、需要授权或提问时推送到手机 / 电脑（设置 → 通知 → 「在此设备开启通知」，可以发测试通知）。飞书会话由飞书提醒，正在前台看着的会话不推。需要 HTTPS 访问，iPhone 需 iOS 16.4+ 且从主屏幕图标打开。
+- **跨渠道同步**：飞书里的会话在 Web 上也能打开接着聊。同一个授权请求同时出现在飞书卡片和网页上，哪边先点算哪边，另一边自动变成「已处理」。
+- **授权**：允许一次 / 本会话全部允许 / 总是允许（按钮上写明放行范围）/ 拒绝。`/autoedit on` 让 Claude Code 在这条会话里改工作目录内的文件不再询问（Bash 仍询问）。超时一律按拒绝处理。
+- **设置都在网页上**：工作目录、会话闲置过期时间、局域网访问和端口、各 agent 的默认模型和思考程度、可选模型、Codex 沙箱、飞书机器人、配对批准、Claude 的「总是允许」名单、通知设备、登录设备管理、服务端升级。
 
 ## 安装
 
+需要 Linux 或 macOS，Node.js 22 及以上。
+
 ```bash
 npm install -g agent-loft         # 或者在仓库里 npm install 后用 node bin/cli.js
 agent-loft start                  # 前台运行，日志里会打印首次登录用的设置码
-agent-loft service install        # 注册为开机自启服务（systemd / launchd）
+agent-loft service install        # 注册为开机自启服务（systemd / launchd），日志在 ~/.agent-loft/logs/
 ```
 
-打开 `http://<机器 IP>:8800`：第一次需要输入日志里的设置码，然后设一个登录密码。
+打开 `http://<机器 IP>:8800`（本机用 `http://localhost:8800`）：第一次需要输入日志里的设置码，然后设一个登录密码。设置码找不到的话，直接运行 `agent-loft passwd` 设密码。
 
-设置 → 通用 里能看到服务端版本，有新版本时点「升级」即可（`npm install -g agent-loft@latest`，以系统服务运行时会自动重启）；设置 → Agent 里能检查 Claude Code、Codex 装好、登录了没有，Codex 可以一键装到服务端上。
+到 设置 → Agent 检查 Claude Code、Codex 装好、登录了没有：Claude Code 随 agent-loft 一起安装，只需在服务端终端里登录；Codex 可以点「直接在服务器上安装」。设置 → 系统 里能看到服务端版本，有新版本时点「升级」即可（`npm install -g agent-loft@latest`，以系统服务运行时会自动重启，打开的页面会自动刷新）。
 
-### macOS 桌面端
+在外面只用飞书的话不需要任何网络配置（机器人由服务端主动连向飞书）。在外面用网页、系统推送和语音输入需要 HTTPS，见下面的「安全」和[产品介绍里的「从外网访问」](docs/产品介绍.md#从外网访问)。
 
-到 [Releases](https://github.com/qijieinnet/agent-loft/releases) 下载 `desktop-v*` 里对应芯片的 DMG（Apple 芯片选 arm64，Intel 选 x64），拖进「应用程序」。还没有 Apple 开发者签名，第一次打开如果提示无法验证，到 系统设置 → 隐私与安全性 里点「仍要打开」。
+### 桌面端（macOS / Windows / Linux）
 
-- 同时连多台服务器，左边一栏切换；每台各自登录，切走了也在后台连着，回复完成、需要授权时弹系统通知。
-- 菜单栏图标：悬停看各服务器的 Claude / Codex 额度、待处理和运行中的会话。
+到 [Releases](https://github.com/qijieinnet/agent-loft/releases) 下载 `desktop-v*` 里对应的安装包：
+
+- **macOS**：对应芯片的 DMG（Apple 芯片选 arm64，Intel 选 x64），拖进「应用程序」。还没有 Apple 开发者签名，第一次打开如果提示无法验证，到 系统设置 → 隐私与安全性 里点「仍要打开」。
+- **Windows**：`Agent-Loft-Setup-*-x64.exe`，装在用户目录里，不用管理员权限。没有代码签名，SmartScreen 拦的话点「更多信息 → 仍要运行」。
+- **Linux**：Debian / Ubuntu 用 deb（`sudo apt install ./agent-loft-desktop_*_amd64.deb`），其他发行版用 AppImage（需要 libfuse2）；ARM 选 arm64。App 内一键更新只支持 AppImage。GNOME 要装 AppIndicator 扩展才看得到托盘图标。
+
+下面以 macOS 为例，Windows / Linux 上「菜单栏」是托盘、`⌘` 是 `Ctrl`：
+
+- 同时连多台服务器，顶部标签栏切换、拖动排序；每台各自登录，切走了也在后台连着，回复完成、需要授权时弹系统通知，程序坞图标显示未读数。
+- 菜单栏图标：悬停看各服务器的 Claude / Codex 额度、待处理和运行中的会话；双击打开主窗口。同一个账号的额度只查一次。（Windows 上点托盘图标弹出；Linux 上在托盘菜单里点「额度和待处理」。）
 - 支持前面挡着 Cloudflare Access 的服务器：验证页直接在窗口里完成，过期会提醒；也可以配 Service Token 免验证。
-- 首次打开可以选「这台 Mac 也作为服务端」：一键在终端里安装 agent-loft（没有 Node.js 会先用 Homebrew 装）并开机自启，装好自动连上。
-- 服务端有新版本时在服务器列表里点「升级服务端」；桌面端自己的更新在 设置 → 更新 里点「更新并重启」。
+- 首次打开可以选「这台 Mac 也作为服务端」：一键在终端里安装 agent-loft（没有 Node.js 会先用 Homebrew 装）并开机自启，装好自动连上。Linux 上一样（需要先装好 Node.js 22+，开机自启用 systemd 用户服务）；Windows 上服务端还没有开机自启，可以在 WSL 里装，桌面端会自动检测到 `127.0.0.1` 上的它。可选开启「本机有会话在跑时不休眠」。
+- 设置（`⌘,`）的服务器列表里展开某台服务器，能看它的 Agent 环境和版本，有新版本时点「升级服务端」；桌面端自己的更新在同一页的「更新」里点「更新并重启」。
 
 桌面端只是个壳（代码在 `desktop/`），服务端照常用 npm 安装和升级。
 
@@ -86,7 +110,9 @@ agent-loft service install
 | `agent-loft service install \| uninstall \| restart \| status` | 开机自启 |
 | `agent-loft doctor` | 体检 |
 
-聊天里的命令（飞书和 Web 通用；Web 输入框打 `/` 会弹出命令补全，飞书里打 `/` 会弹出机器人的指令面板（agent-loft 自动注册，约 5～8 分钟生效；只发一个 `/` 也会回一张可点击的命令卡片），顺序和显示项在 设置 → 命令 里调整）：`/new` `/fork` `/sessions [all]` `/resume <id>` `/model [名称]` `/effort <程度>` `/agent [名称]`（或者直接发 `/claude`、`/codex`）`/stop` `/cd <目录>` `/pwd` `/status` `/approve <id> allow-once|allow-always|allow-session|deny` `/help`；只在飞书里有的：`/web` `/detach`
+`aloft` 是 `agent-loft` 的简写。
+
+聊天里的命令（飞书和 Web 通用；Web 输入框打 `/` 会弹出命令补全，飞书里打 `/` 会弹出机器人的指令面板（agent-loft 自动注册，约 5～8 分钟生效；只发一个 `/` 也会回一张可点击的命令卡片），顺序和显示项在 设置 → 命令 里调整）：`/new` `/fork` `/sessions [all]` `/resume <id>` `/model [名称]` `/effort <程度>` `/agent [名称]`（或者直接发 `/claude`、`/codex`）`/stop` `/cd <目录>` `/pwd` `/status` `/autoedit [on|off]` `/approve <id> allow-once|allow-always|allow-session|deny` `/help`；只在飞书里有的：`/web` `/detach`
 
 自定义命令：设置 → 命令 → 「添加命令」，填命令名、说明和一段提示词，之后发 `/命令名 参数` 就会把这段提示词发给 agent（提示词里的 `$ARGUMENTS` 换成参数，没写就把参数接在后面）。按 agent 分开存，可以编辑、删除，也会同步到飞书指令面板。
 
@@ -96,7 +122,7 @@ agent-loft service install
 
 - Web 登录密码用 scrypt 哈希保存。首次设置必须用启动日志里的一次性设置码，防止「谁先打开页面谁就成了主人」。
 - 登录态通过 HttpOnly cookie 保存，服务端只存它的哈希。同一 IP 连续输错 5 次锁 15 分钟。所有写请求和 WebSocket 都校验 Origin。页面开启了严格的 CSP。
-- 暴露到公网时，只通过 HTTPS 反向代理（比如 Lucky）访问，并把反代的 IP 加进 `web.trustedProxies`（只有从这些地址来的连接才采信 `X-Forwarded-*`）。不要直接把 8800 端口映射出去。
+- 暴露到公网时，只通过 HTTPS 反向代理（比如 Lucky）或 Cloudflare Tunnel 访问，并把不在本机的反代 IP 加进 `web.trustedProxies`（只有从这些地址来的连接才采信 `X-Forwarded-*`）。不要直接把 8800 端口映射出去。局域网访问可以在 设置 → 系统 → 网络访问 里关掉。
 - 审批超时一律按拒绝处理。Codex 默认沙箱为 `workspace-write`，不会因为 `~/.codex/config.toml` 里配了 `never` 或 `danger-full-access` 就绕过审批。
 - agent 子进程拿不到本服务自己的凭据（`FEISHU_*`、`AGENT_LOFT_*` 等环境变量会被剔除）。
 
@@ -117,6 +143,8 @@ src/
     feishu/        飞书：一个 FeishuBot 对应一个机器人，支持多个
     web/           HTTP + WebSocket + 鉴权
 web/               前端（原生 JS，不需要构建）
+desktop/           桌面端（Electron 外壳，macOS / Windows / Linux）
+docs/              产品介绍和截图
 ```
 
 ### 接入新的消息渠道（比如 Telegram）

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agent-loft",
-  "version": "0.2.20",
+  "version": "0.2.22",
   "type": "module",
   "description": "多个 agent 的工作台：把本机 Claude Code / Codex 放到一处统一管理，用飞书和 Web 页面随时驱动——会话、审批、模型切换都共用",
   "keywords": [

package/src/core/command-catalog.ts

@@ -16,25 +16,26 @@ export type BuiltinSpec = {
   feishuOnly?: boolean;
 };
 
+// 按常用程度排：这也是设置 → 命令、「/」列表和 /help 里的默认顺序
 export const BUILTIN_COMMANDS: BuiltinSpec[] = [
   { name: "new", args: "[模型]", description: "开一条新会话" },
-  { name: "status", description: "查看当前会话、模型、目录、剩余额度" },
   { name: "stop", description: "中断当前执行" },
   { name: "model", args: "[名称]", description: "切换模型（不带参数弹选择）" },
   { name: "effort", args: "[程度]", description: "切换思考程度" },
+  { name: "status", description: "查看当前会话、模型、目录、剩余额度" },
   { name: "sessions", args: "[all]", description: "列出历史会话，点按钮恢复；加 all 列所有目录" },
   { name: "resume", args: "<会话ID>", description: "恢复指定会话" },
+  { name: "cd", args: "<相对目录>", description: "切换工作目录（限 workspace 内）" },
+  { name: "pwd", description: "显示当前工作目录" },
   { name: "fork", description: "从当前会话分叉，原会话保留" },
+  { name: "autoedit", args: "[on|off]", description: "本对话自动允许改工作目录内的文件（Bash 仍询问）" },
   { name: "agent", args: "[名称]", description: "查看 / 切换 agent", multiAgentOnly: true },
   { name: "claude", description: "切换到 Claude Code", multiAgentOnly: true },
   { name: "codex", description: "切换到 Codex", multiAgentOnly: true },
-  { name: "cd", args: "<相对目录>", description: "切换工作目录（限 workspace 内）" },
-  { name: "pwd", description: "显示当前工作目录" },
-  { name: "autoedit", args: "[on|off]", description: "本对话自动允许改工作目录内的文件（Bash 仍询问）" },
   { name: "web", description: "接上一条 Web 会话，在飞书里查看和回复", feishuOnly: true },
   { name: "detach", description: "不再接着 Web 会话，回到这个聊天自己的会话", feishuOnly: true },
-  { name: "approve", args: "<请求ID> allow-once|allow-always|allow-session|deny", description: "审批兜底（卡片失效时用）" },
   { name: "help", description: "显示帮助" },
+  { name: "approve", args: "<请求ID> allow-once|allow-always|allow-session|deny", description: "审批兜底（卡片失效时用）" },
 ];
 
 /** agent 自己报上来的命令 */
@@ -132,7 +133,10 @@ function needsArgs(args: string | undefined): boolean {
  * 合并内置命令和 agent 原生命令，再按用户配置排序。
  * - 只对接得上的 agent 才列 /claude /codex 这类快捷切换；
  * - 和内置命令重名的原生命令丢掉：反正会被 agent-loft 先拦下来，列出来只会误导；
- * - 配置里排过序的在前，按配置的顺序；没排过的（比如新装的 skill）按默认顺序接在后面。
+ * - 配置里排过序的在前，按配置的顺序；没排过的（比如新装的 skill）按默认顺序接在后面；
+ * - 默认顺序：agent-loft 内置命令（按常用程度）→ 自定义命令 → agent 原生命令；
+ * - agent 原生命令默认不显示：只有在设置里保存过（出现在 order 里）且没被隐藏的才显示。
+ *   设置页每次保存都会把整张表的顺序存下来，所以存过的照用户的选择，以后新装的 skill 默认不勾。
  */
 export function buildCatalog(params: {
   allowedAgents: string[];
@@ -202,7 +206,7 @@ export function buildCatalog(params: {
       if (rb !== undefined) return 1;
       return a.i - b.i;
     })
-    .map(({ c }) => ({ ...c, hidden: hidden.has(c.name) }));
+    .map(({ c }) => ({ ...c, hidden: hidden.has(c.name) || (c.source === "agent" && !rank.has(c.name)) }));
 }
 
 /** 「/name args」，给人看的写法 */

package/src/core/commands.ts

@@ -91,7 +91,7 @@ export function helpText(agents: string[], channel?: string): string {
     "",
     "Agent 给选项时会发一张提问卡，点按钮作答；都不合适就直接发消息，那条消息会被当成你的回答。",
     "",
-    "**命令**（需整条消息只有命令；只发一个 `/` 可以列出全部命令，包括 agent 自己的）",
+    "**命令**（需整条消息只有命令；只发一个 `/` 可以列出命令；agent 自己的命令默认不在列表里，可以在设置 → 命令里勾选，没勾的照样可以直接发）",
     "",
     ...BUILTIN_COMMANDS.filter((c) => !c.multiAgentOnly || multi)
       .filter((c) => !c.feishuOnly || channel === "feishu")

package/web/app.js

@@ -2174,9 +2174,11 @@ const VOICE_ERR = {
 };
 
 /** rec：当前识别实例；before/after：开始时光标前后的文字；committed：已确认的识别结果 */
-const voice = { rec: null, want: false, before: "", after: "", committed: "", target: null };
+const voice = { rec: null, want: false, before: "", after: "", committed: "", target: null, stopTimer: null };
 
 function toggleVoice() {
+  // 点过停止、正在等收尾（按钮已经不亮了）：再点就是要重新开始，先丢掉旧的
+  if (voice.rec && !voice.want) cancelVoice();
   if (voice.rec) stopVoice();
   else startVoice();
 }
@@ -2199,61 +2201,121 @@ function startVoice() {
   updateMicBtn();
 }
 
+/**
+ * 正常结束的识别实例留着下次复用：iOS Safari 每次 new 一个新实例，
+ * 第二次开始往往一个结果都不回。被 abort / 卡住的实例不复用，下次换新的。
+ */
+let spareRec = null;
+
+/** voice.rec 是一轮识别（run）：{ rec, heard, shown, done }，事件都按 run 对号入座 */
 function listenOnce() {
-  const rec = new SpeechRec();
-  rec.lang = navigator.language || "zh-CN";
-  rec.continuous = voiceContinuous;
-  rec.interimResults = true;
-  let heard = "";
-  rec.onresult = (e) => {
-    let fin = "";
-    let interim = "";
-    for (const r of e.results) {
-      if (r.isFinal) fin += r[0].transcript;
-      else interim += r[0].transcript;
-    }
-    heard = fin;
-    showVoiceText(joinVoice(voice.committed, fin + interim));
-  };
-  rec.onerror = (e) => {
-    if (e.error === "no-speech" || e.error === "aborted") return;
-    voice.want = false;
-    toast(VOICE_ERR[e.error] ?? `语音识别出错：${e.error}`);
-  };
-  rec.onend = () => {
-    if (voice.rec !== rec) return; // 已被取消
-    voice.committed = joinVoice(voice.committed, heard);
-    showVoiceText(voice.committed);
-    // 这一轮什么都没听到就当说完了，避免麦克风一直开着
-    if (voice.want && heard) {
-      try {
-        listenOnce();
-        return;
-      } catch {
-        // 续不上就结束
+  const run = { rec: null, heard: "", shown: "", done: false };
+  const wire = (rec) => {
+    rec.lang = navigator.language || "zh-CN";
+    rec.continuous = voiceContinuous;
+    rec.interimResults = true;
+    rec.onresult = (e) => {
+      if (voice.rec !== run) return;
+      let fin = "";
+      let interim = "";
+      for (const r of e.results) {
+        if (r.isFinal) fin += r[0].transcript;
+        else interim += r[0].transcript;
       }
-    }
-    voice.rec = null;
-    voice.want = false;
-    updateMicBtn();
+      run.heard = fin;
+      run.shown = fin + interim;
+      showVoiceText(joinVoice(voice.committed, run.shown));
+    };
+    rec.onerror = (e) => {
+      if (voice.rec !== run) return;
+      if (e.error === "no-speech" || e.error === "aborted") return;
+      voice.want = false;
+      toast(VOICE_ERR[e.error] ?? `语音识别出错：${e.error}`);
+    };
+    rec.onend = () => {
+      if (voice.rec !== run) return; // 已被取消 / 已被强制结束
+      finishRun(run, true);
+    };
+    return rec;
   };
-  voice.rec = rec;
-  rec.start();
+  let rec = wire(spareRec ?? new SpeechRec());
+  spareRec = null;
+  run.rec = rec;
+  voice.rec = run;
+  try {
+    rec.start();
+  } catch (err) {
+    // 复用的实例还没完全停下（InvalidStateError）：换个新的再来
+    if (err?.name !== "InvalidStateError") throw err;
+    rec = wire(new SpeechRec());
+    run.rec = rec;
+    rec.start();
+  }
+}
+
+/** 一轮识别结束：把这轮听到的定下来，需要的话接着听下一轮 */
+function finishRun(run, clean) {
+  if (run.done) return;
+  run.done = true;
+  clearTimeout(voice.stopTimer);
+  // Safari 有时整轮都不给 isFinal：没有定稿就以屏幕上显示的为准，不能把已经显示的字吞掉
+  const heard = run.heard || run.shown;
+  voice.committed = joinVoice(voice.committed, heard);
+  showVoiceText(voice.committed);
+  if (clean) spareRec = run.rec;
+  // 这一轮什么都没听到就当说完了，避免麦克风一直开着
+  if (clean && voice.want && heard) {
+    try {
+      listenOnce();
+      return;
+    } catch {
+      // 续不上就结束
+    }
+  }
+  voice.rec = null;
+  voice.want = false;
+  updateMicBtn();
 }
 
 /** 用户点停止：让浏览器把最后一句定稿后再结束 */
 function stopVoice() {
+  const run = voice.rec;
+  if (!run) return;
   voice.want = false;
-  voice.rec?.stop();
+  // 先把按钮恢复，用户能立刻看到已经停了
+  if (ui.micBtn) ui.micBtn.classList.remove("recording");
+  try {
+    run.rec.stop();
+  } catch {
+    // 已经停了
+  }
+  // iOS 上 stop() 之后有时永远等不来 onend，按钮就一直卡在「录音中」，再点只会又 stop 一次。
+  // 等一会儿还没结束就强制收尾，这个实例不再复用
+  clearTimeout(voice.stopTimer);
+  voice.stopTimer = setTimeout(() => {
+    if (voice.rec !== run) return;
+    try {
+      run.rec.abort();
+    } catch {
+      // 忽略
+    }
+    finishRun(run, false);
+  }, 1500);
 }
 
 /** 发送、切会话、用户手动改输入框时：立刻丢掉识别，不再往输入框写 */
 function cancelVoice() {
-  const rec = voice.rec;
-  if (!rec) return;
+  const run = voice.rec;
+  if (!run) return;
+  clearTimeout(voice.stopTimer);
+  run.done = true;
   voice.rec = null;
   voice.want = false;
-  rec.abort();
+  try {
+    run.rec.abort();
+  } catch {
+    // 忽略
+  }
   updateMicBtn();
 }
 
@@ -2292,6 +2354,13 @@ function hasDraft() {
 
 function updateSendBtn() {
   if (!ui.sendBtn) return;
+  // 已经点了发送、还在等服务器确认：转圈，不能再点，避免以为没点上又点一次
+  if (S.sending) {
+    ui.sendBtn.innerHTML = '<span class="send-spinner"></span>';
+    ui.sendBtn.title = "发送中…";
+    ui.sendBtn.disabled = true;
+    return;
+  }
   const stop = S.busy && !hasDraft();
   ui.sendBtn.innerHTML = stop ? ICON.stop : ICON.send;
   ui.sendBtn.title = stop ? "停止" : "发送";
@@ -2402,7 +2471,18 @@ async function addFiles(files) {
   }
 }
 
+/** 发送中：按钮转圈、输入框只读（确认后要清空它，期间再打的字会丢） */
+function setSending(on) {
+  S.sending = on;
+  if (ui.input) {
+    ui.input.readOnly = on;
+    ui.input.classList.toggle("sending", on);
+  }
+  updateSendBtn();
+}
+
 async function sendMessage() {
+  if (S.sending) return;
   cancelVoice();
   const text = ui.input.value;
   if (!text.trim() && S.uploads.length === 0) return;
@@ -2413,6 +2493,7 @@ async function sendMessage() {
   closeSlashMenu();
   let key;
   let res;
+  setSending(true);
   try {
     key = await ensureConversation();
     if ("Notification" in window && Notification.permission === "default") void Notification.requestPermission();
@@ -2421,6 +2502,8 @@ async function sendMessage() {
   } catch (err) {
     toast(err.message);
     return;
+  } finally {
+    setSending(false);
   }
   if (!res?.reply) {
     sentKeys.add(key);
@@ -3141,7 +3224,7 @@ async function openSettings() {
   const nav = h("div", { class: "settings-nav" });
   const panel = h("div", { class: "settings-body" });
   // 设置弹窗高度固定，切标签页时不跟着内容一伸一缩
-  const close = modal({ title: "设置", wide: true, tall: true, body: h("div", { class: "settings" }, nav, panel) });
+  modal({ title: "设置", wide: true, tall: true, body: h("div", { class: "settings" }, nav, panel) });
   let cfg;
   try {
     cfg = await api("/api/config");
@@ -3157,7 +3240,7 @@ async function openSettings() {
     ["授权", () => authTab(panel)],
     ["通知", () => notifyTab(panel)],
     ["安全", () => securityTab(panel)],
-    ["系统", () => systemTab(panel, close)],
+    ["系统", () => systemTab(cfg, panel)],
   ];
   const select = (i) => {
     nav.querySelectorAll("button").forEach((b, j) => b.classList.toggle("on", i === j));
@@ -3378,7 +3461,6 @@ function serverVersionSection() {
 }
 
 function generalTab(cfg, panel) {
-  panel.append(serverVersionSection());
   const root = h("input", { value: cfg.workspaceRoot });
   const approval = h("input", { type: "number", min: 1, value: Math.round(cfg.approvalTimeoutMs / 60000) });
   const ttl = h("input", { type: "number", min: 0, value: Math.round(cfg.sessionTtlMs / 3600000) });
@@ -3418,7 +3500,6 @@ function generalTab(cfg, panel) {
       ),
     ),
   );
-  panel.append(networkSection(cfg));
 }
 
 /** 只有本机能连的监听地址（和服务端 listen.ts 的判断一致） */
@@ -3624,7 +3705,8 @@ function customDialog({ agent, entry, taken }, onSave) {
 
 /**
  * 设置 → 命令：每个 agent 一张表，拖动或用箭头排序，取消勾选就不在「/」列表里出现。
- * 保存时把整张表的顺序存下来；以后新装的 skill 不在表里，会自动接在最后。
+ * 默认 agent-loft 内置命令按常用程度排在最前，agent 自己的命令排在后面且默认不勾（服务端 buildCatalog 决定）。
+ * 保存时把整张表的顺序存下来；以后新装的 skill 不在表里，会自动接在最后、默认不勾。
  * 用户可以自己添加命令（一段预设的提示词），自己加的可以编辑、删除，增删改后立即保存。
  */
 function commandsTab(cfg, panel) {
@@ -3836,7 +3918,7 @@ function commandsTab(cfg, panel) {
       h(
         "div",
         { class: "muted" },
-        "在输入框里打「/」时弹出的命令，按这里的顺序排列；保存后会自动同步到飞书机器人的指令面板。取消勾选的不会出现在列表里，但照样可以手动输入。带 agent 名标记的是 agent 自己的命令（skills 等），会原样转给 agent。",
+        "在输入框里打「/」时弹出的命令，按这里的顺序排列；保存后会自动同步到飞书机器人的指令面板。取消勾选的不会出现在列表里，但照样可以手动输入。带 agent 名标记的是 agent 自己的命令（skills 等），默认不勾选，需要的话勾上并保存；它们会原样转给 agent。",
       ),
       tabs,
       h(
@@ -4447,40 +4529,46 @@ async function securityTab(panel) {
   );
 }
 
-async function systemTab(panel) {
-  const sys = await api("/api/system");
-  panel.append(
+async function systemTab(cfg, panel) {
+  // 系统信息要等接口返回，先占好位置，版本和网络访问两节不用等它
+  const sysBox = h("div", { class: "section" }, h("h4", {}, "系统", h("span", { class: "grow" }), h("span", { class: "spinner" })));
+  panel.append(sysBox, serverVersionSection(), networkSection(cfg));
+  let sys;
+  try {
+    sys = await api("/api/system");
+  } catch (err) {
+    fill(sysBox, h("h4", {}, "系统"), h("div", { class: "error-text" }, err.message));
+    return;
+  }
+  fill(
+    sysBox,
+    h("h4", {}, "系统"),
+    h("div", {}, `版本 ${sys.version} · Node ${sys.node} · 已运行 ${Math.round(sys.uptimeMs / 60000)} 分钟`),
+    h("div", { class: "muted" }, sys.underSystemd ? "以系统服务运行" : "前台运行（重启需要在终端里操作）"),
     h(
       "div",
-      { class: "section" },
-      h("h4", {}, "系统"),
-      h("div", {}, `版本 ${sys.version} · Node ${sys.node} · 已运行 ${Math.round(sys.uptimeMs / 60000)} 分钟`),
-      h("div", { class: "muted" }, sys.underSystemd ? "以系统服务运行" : "前台运行（重启需要在终端里操作）"),
+      { class: "row" },
       h(
-        "div",
-        { class: "row" },
-        h(
-          "button",
-          {
-            class: "btn",
-            disabled: !sys.underSystemd,
-            onclick: async () => {
-              if (!(await confirmDialog({ title: "重启 agent-loft？", message: "进行中的对话会被中断。", confirmText: "重启", danger: true }))) return;
-              try {
-                await api("/api/system/restart", { method: "POST" });
-                toast("正在重启…");
-                setTimeout(() => location.reload(), 5000);
-              } catch (err) {
-                toast(err.message);
-              }
-            },
+        "button",
+        {
+          class: "btn",
+          disabled: !sys.underSystemd,
+          onclick: async () => {
+            if (!(await confirmDialog({ title: "重启 agent-loft？", message: "进行中的对话会被中断。", confirmText: "重启", danger: true }))) return;
+            try {
+              await api("/api/system/restart", { method: "POST" });
+              toast("正在重启…");
+              setTimeout(() => location.reload(), 5000);
+            } catch (err) {
+              toast(err.message);
+            }
           },
-          "重启服务",
-        ),
-        "Notification" in window && Notification.permission !== "granted"
-          ? h("button", { class: "btn", onclick: () => Notification.requestPermission() }, "开启浏览器通知")
-          : null,
+        },
+        "重启服务",
       ),
+      "Notification" in window && Notification.permission !== "granted"
+        ? h("button", { class: "btn", onclick: () => Notification.requestPermission() }, "开启浏览器通知")
+        : null,
     ),
   );
 }

package/web/style.css

@@ -180,6 +180,15 @@ select.input {
   opacity: 0.7;
 }
 
+/* 放在 .field 里的复选框 / 单选框不套用上面输入框的宽度和内边距：
+   否则复选框被撑宽，旁边的文字会被挤成两行（比如飞书机器人的「可用的 Agent」） */
+.field input[type="checkbox"],
+.field input[type="radio"] {
+  width: auto;
+  padding: 0;
+  flex-shrink: 0;
+}
+
 .input:focus,
 .field input:focus,
 .field select:focus,
@@ -2091,6 +2100,24 @@ button.ctx-item:hover {
   opacity: 0.4;
 }
 
+.send-btn:has(.send-spinner) {
+  opacity: 1;
+}
+
+/* 发送中：按钮里转圈，颜色跟着按钮的前景色走（深浅模式都看得清） */
+.send-spinner {
+  width: 14px;
+  height: 14px;
+  border: 2px solid currentColor;
+  border-right-color: transparent;
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+textarea.sending {
+  opacity: 0.6;
+}
+
 .send-btn svg {
   width: 15px;
   height: 15px;