全模块开发实施计划

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

Goal: 根据已验证的需求文档，按优先级完成所有未实现/部分实现的功能模块开发

Architecture: 前端 uni-app Vue 2（微信小程序），后端 Spring Boot + JPA + MySQL。后端 API 优先开发，前端页面随后跟进。新功能继承现有代码风格（无可选链、rpx 单位、JWT 认证）。

Tech Stack: 前端 uni-app + Vue 2，后端 Spring Boot + JPA + MySQL，图表 uCharts，富文本编辑器 uParse

一、现状总览

已完成（本轮会话）

✅ 品牌改名：汐艾福→浠艾福，汐福俱乐部→浠艾福俱乐部（8文件）
✅ TabBar重构：首页/发现/商城/我的 → 首页/身体/心智/行动/我的（5 tabs）
✅ 新建占位页：pages/body/index.vue，pages/mind/index.vue
✅ 未登录可浏览：入口页 = discover/index（非 login）
✅ 自定义底部导航：未登录时2-tab（首页+行动）
✅ 后端编译修复：StreakService（mvn clean compile）

需求文档状态

文档	模块	未实现/部分实现项
task-requirements.md	任务管理	TASK-016（批量操作）❌
focus-requirements.md	专注训练	FOCUS-005/006/007 ❌，FOCUS-004/008 ⚠️
guide-requirements.md	成长规划师套餐	全部后端+前端 ❌（不含已实现的需求分析文档中的规划师基础功能）
badge-requirements.md	勋章系统	BADGE-001~006 全部 ❌
report-requirements.md	报表统计	REPORT-001~004 全部 ❌
dan-requirements.md	DAN测评	DAN-001~019 大部分 ❌
requirements-analysis.md	规划师基础功能	全部 ✅（已在之前实现）

二、优先级分组

P0 - 阻塞项（必须先完成）

Tab图标资源文件缺失
身体/心智Tab占位页补全内容

P1 - 核心功能

专注训练模块剩余功能（记录分析+成果展示+排行）
勋章系统全功能（定义→解锁→展示→排行）
报表统计模块（个人+家庭统计+趋势图表）
成长规划师套餐模块（后端API+前端管理）

P2 - 高级功能

DAN测评模块（大部分P0/P1需求）
任务批量操作（TASK-016）
训练提醒与激励（FOCUS-007）

P3 - 扩展功能

DAN测评集成支付（DAN-016）
数据导出PDF/Excel
同龄对比数据

三、实施任务分解

Task 1: Tab图标资源文件（P0）

阻断了 已部署的5-tab自定义导航栏显示（目前引用不存在的图标文件）

Files:

Create: cfc-frontend/static/tab-body.png
Create: cfc-frontend/static/tab-body-active.png
Create: cfc-frontend/static/tab-mind.png
Create: cfc-frontend/static/tab-mind-active.png
Create: cfc-frontend/static/tab-action.png
Create: cfc-frontend/static/tab-action-active.png
Create: cfc-frontend/static/tab-home.png
Create: cfc-frontend/static/tab-home-active.png
Create: cfc-frontend/static/tab-profile.png
Create: cfc-frontend/static/tab-profile-active.png
[ ] Step 1: 确认已有图标

检查 cfc-frontend/static/ 下已有 logo.png。从设计稿或在线资源生成24x24px PNG图标：

tab-home, tab-home-active：首页/房子图标
tab-body, tab-body-active：身体/健康图标
tab-mind, tab-mind-active：心智/大脑图标
tab-action, tab-action-active：行动/靶心图标
tab-profile, tab-profile-active：我的/人物图标

生成规则：未选中 = 灰色线描，选中 = 橙色填充（主色 #F97316）

Step 2: 生成或创建占位图标

如果无设计资源，创建纯色简约占位图标（圆形+文字缩写）确保自定义tab-bar不报错。

Step 3: 验证

检查 custom-tab-bar/index.vue 中所有 icon 和 selectedIcon 路径对应的文件均存在。

Task 2: 身体Tab内容页（P0）

Files:

Modify: cfc-frontend/pages/body/index.vue

身体/健康Tab页。展示健康相关内容入口（步数、运动、饮食记录等）。

Step 1: 设计身体Tab页面布局

参考 pages/index/index.vue 风格，从上到下：

顶部轮播/推荐区（健康文章推荐）
功能入口网格（4-6个）：我的运动、饮食记录、睡眠监测、健康知识等
底部占位（后续功能）

[ ] Step 2: 实现页面 UI

