1.9 KiB
1.9 KiB
G 类型页面共用 C 背景设计
目标
将已选定的 C“云竹亭台连续宣纸景”设为所有活动 G 类型页面的公共背景。背景必须完整显示左右画面、不裁剪、不变形；高屏和长页面超出图片高度的部分使用同色宣纸底色自然延展。
范围
- 覆盖
pages.json中 9 个活动 G 路由：G01、G03、G05、G06、G08、G09、G10、G11、G12。 - 只替换页面最底层的旧纸纹和页脚山水，不改标题栏、内容卡片、交互、状态数据或路由。
- G01 的固定区／独立滚动结构不在本次范围内。
- 当前只形成 H5 内部候选证据；Android/HBuilderX 真机或模拟器复核仍然缺失。
单一所有者
新增 components/GenealogyPageBackground.vue，由它唯一持有：
- C 背景运行资产路径；
- 同色宣纸延展底色；
- 顶部对齐、按宽度等比显示、固定在页面底层且不接收指针事件的布局规则。
9 个页面只渲染该组件，不再分别引用 page-paper.jpg、footer-mountain-bamboo.png 或直接引用 C 背景资产。
显示规则
- 外层背景固定覆盖视口，使用宣纸底色填满未被图片覆盖的区域。
- C 背景图片宽度为
100%，使用mode="widthFix"等比计算高度并顶部对齐。 - 图片不使用
aspectFill或scaleToFill，因此左右不裁剪且画面不变形。 - 页面内容继续使用各页现有层级；公共背景位于
z-index: 0，不改变弹窗和操作层层级。
验证
- 契约测试必须解析
pages.json得到实际 G 路由，并断言每个页面只使用公共背景组件。 - 契约测试必须禁止 G 页面继续引用旧纸纹、旧页脚山水或直接重复引用 C 背景。
- G01 原有视觉、空状态和运行冒烟测试继续通过。
- H5 在 320×568、360×640、360×800、412×915 下截图检查：左右完整、无拉伸、无横向溢出，底部宣纸延展连续。