Skip to content

💄 web: 控制台移动端适配第一轮:组织详情可滚、发送键不再被挤出、会话头一层、文件预览整屏 - #25

Merged
CodFrm merged 16 commits into
mainfrom
2026-09-21-server-mobile-gaps
Oct 19, 2026
Merged

CodFrm merged 16 commits into
mainfrom
2026-09-21-server-mobile-gaps

Conversation

@CodFrm

@CodFrm CodFrm commented Sep 21, 2026

Copy link
Copy Markdown
Contributor

改了什么

控制台移动端适配第一轮(只改 server 宿主,共享包不动、不重新 pin)。规格:docs/specs/2026-09-21-server-mobile-gaps.md。

页面 手机上原来 现在
组织 Agent 详情滚不动,执行目标/工具区够不着;看详情时写失败无提示;建不了第二个顶层部门 详情自身滚动(详情列 min-h-0 + 滚动区 relative 收住 sr-only 播报,文档高度 = 视口);失败提示出现在当前这屏的详情头下;「+」两项菜单含「新建顶层部门」
会话详情 / 新对话草稿 三层头部 ≈190px、文字互相压住、项目名看不到;底部 tab 常驻 AppShell immersive:不画页面顶栏与底部 tab,一层 68px 会话头(返回 · 两行标题 · Agent · 项目 · 机器 + 在线 · 时间 · ⋯)
输入框底栏 模型 chip 文案长时发送键被挤出框外 发送与权限不收缩,模型 chip 先收缩截断,思考力度/用量收成图标
会话里打开文件 420px 预览列把转录与输入框挤成 0 宽 整屏一层,占一条同 URL history;返回与系统返回只关这层、保留标签与未发送文字;桌面不变
设备 状态点单独一行、名字展开也看不全、缺「在跑」副行 点与名同行、展开折行显示全名、补回副行
总览热力图 日值只有鼠标悬停能看 点格子在图下固定一行读出「日期(星期)· N 个对话」
账号 邮箱标签逐字竖排、邮箱与登录时间截断 两列、值折行、时间分行

docs/design.md 同步记下上述壳与页面规则。

怎么验的

  • make test:Go 全绿,前端 124 文件 / 1990 用例全过;make lint-frontend 0。
  • 两条复审轴(对规格、对代码)各一遍,修正提交再各复审一遍。
  • 运行期:本分支正式构建 + e2e 专库 + 一台真 agentred + 真 Claude Code 三轮对话,用触屏 context(390×844 / 360×640)逐条观察,11 holds / 0 does not hold / 5 not observed。组织详情「文档不再被推走」首轮观察为 does not hold,修正(cb971d21)后复验成立。

未观察到 / 已知

  • 预览整屏层(V9–V12)未在运行期观察到:即使在绑项目、cwd 已确认的会话里,转录里的文件链接在本分支和本轮之前的构建(ddf3dfdf)上桌面与手机都不出预览入口——既有问题,另开一轮排查。这四条目前只由单测覆盖。
  • 账号页 IP 行与通行密钥时间(V16):e2e 数据里没有,未观察。
  • 手机上预览层开着时把窗口拉宽到桌面,会留下一条同 URL 的 history 记录(后退一次停在原地)。
  • 预览层里共享面板自己的标题与本层标题重复;层没有把焦点移进去——前者要改共享包,归第二轮。
  • 会话在项目里且正在跑时,头部副行截断得很短(信息都在,可读性差),第二轮随共享包一起再看。
  • 满载整跑时 new-conversation.test.tsx / chat.test.tsx 各偶发过一次失败,单跑均通过。

不在本轮

设置页供应商模型行与模型表、Agent 后端行、任务表单、消息统计行、hover/右键/双击专属操作、上下文用量触屏点开——都在共享包里,第二轮先改 agentre-ui 再 pin。

- 热力图点按读数改用自己的计数 key(中文「N 个对话」、英文分单复数),不再借统计卡的「N 条」
- 输入框底栏 leadingControls 外层加 shrink-[999],缺口先落在模型 chip 上,上下文用量只在 chip 收无可收时才让位(决策 7 的收缩顺序)
- 设备行展开后名字带 min-w-0 break-words,没有空格的长名字也完整折行
- design.md:更正组织页一节里两处与代码不符的描述,补上底栏收缩顺序
执行目标区末尾的 role=status sr-only 播报是 position:absolute,详情滚动容器
(OrgAgentDetail.tsx)此前没有任何定位祖先,播报的 static position 因此按初始
包含块(html 根)计算,落在滚动内容深处对应的文档坐标上,把 document 撑到
1133px(视口只有 844px)。移动端滚到详情区最后一个区块后继续下滑,手势会
链到文档去滚,顶栏/详情头/底部 tab 因而被推走。

给滚动容器本身加 relative 作为定位祖先,播报(以及以后可能出现的其他绝对定位
后代)的包含块落回这个容器内部,不再外溢。加 data-testid 锚住这条结构性断言,
jsdom 量不了布局。
- AppShell:immersive 与 index 槽并存,沉浸形态的安全区让在内容页里的 main 上
- 新对话草稿走壳的 immersive,顶部安全区不再在 chat-mobile-compose 上重复让一次(只剩「从项目里挑」那屏自己让)
- 组织:移动端详情头下的错误提示与索引列一起改成无线、text-destructive-text;详情列父容器桌面也成了 flex-col,min-h-0 改为不分端
- 会话头、找不到/读不到等状态壳的头部、移动端文件预览层头部去掉 border-b / bg-card,预览层底色改 bg-sheet
- 模型 chip 保留 min-w-0,用 field-fill 新底色
@CodFrm
CodFrm merged commit 335dd55 into main Oct 19, 2026
6 checks passed
@CodFrm
CodFrm deleted the 2026-09-21-server-mobile-gaps branch October 19, 2026 08:51
CodFrm added a commit that referenced this pull request Oct 19, 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