Files
jiapuapp/docs/superpowers/plans/2026-07-17-g01-loading-state.md
T
2026-07-20 06:52:23 +08:00

2.7 KiB
Raw Blame History

G01 Loading State Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (- [ ]) syntax for tracking.

Goal: 将 G01 的空心金圈加载态替换为项目统一的 AppLoading 朱砂“谱”印加载视觉。

Architecture: AppLoading.vue 继续作为加载视觉的唯一维护入口;G01 只导入组件、传入“正在整理家谱”文案并保留现有辅助说明。旧 loading-seal 模板和样式在同一轮移除。

Tech Stack: uni-app、Vue 3、SCSS、PowerShell 契约测试、Chrome H5。

Global Constraints

  • 只修改 G01 加载分支及其契约,不改变正常、空、失败状态。
  • 不生成新资产,不修改 AppLoading.vue 的全局样式。
  • 不使用多代理、worktree 或 Git 写操作。
  • H5 证据不代表 Android/HBuilderX 或 G01 整页正式验收。

Task 1: G01 统一加载态

Files:

  • Create: tests/g01-loading-state-contract.ps1
  • Modify: pages/genealogy/g01-my-genealogies.vue

Interfaces:

  • Consumes: AppLoading.vuetext: String 属性。

  • Produces: G01 state=loading 下的 .state-panel--loading .app-loading 运行结构。

  • Step 1: 写入失败契约

契约必须断言 G01 导入并渲染 <AppLoading text="正在整理家谱" />,保留辅助说明,同时不存在 loading-seal

  • Step 2: 验证契约失败

Run: powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-loading-state-contract.ps1

Expected: FAIL,指出 G01 尚未使用 AppLoading

  • Step 3: 实施最小修改
<view v-if="isLoading" class="state-panel state-panel--loading">
  <AppLoading text="正在整理家谱" />
  <text class="state-copy state-copy--loading">请稍候家族记忆正在归卷</text>
</view>

并加入:

import AppLoading from "@/components/AppLoading.vue";

删除 .loading-seal 样式;仅为加载辅助说明设置不重复全局 Loading 的间距。

  • Step 4: 验证

Run:

powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-loading-state-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-empty-state-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/compile-audit.ps1
node tests/g01-empty-state-runtime-smoke.js http://localhost:5173

Expected: 全部 PASS。

  • Step 5: 视觉复核

在 412×900 与 320×568 捕获 state=loading,确认朱砂谱印清晰、内容居中、长背景连续、底栏不遮挡且没有横向溢出。