<template>
<view class="body-page">
<!-- 顶部Banner -->
<swiper class="banner" indicator-dots autoplay interval="3000">
  <swiper-item v-for="(item, i) in banners" :key="i">
    <image class="banner-img" :src="item.image" mode="scaleToFill" />
  </swiper-item>
</swiper>

<!-- 功能入口网格 -->
<view class="grid">
  <view class="grid-item" v-for="(item, i) in features" :key="i" @click="navigateTo(item.path)">
    <image class="grid-icon" :src="item.icon" mode="aspectFit" />
    <text class="grid-label">{{ item.label }}</text>
  </view>
</view>

<!-- 健康资讯列表 -->
<view class="section">
  <text class="section-title">健康知识</text>
  <view class="article-card" v-for="(a, i) in articles" :key="i">
    <text class="article-title">{{ a.title }}</text>
    <text class="article-desc">{{ a.desc }}</text>
  </view>
</view>
</view>
</template>

[ ] Step 3: 添加脚本+样式

使用 rpx 单位，主色调 #F97316，遵循现有首页样式风格。底部预留 safe-area。

Step 4: 验证

lsp_diagnostics 清洁，页面在真机/模拟器可正常渲染，Tab切换流畅。

Task 3: 心智Tab内容页（P0）

Files:

Modify: cfc-frontend/pages/mind/index.vue

心智/心理健康Tab页。

[ ] Step 1: 设计心智Tab页面布局
顶部功能区：心理测评入口、情绪日记
文章列表：心理教育/成长文章，分类筛选
底部：心理热线/求助入口
[ ] Step 2: 实现页面 UI

风格参考body页面，保持视觉一致性。

Step 3: 验证

lsp_diagnostics 清洁。

Task 4: 专注训练 - 训练记录与数据分析（P1）

需求文档: focus-requirements.md FOCUS-004/005/006 - 训练记录存储、数据分析、成果展示

Files:

Modify: cfc-backend/src/main/java/com/etotem/cfc/service/GameService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/GameRecord.java
Create: cfc-backend/src/main/java/com/etotem/cfc/repository/GameRecordRepository.java
Create: cfc-frontend/pages/games/records.vue
Create: cfc-frontend/pages/games/statistics.vue

[ ] Step 1: 创建 GameRecord 实体

@Entity
@Table(name = "game_record")
public class GameRecord {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private Long childId;
private String gameCode;
private Integer score;
private Integer duration;       // 秒
private String level;           // easy/medium/hard
private Integer rank;
private Integer pointsEarned;
private Date completedAt;
private Date createdAt;
private Date updatedAt;
}

[ ] Step 2: 创建 GameRecordRepository

public interface GameRecordRepository extends JpaRepository<GameRecord, Long> {
List<GameRecord> findByChildIdOrderByCompletedAtDesc(Long childId);
List<GameRecord> findByChildIdAndGameCodeOrderByCompletedAtDesc(Long childId, String gameCode);
Optional<GameRecord> findTopByChildIdAndGameCodeOrderByScoreDesc(Long childId, String gameCode);
Long countByChildId(Long childId);
Long countByChildIdAndCompletedAtBetween(Long childId, Date start, Date end);

@Query("SELECT AVG(g.score) FROM GameRecord g WHERE g.childId = :childId AND g.gameCode = :gameCode")
Double avgScoreByChildIdAndGameCode(@Param("childId") Long childId, @Param("gameCode") String gameCode);
}

[ ] Step 3: 实现训练统计 API

GameController 新增：

POST /api/games/record - 记录成绩（孩子）
GET /api/games/records/{childId} - 记录列表（分页）
GET /api/games/best/{childId}/{gameCode} - 最佳成绩
GET /api/games/statistics/{childId} - 训练统计（总次数、平均分、趋势）
[ ] Step 4: 实现训练记录前端页面 pages/games/records.vue

列表展示历史训练记录，支持按游戏筛选。

Step 5: 实现训练统计前端页面 pages/games/statistics.vue

数据卡片 + uCharts趋势图表，展示总分、平均分、最佳成绩。

Step 6: 后端 API 榜单

GET /api/games/ranking/{gameCode} - 游戏排行榜 GET /api/games/ranking/family/{familyId} - 家庭排行榜

Step 7: 验证

后端编译通过，API 返回正确数据，前端图表渲染正常。

Task 5: 勋章系统（P1）

需求文档: badge-requirements.md BADGE-001~006 - 勋章定义、解锁、授予、展示、有效期、排行

Files:

