Skip to content

feat(dashboard): add session monitor room#405

Open
nil-err wants to merge 4 commits into
deepcoldy:masterfrom
nil-err:codex/dashboard-monitor-room
Open

feat(dashboard): add session monitor room#405
nil-err wants to merge 4 commits into
deepcoldy:masterfrom
nil-err:codex/dashboard-monitor-room

Conversation

@nil-err

@nil-err nil-err commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

背景和目标

Dashboard 目前每个会话只能单独点击「终端」查看 Web Terminal。这个 PR 新增「监控室」能力,让用户可以把多个会话的终端放在同一个页面里观察,适合长时间跟进多路任务执行状态。

功能变更情况

  • 会话管理页面新增「监控室」入口,现在点击后在当前 Dashboard 页面内跳转到监控室,不再新建浏览器标签页。
  • 会话列表支持勾选多个会话,并通过「添加到监控室」批量加入监控列表。
  • 监控室页面展示已加入的会话终端,每个会话一个独立面板。
  • 监控列表保存在浏览器 localStorage,不引入服务端持久化,也不会影响其他浏览器或其他用户。
  • 监控室支持移除单个会话、清空全部会话,并能跳回会话列表。
  • 新增本地设置开关「空列表显示活跃会话」,默认关闭;开启后,如果监控室没有手动添加的会话,会自动展示会话页「仅活跃」筛选得到的所有活跃会话。
  • 自动活跃模式下展示的是派生列表,不展示无效的单个移除按钮;手动添加任意会话后仍优先展示手动监控列表。
  • 终端不可用或会话不存在时,监控室会展示对应占位提示。
  • 修复浏览器缩放到 80% 时监控室标题和终端网格之间出现大段空白的问题。
  • 监控室内终端现在按当前浏览器真实视口尺寸渲染后整体等比例缩小,避免小 iframe 触发终端重新排版;字号、行列密度和直接打开终端时保持一致,只是整体缩小显示。
  • 监控室每个格子的比例和大小会根据当前浏览器窗口、可用页面空间和会话数量自动计算;窗口变宽、变窄或变高时,格子宽高和列数会重新排布,并保持与当前窗口一致的画面比例。
  • 每个格子右上角的「打开终端」按钮不再新建窗口,改为在当前页面弹出终端浮层;点击浮层外部、切走焦点或按 Esc 会关闭浮层。

代码更改情况

  • 新增 src/dashboard/web/monitor-room-store.ts:封装监控室会话 ID 列表和「空列表显示活跃会话」开关的 localStorage 读写逻辑。
  • 新增 src/dashboard/web/session-terminal.ts:抽出单会话终端 URL 生成逻辑,供会话页、监控室 iframe 和浮层复用。
  • 新增并持续完善 src/dashboard/web/monitor-room.ts:实现监控室页面渲染、手动/自动会话列表选择、终端 iframe、比例缩放、动态网格布局、浮层终端、移除和清空交互。
  • 更新 src/dashboard/web/dashboard-routes.ts:注册 #/monitor-room 路由。
  • 更新 src/dashboard/web/sessions.ts / sessions-page.tsx:增加监控室入口、批量添加按钮,并将入口改为当前页跳转。
  • 更新 src/dashboard/web/i18n.ts:补充监控室、自动活跃开关和浮层相关中英文文案。
  • 更新 src/dashboard/web/style.css:增加监控室网格、会话面板、iframe 容器、自动开关、浮层终端、占位态样式;补充顶部对齐、动态比例和 iframe 等比例缩放布局。
  • 更新 test/dashboard-monitor-room.test.ts:覆盖监控列表存储、自动活跃开关存储、终端 URL、iframe 缩放几何计算和动态网格几何计算。

验证情况

  • git diff --check 通过。
  • corepack pnpm test -- test/dashboard-monitor-room.test.ts 通过,9 个用例通过。
  • corepack pnpm exec tsc 通过。
  • node scripts/build-dashboard.mjs 通过。
  • 浏览器 smoke 通过:会话页点击「监控室」保持当前标签页跳转;自动活跃开关默认关闭,开启后只展示活跃会话;竖向窗口和横向窗口下卡片比例都与 window.innerWidth / window.innerHeight 一致,列数会随窗口变化;iframe 内部终端 viewport 跟随当前真实窗口尺寸;右上角终端按钮弹出页面内浮层且不新建页面。

兼容性和风险

  • 监控室状态只存在当前浏览器的 localStorage,刷新和重开页面仍保留,但不会跨浏览器同步。
  • 监控室复用现有单会话终端访问链路,不新增后端接口。
  • 多个终端 iframe 同时渲染会增加浏览器前端开销;当前实现主要面向少量并发监控会话。

@nil-err nil-err marked this pull request as ready for review July 8, 2026 08:05
@nil-err nil-err requested a review from deepcoldy as a code owner July 8, 2026 08:05
@nil-err nil-err changed the title [codex] feat(dashboard): 增加会话监控室 feat(dashboard): add session monitor room Jul 8, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant