2.2 KiB
2.2 KiB
公共加载组件红金印牌重设计
目标
将 components/AppLoading.vue 当前的细红方框“谱”字替换为与浅色国风主题一致的红金家谱印牌，同时保持组件可在 G01 及其他已接入页面复用。
范围
- 只修改公共
AppLoading的视觉表现及对应测试。 - G01 继续使用页面级加载形态，不改变状态判断、文案、页面背景、头部和底部导航。
- 已接入
AppLoading的其他页面自动获得同一视觉体系，不改各页面业务逻辑。 - 不新增接口，不使用原生 Toast、Modal、Loading 或 ActionSheet。
视觉方案
- 加载主体使用已有真实资产
/static/assets/foundation/transparent/brand-seal.png。 - 页面级印牌宽高约
132rpx × 136rpx；区域级约88rpx × 90rpx。 - 印牌下方使用已有真实资产
/static/assets/foundation/transparent/auth-divider-knot.png，作为轻量视觉连接，不新增 CSS 绘制图形。 - 主文案使用现有深墨色，保持约
30rpx，字重略加强。 - 说明文字保持约
24rpx和现有克制色阶。 - 组件背景继续透明，不增加卡片、白底、边框或阴影。
动效
- 印牌使用约
1.6s的轻呼吸动画。 - 缩放范围约为
0.96至1，透明度约为0.82至1。 - 不旋转、不快速闪烁、不移动页面布局。
- 如意结只做轻微透明度呼吸，避免与印牌争抢注意力。
- 尊重
prefers-reduced-motion: reduce：关闭动画并保持最终清晰状态。
组件契约
- 保留
variant="page"和variant="section"。 - 保留
text与description属性，不改变调用方式。 - 页面级与区域级仅在尺寸、间距和字号上区分，共用同一真实资产和动效语义。
验证
- 更新公共加载组件契约，确保使用
brand-seal.png和auth-divider-knot.png，并禁止旧的 CSS 方框标记回归。 - 运行公共加载组件、G01 加载状态、G 系列和其他模块加载契约。
- 运行编译审计和相关运行检查。
- 在同一个可控 Chrome 标签页检查 G01
412×900，并补查320×568、360×640、360×800、412×915。 - H5 结果只作为内部候选证据；Android/HBuilderX 真机或模拟器复核仍然缺失。