Create: cfc-backend/src/main/java/com/etotem/cfc/entity/Badge.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/ChildBadge.java
Create: cfc-backend/src/main/java/com/etotem/cfc/repository/BadgeRepository.java
Create: cfc-backend/src/main/java/com/etotem/cfc/repository/ChildBadgeRepository.java
Create: cfc-backend/src/main/java/com/etotem/cfc/service/BadgeService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/controller/BadgeController.java
Create: cfc-frontend/pages/badges/badges.vue
Create: cfc-frontend/pages/badges/detail.vue
Create: cfc-frontend/pages/badges/library.vue
[ ] Step 1: 创建 Badge 实体

对应 badge 表，字段：id, badgeId(唯一标识), name, description, icon, category(学习/运动/家务/阅读/打卡/综合), level(铜牌/银牌/金牌/钻石), rarity(普通/稀有/史诗/传说), triggerType(task_count/streak_days/points_total/reward_count/custom), threshold, needApproval, expireDays, sortOrder, isActive, createdAt, updatedAt。

Step 2: 创建 ChildBadge 实体

对应 child_badge 表，字段：id, childId, badgeId, earnedAt, expireAt, status(1有效/0过期/-1撤销), isFavorite, createdAt, updatedAt。联合唯一索引 (child_id, badge_id)。

Step 3: 创建 BadgeService 实现

方法：

创建/更新/删除勋章定义
检查并授予勋章（按 triggerType 检查条件）
定时任务：勋章过期检查
获取孩子的勋章列表
收藏/取消收藏
[ ] Step 4: 实现勋章管理 API

BadgeController：

POST /api/badges - 创建勋章（管理员）
GET /api/badges - 列表（公开）
GET /api/badges/{id} - 详情（公开）
PUT /api/badges/{id} - 编辑（管理员）
DELETE /api/badges/{id} - 删除（管理员）
POST /api/badges/grant - 手动授予（家长/管理员）
POST /api/badges/check - 检查并授予（系统）
GET /api/badges/child/{childId} - 孩子勋章列表
PUT /api/badges/{id}/favorite - 收藏切换
GET /api/badges/statistics/child/{childId} - 统计
GET /api/badges/statistics/family/{familyId} - 家庭统计
GET /api/badges/ranking/family/{familyId} - 家庭排行
[ ] Step 5: 实现勋章墙前端页面 pages/badges/badges.vue

展示已获得勋章，按分类/时间排列。未获得显示锁定。

Step 6: 实现勋章详情页 pages/badges/detail.vue

展示勋章名称、描述、获得时间、稀有度、等级。

Step 7: 实现勋章库页面 pages/badges/library.vue

浏览所有勋章定义，区分已获得/未获得。

Step 8: 验证

后端测试 API 正确，前端勋章墙渲染正常，收藏功能可用。

Task 6: 报表统计模块（P1）

需求文档: report-requirements.md REPORT-001~004 - 个人任务统计、家庭统计、积分明细、成长趋势

Files:

Create: cfc-backend/src/main/java/com/etotem/cfc/controller/ReportController.java
Create: cfc-backend/src/main/java/com/etotem/cfc/service/ReportService.java
Create: cfc-frontend/pages/report/child.vue
Create: cfc-frontend/pages/report/family.vue
Create: cfc-frontend/pages/report/trend.vue
[ ] Step 1: 实现 ReportService 统计逻辑

方法：

getChildTaskStats(childId, startDate, endDate, category) - 个人任务统计：任务总数、完成数、超时数、驳回数、完成率、平均耗时
getChildPointsStats(childId, startDate, endDate) - 个人积分统计：余额、获得、扣除、净变化、各来源占比
getFamilyTaskStats(familyId, startDate, endDate) - 家庭任务统计
getFamilyRanking(familyId) - 家庭排行
getChildTrend(childId, granularity) - 成长趋势数据
[ ] Step 2: 实现报表 API

ReportController：

GET /api/reports/child/{childId}/tasks - 个人任务统计
GET /api/reports/child/{childId}/points - 个人积分统计
GET /api/reports/child/{childId}/trend - 个人成长趋势
GET /api/reports/family/{familyId}/tasks - 家庭任务统计
GET /api/reports/family/{familyId}/ranking - 家庭排行
[ ] Step 3: 实现个人统计前端页面 pages/report/child.vue

数字卡片 + 条件筛选 + 列表展示。

Step 4: 实现家庭统计页面 pages/report/family.vue

家庭概览卡片 + 孩子对比表格。

Step 5: 实现成长趋势页面 pages/report/trend.vue

