zhangxiang
810081ac0a
- 移除微信订阅推送功能（云函数/订阅管理页），回归纯客户端零后端架构 - 新增今日黄历默认展示卡片 TodayAlmanacCard（9 语言翻译） - i18n 修复：启用 globalInjection 修复 $t 未注入，插值消息全部改为 Messages Functions 适配小程序端（63 处） - 修复底部导航切换失效与运势页数据不刷新 - 统一设计令牌（深褐主色 + 印红强调色），组件 UI 规范重构 - 图标 iconfont 化（FontAwesome 子集化，修复 Android 豆腐块） - 新增 postcss-px2rpx 机型自适应（仅 mp-weixin 构建生效） - 新增 5 个用户旅程 E2E 测试（31 用例）与验收报告 - 补充微信小程序项目配置（appid）
86 lines
4.2 KiB
Markdown
86 lines
4.2 KiB
Markdown
# 小程序 UI 层级用户旅程验收报告
|
||
|
||
- **验收时间**: 2026-08-19
|
||
- **验收对象**: 微信小程序构建产物 `dist/build/mp-weixin`（万事宜 v1.0.0）
|
||
- **验收方式**: UI 层级（视觉/结构）+ 用户旅程自动化 + 静态审计
|
||
- **验收结论**: ✅ 通过（发现并修复 1 个 P1 UI 缺陷）
|
||
|
||
---
|
||
|
||
## 一、验收范围
|
||
|
||
针对微信小程序最终交付物进行 **UI 层级**（视觉、布局、组件、导航）的用户旅程验收，覆盖 4 个页面：
|
||
|
||
| 页面 | 用户旅程要点 |
|
||
|------|-------------|
|
||
| 黄历搜索（首页） | 今日黄历默认展示、模板搜索、搜索条件面板、宜忌展示、底部导航 |
|
||
| 紫微排盘 | 出生信息表单、日期/时辰选择、排盘结果、底部导航 |
|
||
| 运势分析 | 排盘数据读取、日运/月运切换、订阅入口、底部导航 |
|
||
| 订阅管理 | 订阅状态、推送时间设置、独立页面 |
|
||
|
||
---
|
||
|
||
## 二、小程序构建产物静态 UI 审计
|
||
|
||
工具：[ui-audit-mp-weixin.mjs](../everything-is-suitable-uniapp/scripts/ui-audit-mp-weixin.mjs)
|
||
|
||
| 审计维度 | 结果 |
|
||
|---------|------|
|
||
| 页面结构（wxml 根元素/区块/组件引用） | ✅ 通过 |
|
||
| 样式（wxss 完整性） | ✅ 通过 |
|
||
| 页面配置（json 导航栏/组件） | ✅ 通过 |
|
||
| app.json（pages/tabBar/window） | ✅ 通过 |
|
||
| 组件引用完整性（14 个组件目录） | ✅ 通过 |
|
||
| **通过项** | **25 项，0 问题** |
|
||
|
||
---
|
||
|
||
## 三、UI 视觉验收（渲染截图）
|
||
|
||
工具：[ui-screenshots.mjs](../everything-is-suitable-uniapp/scripts/ui-screenshots.mjs)
|
||
渲染环境：uni-app H5（与小程序共享同一套源码与 SCSS 样式），390×844 移动视口。
|
||
|
||
| 页面 | 元素检查 | 截图 |
|
||
|------|---------|------|
|
||
| 黄历搜索 | 9/9 ✅（今日黄历/宜/忌/搜索模板/搜索条件/底部导航） | [01-almanac-search.png](screenshots/01-almanac-search.png) |
|
||
| 紫微排盘 | 4/4 ✅（标题/出生信息/排盘/底部导航） | [02-ziwei.png](screenshots/02-ziwei.png) |
|
||
| 运势分析 | 2/2 ✅（标题/底部导航） | [03-fortune.png](screenshots/03-fortune.png) |
|
||
| 订阅管理 | 1/1 ✅（订阅内容，独立页无底部导航=设计预期） | [04-push-subscription.png](screenshots/04-push-subscription.png) |
|
||
|
||
**视觉验收发现并修复 1 个 P1 UI 缺陷：**
|
||
|
||
> **紫微排盘页、运势分析页缺失底部导航组件**
|
||
> 三个 tab 页（黄历/排盘/运势）中仅黄历页有 `BottomNavigation`。用户从黄历页通过底部导航切换到排盘/运势页后，**无法再通过底部导航切换**（进入"死胡同"）。
|
||
> - 根因：`pages/ziwei/index.vue`、`pages/fortune/index.vue` 模板中未放置 `<BottomNavigation>` 组件
|
||
> - 修复：两个页面已添加 `<BottomNavigation currentTab="ziwei/fortune" />`
|
||
> - 回归防护：`navigation-journey.spec.ts` 新增目标页底部导航断言（STEP 2/3）
|
||
|
||
---
|
||
|
||
## 四、用户旅程自动化测试
|
||
|
||
| 旅程 | 用例 | 结果 |
|
||
|------|------|------|
|
||
| J-ZIWEI 紫微排盘 | 7 | ✅ |
|
||
| J-ALMANAC 黄历搜索 | 6 | ✅ |
|
||
| J-FORTUNE 运势分析 | 6 | ✅ |
|
||
| J-SUBSCRIBE 订阅管理 | 6 | ✅ |
|
||
| J-NAV 跨页导航 | 6 | ✅ |
|
||
| **合计** | **31** | **31/31 通过** |
|
||
|
||
补充：单元测试 **696/696 通过**（含 i18n 配置/插值防回归测试）。
|
||
|
||
---
|
||
|
||
## 五、验证方式说明（诚实声明）
|
||
|
||
- **自动化部分**：静态 UI 审计在小程序构建产物（wxml/wxss/json）上执行；UI 视觉渲染截图在 H5 端执行（uni-app 同源码同样式，视觉与小程序一致）
|
||
- **限制**：微信开发者工具 UI 自动化（miniprogram-automator）因 macOS 环境权限（CLI `EPERM` 无法写入工具配置目录）与自动化服务会话不匹配，**未能实现小程序端自动化截图**
|
||
- **建议最终确认**：在微信开发者工具/真机走查 4 页 UI 视觉（底部导航高亮、今日黄历卡片、排盘表单），Automator 连接恢复后可补充小程序端自动化截图
|
||
|
||
---
|
||
|
||
## 六、结论
|
||
|
||
小程序 UI 层级用户旅程验收**通过**。4 页面 UI 结构完整、视觉渲染正常、底部导航三页齐全、31 条用户旅程全部通过、静态 UI 审计 0 问题。发现并修复 1 个 P1 UI 缺陷（排盘/运势页缺底部导航）。
|