R2V WORKFLOW · 前端重构 · Before / After 实拍

R2V 工作台全面前端重构

在同一 R2V 项目(fe6d51f3 · 60 帧 · EP01)的同一视图上,分别用 pre-r2v-refactor 与重构后 HEAD 两次实拍。左 Before / 右 After,同一页面同一状态。

实拍项目 fe6d51f3 · 60 shots 回退锚点 pre-r2v-refactor 门禁 typecheck · check:colors · vitest 124/124 · i18n parity
① 侧栏 · per-step 阶段状态(Stage 13)
同一项目的左栏步骤导航。Before 只有序号;After 每步加三态点 + 状态标签 + 软门槛锁。
Before · :3009 pre-r2v-refactor 4eb3bab
rail before — no status
After · :3008 HEAD 2e21688
rail after — status dots/labels
DOM 实测:Before railStatus=false(只序号);After railStatus=true。Cast 显 ● 5 角色 · 5 已绑定;Storyboard ● 60 镜;Assembly 待合成;底部项目卡真实标题 + EP.01(取代「Project Alpha」桩)。两图来自 :3009(老代码独立 dev server)与 :3008(新代码),非 HMR。
② R2V 分镜台 · 模型下拉 + 生成条(Stage 6 / 10)· 全部展开
同一项目第 4 步「Storyboard」,点了「全部展开」让每个镜头面板都打开 —— 模型选择器的差异最直观。Before 每个镜头一排 pills;After 每个镜头一个下拉。
Before · :3009 pre-r2v-refactor 4eb3bab
storyboard before — pill-walls
After · :3008 HEAD 6ff0485 + 3ab5dd3
storyboard after — dropdowns
DOM 实测(puppeteer 在实时 DOM 上量):Before dropdownCount=0genSum=none;After dropdownCount=60(60 个镜头各一个下拉)、genSum="HappyHorse R2V · 4s"Δ 模型选择器:pill-wall(flex-wrap)→ tonal 下拉框。Δ 生成条:常驻 ● HappyHorse R2V · 4s 摘要。两图来自不同 dev server(:3009 老代码 / :3008 新代码),非 HMR,无时序竞争。
③ 全部改动清单(7 项实质 + 6 项验证 no-op)
下表为本次重构的全部 commit。纯皮阶段(5/7/8/9/11/12)经代码比对确认现有组件已贴近 mock,零回归。
关于「:3008 看到老样式」:重构代码已确认 LIVE 在 :3008(DOM 实测:gen-sum「HappyHorse R2V · 4s」、模型下拉 aria-expanded 触发器、侧栏「5 角色 · 5 已绑定 / 60 镜 / 待合成」均在渲染)。若仍见老样式,请硬刷新(Cmd+Shift+R)清浏览器缓存,或确认打开的是 R2V 项目(workflow_mode=r2v)的分镜步骤 —— legacy 项目走 StoryboardComposer(未纳入本次重构)。Before 截图通过 git checkout pre-r2v-refactor -- frontend/ 临时回退源码、借 dev server HMR 实拍后即时恢复 HEAD,工作树已确认干净。