uCharts 折线图 + 柱状图，支持日/周/月粒度切换。

Step 6: 验证

后端数据正确性验证，前端图表渲染正常。

Task 7: 成长规划师套餐模块（P1）

需求文档: guide-requirements.md 后端服务类型管理、服务内容管理（富文本）、套餐模板、规划师套餐。

Files:

Create: cfc-backend/src/main/java/com/etotem/cfc/entity/ServiceType.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/ServiceContent.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/GuidePackageTemplate.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/PackageTemplateService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/GuidePackage.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/GuidePackageService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/service/GuideService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/controller/GuideController.java
Create: cfc-backend/src/main/java/com/etotem/cfc/controller/AdminServiceController.java
Modify: cfc-frontend/pages/guide/packages/index.vue
Modify: cfc-frontend/pages/guide/packages/create.vue
[ ] Step 1: 创建服务类型/服务内容实体

ServiceType：id, name, icon, description, sortOrder, status(ACTIVE/DISABLED) ServiceContent：id, typeId, title, content(Html), duration, ageRange, price, status(DRAFT/ACTIVE)

Step 2: 创建套餐模板/规划师套餐实体

GuidePackageTemplate：id, name, validityMonths, referencePrice, minPrice, description, status PackageTemplateService：id, templateId, contentId, quantity, unit GuidePackage：id, teacherId, templateId, name, price, validityMonths, description, status(DRAFT/PUBLISHED/PAUSED), salesCount GuidePackageService：id, packageId, contentId, quantity, unit

Step 3: 实现服务管理 API

AdminServiceController：

GET/POST/PUT/DELETE /api/admin/service-types
GET/POST/PUT/DELETE /api/admin/service-contents
[ ] Step 4: 实现套餐管理 API

GuideController：

GET /api/guide/package-templates - 模板列表
GET /api/guide/package-templates/{id} - 模板详情（含服务项）
GET /api/guide/packages - 我的套餐
POST /api/guide/packages - 创建套餐
PUT /api/guide/packages/{id} - 更新套餐
PUT /api/guide/packages/{id}/status - 更新状态
DELETE /api/guide/packages/{id} - 删除套餐
[ ] Step 5: 更新套餐前端页面

pages/guide/packages/index.vue - 展示套餐列表，支持状态筛选 pages/guide/packages/create.vue - 选择模板、自定义名称价格、发布

Step 6: 验证

后端编译通过，套餐CRUD流程完整，前端列表/创建/详情页面正常。

Task 8: DAN测评模块（P1/P2）

需求文档: dan-requirements.md DAN-001~015 - 测评包管理、指标库、结果录入、查询、趋势、建议

Files:

Create: cfc-backend/src/main/java/com/etotem/cfc/entity/DanPackage.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/DanIndicator.java
Create: cfc-backend/src/main/java/com/etotem/cfc/entity/DanIndicatorTemplate.java
Create: cfc-backend/src/main/java/com/etotem/cfc/repository/DanPackageRepository.java
Create: cfc-backend/src/main/java/com/etotem/cfc/repository/DanIndicatorRepository.java
Create: cfc-backend/src/main/java/com/etotem/cfc/service/DanService.java
Create: cfc-backend/src/main/java/com/etotem/cfc/controller/DanController.java
Create: cfc-frontend/pages/dan/result.vue
Create: cfc-frontend/pages/dan/history.vue
[ ] Step 1: 创建测评包+指标库实体

DanPackage：id, packageCode(A1/A2/B1-B6), packageName, ageRangeMin, ageRangeMax, category, indicators(JSON), isActive DanIndicator：id, indicatorCode, indicatorName, dimension(COG/EMI/SOC/PHY), description, levelThresholds(JSON), sortOrder, isActive DanIndicatorTemplate：id, indicatorCode, templateId, weight, isActive

[ ] Step 2: 实现测评包/指标库 API
GET/POST/PUT/DELETE /api/dan/packages
GET/POST/PUT/DELETE /api/dan/indicators
GET/POST/PUT/DELETE /api/dan/indicator-templates
[ ] Step 3: 实现测评结果 API

利用已有的 DanAssessmentResult 实体：

POST /api/dan/assessments - 录入结果
GET /api/dan/assessments?childId= - 结果列表
GET /api/dan/assessments/{id} - 结果详情
GET /api/dan/assessments/{id}/trend - 历史趋势
[ ] Step 4: 实现指标等级计算+成长建议生成

