AGC 资源工作台三处交互收口：侧栏关闭入口合并、删除折叠把手、播放左对齐 #361

Merged

suzmii merged 9 commits from fix/agc-resource-workbench-chrome into master 2026-09-15 00:44:02 +08:00

Conversation 0 Commits 9 Files Changed 16

+788 -263

9 Commits

Author	SHA1	Message	Date
suzmii	0aa6dfe994	修复两个 CSS 文件末尾多出的空行（CI git diff --check 报 new blank line at EOF） ... - resourceCanvasAssetGenerationTasksSidebar.css：文件末尾由 ``}\n\n\n`` 收敛为 ``}\n``，与 origin/master 的结尾字节一致 - styles.css：同上（此前由编辑工具补写整文件时多留了两个空行） - 两处都只删结尾空白，文件内容与行尾风格（LF）不变	2026-09-15 00:02:57 +08:00
suzmii	40e2a1b9b1	AGC 资源工作台工具条：把布局状态提示移出动作行，按钮间距不再随提示文案变长而变化 ... - 根因（按真机截图逐像素量出来的）：动作行 `game-workbench-view-actions` 里除了按钮还挂着 `game-resource-reorder-status` 这个 `role="status"` 提示，它是 flex 子项、`white-space: nowrap`，文案从空 →「保存中」→「布局已保存」→ 失败原因会越变越长，于是把右侧按钮按文本宽度顶开：同一份截图里「资源面板→生成素材」「生成素材→整理画布」的空隙是 64/66px，而「整理画布→生成任务」是 80px，差值正是这条提示当时的宽度（10px × 8 字符 ≈ 16px） - 修法：把它从动作行里搬出来，改成工具条内的绝对定位（`bottom: 4px; left: 12px`，`max-width` + 省略号兜底），不再参与行内排版；四枚动作按钮的内容宽度实测都是 132~134px，间距因此只剩一套 - 保留上一笔的分段控件 `margin-left: 17px`：它解决的是另一半——分段控件内部 0 间距导致它与前一按钮只隔 10px，而其余按钮之间是 24px - 用例：新增「布局状态提示不参与动作行排版，不会按文案宽度顶开按钮」，钉住 `position: absolute` 与锚点；既有「布局已保存」文本断言（按文本查，不依赖它在哪个容器）不受影响 - 文档：AGC 入口矩阵补「工具条动作行的间距只有一套」口径，写清提示为什么不进这一行 验证：tsc --noEmit 通过；appSurface 全量 441 条通过；侧栏开合与入口 5 条、画布手动布局 9 条通过；变异验证：把提示改回 `position: static`，新用例变红	2026-09-14 23:33:32 +08:00
suzmii	e272492f25	AGC 资源工作台工具条：统一行内间距，「依赖 / 类型」不再与前一按钮贴得过近 ... - 现象：工具条动作行里「资源面板 / 生成素材 / 整理画布 / 生成任务」之间是 gap 7px + 两侧 padding 11px = 视觉 24px，而「整理画布 → 生成任务 → 依赖」这一段只有 gap 7px + 分段控件自带 padding 3px = 10~13px，一行里两套间距；截图量出来的词间距是 64/65/65px，换算后正好差在这一段落上 - 根因：`.game-workbench-tabs.game-resource-sort-tabs` 把分段控件的 `padding: 3px` 归零后，它和同容器兄弟之间就只剩行本身的 7px gap，而其余按钮靠自身左右 padding 各撑出 11px - 修法：给分段控件补 `margin-left: 17px`（7 + 17 = 24px），整行只剩一套间距；分段控件内部仍是 0 间距的连通分段（依赖 / 类型 共享边界不变），高度 36px 与其余按钮对齐的既有口径不变 - 用例：`resourceCanvasGenerationTasksSidebarDismiss.test.tsx` 新增「依赖 / 类型 与前一按钮之间的间距跟行内其他按钮一致」，钉住 `margin-left: 17px` 与 `padding: 0` 两条声明 验证：tsc --noEmit 通过；appSurface 全量 441 条通过；侧栏开合与入口 4 条、画布手动布局 9 条通过；变异验证：把 `margin-left` 改回 0，新用例变红	2026-09-14 23:25:46 +08:00
suzmii	38928167f4	Merge branch 'master' into fix/agc-resource-workbench-chrome	2026-09-14 23:11:57 +08:00
suzmii	d0b15dbc54	AGC 生成任务侧栏：收起也补上退场动画，退场期间内容不跳 ... - 进场本来就有动画（`…-enter`），收起却是瞬间卸载，观感上"闪一下没了"。现在收起先播退场再卸载：`open` 变 false 后进入 `leaving`，根节点挂 `is-leaving` 播 `…-leave`（与进场同向反向，160ms，`pointer-events: none`），播完才卸载 - 时长在组件与 CSS 两处各写一次，组件导出 `RESOURCE_CANVAS_ASSET_GENERATION_TASKS_LEAVE_MILLIS` 并由用例钉住两处一致 - 减动效偏好下 CSS 已关掉动画，组件那边同步按 0ms 处理，收起立即卸载，不白等 160ms - 退场期间沿用收起前那一份列表（`lastRenderedRef`）：宿主会在同一帧里收起侧栏并把在途任务收口，直接吃新 props 会让退场动画里的内容跳一下；滚动区的空态分支也改读这份冻结快照，不能读实时 `ordered`（这是本批调试时用假时钟用例抓到的真问题） - 用例：面板用例新增「收起时先播完收起动画再卸载，动画期间列表内容不跳」；样式用例新增「is-leaving 挂上收起动画、pointer-events: none、减动效同样关掉」；既有生成任务相关性用例改为等退场动画走完再断言（新增 `waitForTasksSidebarLeaveAnimationToFinish`） - 文档：AGC 入口矩阵与 decision-log 同步退场动画口径 验证：tsc --noEmit 通过；appSurface 全量 441 条通过；侧栏面板 9 条、样式 10 条、开合与入口 3 条通过；变异验证：把早返回改回「立即卸载」与把 CSS 的 `is-leaving` 选择器写错，对应断言分别变红	2026-09-14 23:01:35 +08:00
suzmii	96971403ee	AGC 资源画布：定位到素材后把视口居中到该卡 ... - 根因：`handleResourceSelect` 只改选中、不移动画布，而这张画布是 transform 平移的、资源卡不在任何滚动容器里；既有的 `card.scrollIntoView()` 碰不到滚动祖先，卡在视口外时用户看到的就是「定位过去了但依然见不到素材」 - 新增 `centerResourceCanvasOnResource`：读该卡在当前布局位置表里的 x/y 与卡片尺寸，按 `canvasSize / 2 − 卡中心 × scale` 求视口平移量；缩放保持不变（定位不改用户缩放预期，与 `ensureResourceBookContentVisible` 同口径） - 聚焦链在「选中新资源」那一步之后调用它；`scrollIntoView` 保留（栏目页仍有带滚动条的祖先） - 用例：新增「centers the canvas viewport on the located asset so it is actually visible」，用渲染进 DOM 的真实画布尺寸断言 `viewportX + 卡中心 × scale = 画布中心` - 文档：decision-log 补「失去焦点即收起」与「定位必须让素材真的可见」两条决策；AGC 入口矩阵同步自动收起、入口顺序与定位居中口径 验证：tsc --noEmit 通过；appSurface 全量 441 条通过；变异验证：把定位链里的居中调用摘掉，新用例变红（450 vs 400，正好是画布宽 800 的一半与旧视口之差）	2026-09-14 22:36:32 +08:00
suzmii	45ccc58969	AGC 生成任务侧栏：失去焦点自动收起、入口挪到排列方式之前 ... - 侧栏展开时挂 document 级 pointerdown 捕获监听：点在侧栏内部与工具条那枚开合按钮以外的地方（画布、其他工具条按钮、对话框）即自动收起侧栏 - 排除开合按钮本身：它自己负责 toggle，若在「点外部」里也命中会先收起再被 toggle 打开，表现为按钮失灵 - 工具条「生成任务」入口加 data-resource-generation-task-toggle 标记，供上面的判定排除 - 「生成任务」入口从资源排列方式之后挪到之前：动作在前、排列方式（依赖 / 类型）收在行尾；入口抽成可复用元素，资源页签与运行页签各渲染一次，同一时刻只渲染一处 - 新增 tests/resourceCanvasGenerationTasksSidebarDismiss.test.tsx：点外部收起、点内部与开合按钮不收起且仍能 toggle、入口排在依赖/类型之前 验证：tsc --noEmit 通过；vitest（新用例 3 条 + 生成任务侧栏 8 条 + 侧栏样式 9 条 + 画布手动布局 9 条）通过；变异验证：关掉自动收起 effect 与把入口挪回排列方式之后，对应断言分别变红	2026-09-14 22:29:16 +08:00
suzmii	9e709ce727	AGC 资源工作台交互收口：补充改动前三处截图对照图 ... - 新增 docs/technical/assets/agc-resource-workbench-ui-before-20260914/：任务侧栏两个关闭入口、左侧贴边折叠把手、顶部播放按钮居中悬浮三张改动前截图 - 新增该目录 README，逐图说明改动前的问题与同步过的文档口径，供 PR 与后续回归对照	2026-09-14 22:02:54 +08:00
suzmii	96ae3db1df	AGC 资源工作台三处交互收口：侧栏关闭入口合并、删除折叠把手、播放左对齐 ... - 「生成任务」侧栏头部右上角由返回箭头（ChevronLeft / aria-label=收起生成任务）改为关闭 X，并与底部那枚重复的 X 统一为同一个 aria-label=关闭生成任务 - 删除「生成任务」侧栏底部 footer（关闭按钮 + border-top 分割线）：关闭入口只留头部一枚 - 删除「生成任务」侧栏折叠态的左侧贴边竖排把手（handle 及其标签 / 在途角标 / 进场动画 / 悬停位移）：折叠后组件不再渲染任何常驻入口 - 清理上述删除留下的悬空样式：focus-visible 分组选择器、480px 窄屏媒体查询与 prefers-reduced-motion 块里的把手分支 - 工具条「生成任务」入口移出 `mode === 'resources'` 分支：两个页签下都常驻。侧栏本体本来就是无条件渲染的浮层，运行态可见；入口只留资源页签时，切到运行关掉侧栏就再也打不开（此前靠左侧贴边把手兼作运行态入口） - 工具条把「播放」移到「资源管理 / 运行」右侧并左对齐：新增 .game-workbench-view-tabs 作为左侧控件组，播放按钮由 absolute + left:50% + translateX(-50%) 的居中悬浮改为 static；相应删除 max-width:1000px 里的居中兜底规则 - 播放按钮并进按钮基础外观与 focus-visible 规则列表：新位置不再命中 .game-workbench-tabs / .game-workbench-view-actions 的选择器，漏掉会掉成零圆角、零内边距、无边框、默认字号的裸按钮（颜色规则仍生效，肉眼容易漏） - 播放按钮保持两个页签下都常驻（回到改动前的可见性）：运行视图空态与预览失败态要靠它重跑 - 同步更新断言：侧栏关闭入口唯一且 footer 不存在、折叠态不渲染任何按钮或把手、样式表不残留被删类名、播放按钮声明为左对齐静态定位且仍在基础外观/焦点环规则内 - 生成任务用例补回机器证据：折叠后工具条按钮的 data-resource-generation-task-count 归零、重开后头部「在途生成任务 0」徽标跟上收口结果、运行页签下侧栏仍能重开（先用 aria-selected 钉住真的切了页签）；用例夹具新增 runnable 开关把首个原型标成完成 - 同步文档现状：PRD 顶部播放按钮与任务侧栏进度面两条、AGC 栏目画布底部工具栏入口矩阵的侧栏形态、decision-log 的进度面形态决策 验证：tsc -p apps/ai-game-creator-shell/tsconfig.json --noEmit 通过；vitest appSurface 全量 440 条通过、生成任务侧栏 8 条与侧栏样式 9 条通过；check-encoding 通过；prettier --list-different 未新增命中（project-development/index.tsx 属基线既有非格式化文件）；变异验证：还原播放按钮基础外观规则、还原折叠把手与 footer、还原折叠态早返回、把「生成任务」入口退回 mode 分支，对应断言均变红	2026-09-14 22:00:06 +08:00