docs(ui04): E00 baseline — design refs, plan, v1 measurements and record skeleton
Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
@@ -0,0 +1,86 @@
|
||||
# UI-04 验收记录：嵌入组件自动上滚照片窗
|
||||
|
||||
对应方案：[2026-09-22-UI04-嵌入组件上滚照片窗高保真实施方案](../2026-09-22-UI04-嵌入组件上滚照片窗高保真实施方案.md)
|
||||
执行日期：2026-09-22 起
|
||||
交付目录：[docs/designs/ui04-implementation/](../../designs/ui04-implementation/)
|
||||
|
||||
## 0 基线与保护
|
||||
|
||||
- 基线 commit：f435d7b（docs: UI-03 acceptance record）+ 本记录随 E00 提交。
|
||||
- 工作树既有改动保护：E00 起始时工作树存在 **UI03R（App 高保真还原）未提交改动**
|
||||
（apps/mobile/*、apps/mobile/android/*）——与本任务文件集（packages/embed-loader、
|
||||
apps/viewer、apps/admin、packages/contracts、services/api）不相交；全程不暂存、
|
||||
不 reset/clean、不 checkout 这些路径。
|
||||
- 本任务新入库文件：docs/designs/embed-widget-*-2026-09-22.{png,md}（设计稿三组）、
|
||||
docs/plans/2026-09-22-UI04-*.md（方案）、docs/designs/ui04-implementation/**（证据）。
|
||||
|
||||
## 1 E00 基线（v1 现状采集）
|
||||
|
||||
- 现状代码核对：loader（packages/embed-loader/src/loader.js 424 行 + params.js 197 行）；
|
||||
viewer 嵌入页（EmbedPage.vue + pages/embed/{EmbedCarousel,EmbedStage,EmbedFooterBar}；
|
||||
embed/{useEmbedFeed,feed,postMessage,images}.ts）；实时（realtime/ws.ts RealtimeClient，
|
||||
likes.burst 契约见 packages/contracts/src/realtime.ts）；API 侧 embed（cn 管理）与
|
||||
embed-ov（ov 公开数据，settings 归一化投影）；admin embed-slots 五视图。
|
||||
- v1 运行截图（跨源宿主 127.0.0.1:3999 ← viewer 5175，slot 绑定 6 张种子照片）：
|
||||
- [v1-desktop-baseline.png](../../designs/ui04-implementation/reference/v1-desktop-baseline.png)
|
||||
- [v1-mobile-baseline.png](../../designs/ui04-implementation/reference/v1-mobile-baseline.png)
|
||||
- v1 尺寸实测（getBoundingClientRect，viewport 1440×900 / 390×844）：
|
||||
|
||||
| 端 | 元素 | 尺寸 |
|
||||
|---|---|---|
|
||||
| 桌面 | wrapper/iframe（md） | 320×339（宽度 md=320；高度为 iframe resize 上报的内容高） |
|
||||
| 手机 | 收起把手 | 97×44 |
|
||||
| 手机 | 展开 wrapper（sm 强制） | 280×309 |
|
||||
|
||||
- v1 行为登记：窄屏（<480px）默认收起 + 强制 sm；配置优先级 data-* > config 消息 >
|
||||
默认；postMessage 白名单 {resize,collapse,expand,config,destroy}；轮询 30s + ETag
|
||||
304 + 失败退避 ×5；destroy 于 404/410。
|
||||
- 采集方式：临时 Playwright 规格（复用 embed-crossorigin 夹具模式，种子经 e2e helpers
|
||||
直种 cn 库 + flushSync/flushOutbox 同步 ov），采集后已删除；本地栈复用既有进程
|
||||
（compose 容器已运行 26h+，cn:8080 / ov:8081 / viewer:5175 复用）。
|
||||
|
||||
## 2 版本与兼容策略（E01 定案登记）
|
||||
|
||||
（E01 完成后填写：v2 入口形态、路由/参数、新字段清单、v1 保留验证。）
|
||||
|
||||
## 3 任务进度
|
||||
|
||||
- [x] E00 基线（本记录第 1 节）
|
||||
- [ ] E01 契约和版本骨架
|
||||
- [ ] E02 静态高保真样板
|
||||
- [ ] E03 连续滚动
|
||||
- [ ] E04 操作和生命周期
|
||||
- [ ] E05 实时气泡
|
||||
- [ ] E06 管理预览与接入
|
||||
- [ ] E07 验收（EMB-A01…A16 逐项见第 5 节）
|
||||
|
||||
## 4 测量与证据索引
|
||||
|
||||
（E02+ 起登记：尺寸实测、位移曲线、DOM/连接上限统计、录屏清单。）
|
||||
|
||||
## 5 验收矩阵 EMB-A01…A16
|
||||
|
||||
| 编号 | 场景 | 状态 | 证据 |
|
||||
|---|---|---|---|
|
||||
| EMB-A01 | 多视口固定尺寸 195×280 | 待验 | |
|
||||
| EMB-A02 | 狭窄/横屏/安全区/多实例不越界 | 待验 | |
|
||||
| EMB-A03 | 横/竖/全景/单图/0图/2图短循环 | 待验 | |
|
||||
| EMB-A04 | decode 慢/破图/签名到期/304/失败恢复 | 待验 | |
|
||||
| EMB-A05 | 循环锚定 + DOM 上限 | 待验 | |
|
||||
| EMB-A06 | 隐藏/删除/关闭/换绑/停用清理 | 待验 | |
|
||||
| EMB-A07 | 点击/拖动/悬停/键盘/reducedMotion | 待验 | |
|
||||
| EMB-A08 | 收起展开/记忆/默认收起/后台配置更新 | 待验 | |
|
||||
| EMB-A09 | 双上下文真实点赞/重复 burst/错相册/不可见归属 | 待验 | |
|
||||
| EMB-A10 | WS 断线不假造气泡 | 待验 | |
|
||||
| EMB-A11 | 真跨源 + 消息伪造拒绝 | 待验 | |
|
||||
| EMB-A12 | 宿主全局 CSS/重复 script/SPA 移除 | 待验 | |
|
||||
| EMB-A13 | 后台预览隔离 + v2 接入代码 | 待验 | |
|
||||
| EMB-A14 | v1 保留 + 普通 viewer 无回归 | 待验 | |
|
||||
| EMB-A15 | 不上报浏览/不提交点赞 | 待验 | |
|
||||
| EMB-A16 | 证据完整、未测项如实标注 | 本记录即载体 | |
|
||||
|
||||
## 6 未完成项与外部资源
|
||||
|
||||
- 真实 CDN/发布不在本轮（方案 §1.2）；本轮只产出构建产物与文档。
|
||||
- E02 起静态样板需真实摄影素材（非 sharp 色块）——种子照片拟下载固定摄影样本入 MinIO；
|
||||
网络不可用时降级为记录待验，不标记通过。
|
||||
Reference in New Issue
Block a user