DanService.calculateLevel(score, thresholds) - 等级计算 DanService.generateSuggestions(indicatorScores) - 按指标生成建议文本

Step 5: 实现任务自动推荐

DanService.recommendTasks(childId, assessmentId) - 根据低分指标查询关联任务模板

Step 6: 实现测评结果前端页面

pages/dan/result.vue - 展示测评结果、指标得分雷达图、等级、成长建议 pages/dan/history.vue - 历史测评列表、趋势对比

Step 7: 验证

完整的测评流程：录入→等级计算→展示→建议→推荐任务

Task 9: 任务批量操作 TASK-016（P2）

需求文档: task-requirements.md §TASK-016

Files:

Modify: cfc-backend/src/main/java/com/etotem/cfc/controller/TaskController.java
Modify: cfc-backend/src/main/java/com/etotem/cfc/service/TaskService.java
Modify: cfc-frontend/pages/tasks/tasks.vue
[ ] Step 1: 后端批量操作 API

TaskController 新增：

POST /api/tasks/batch-create - 批量创建任务
PUT /api/tasks/batch-status - 批量更新状态（完成/暂停/删除）
PUT /api/tasks/batch-assign - 批量分配孩子
[ ] Step 2: 前端批量操作 UI

任务列表页增加多选模式 → 底部操作栏（批量完成/批量删除/批量分配）

Step 3: 验证

批量选中的任务状态正确更新，不可恢复的删除操作有确认弹窗。

Task 10: 训练提醒与激励 FOCUS-007（P2）

需求文档: focus-requirements.md §2.7

Files:

Create: cfc-backend/src/main/java/com/etotem/cfc/scheduler/TrainingReminderScheduler.java
Modify: cfc-frontend/pages/games/index.vue
[ ] Step 1: 每日训练提醒定时任务

TrainingReminderScheduler - 每日定时检查昨日未训练的孩子，发送订阅消息。

Step 2: 连续训练激励逻辑

查询 game_record 表统计连续天数，达到里程碑（7天/14天/30天）发放额外积分。

Step 3: 前端展示激励信息

游戏列表页顶部展示连续训练天数、下次激励目标。

四、预计工作量

任务	预估工时	依赖
Task 1: Tab图标	0.5h	无
Task 2: 身体Tab	2h	无
Task 3: 心智Tab	2h	无
Task 4: 训练记录分析	6h	无
Task 5: 勋章系统	10h	无
Task 6: 报表统计	8h	任务/积分数据
Task 7: 规划师套餐	12h	无
Task 8: DAN测评	16h	任务模板
Task 9: 批量操作	3h	任务模块
Task 10: 训练提醒	3h	训练记录

总计预估：约 62.5h

五、风险与注意事项

Tab图标 - 如果无设计资源，先用纯色占位图标，收集后可替换
富文本编辑器 - 服务内容管理（guide-requirements.md 2.1.2）依赖 uParse 或 uni-app 富文本组件，小程序环境对 HTML 支持有限
勋章触发引擎 - BADGE-003 的定时任务与事件触发双模式，需要考虑事务一致性和性能
图表组件 - 小程序端 uCharts 兼容性需要验证，备选方案：f2 或 echarts 微信版
DAN测评 - 涉及较多实体关联，建议先完成数据模型定义再开发API
Shop（行动Tab） - 已有 pages/shop/index.vue，当前未登录用户可浏览（products API 公开），无需额外修改

六、验证标准

每个Task完成后需满足：

lsp_diagnostics 清洁（无 error）
后端 mvn clean compile 成功
核心业务流程端到端可用
已有功能未受影响（回归）

2026-06-06-module-development-plan.md 21 KB Historik Rå

全模块开发实施计划

一、现状总览

已完成（本轮会话）

需求文档状态

二、优先级分组

P0 - 阻塞项（必须先完成）

P1 - 核心功能

P2 - 高级功能

P3 - 扩展功能

三、实施任务分解

Task 1: Tab图标资源文件（P0）

Task 2: 身体Tab内容页（P0）

Task 3: 心智Tab内容页（P0）

Task 4: 专注训练 - 训练记录与数据分析（P1）

Task 5: 勋章系统（P1）

Task 6: 报表统计模块（P1）

Task 7: 成长规划师套餐模块（P1）

Task 8: DAN测评模块（P1/P2）

Task 9: 任务批量操作 TASK-016（P2）

Task 10: 训练提醒与激励 FOCUS-007（P2）

四、预计工作量

五、风险与注意事项

六、验证标准

2026-06-06-module-development-plan.md 21 KB

Historik Rå