20 KiB
Implementation Plan: 福利与任务管理模块前端迁移
Overview
本实现计划将福利与任务管理模块从老项目(PHP ThinkPHP + Layui)迁移到新项目(ASP.NET Core + Vue 3 + Element Plus)。实现分为数据库表创建、后端API开发和前端页面开发三个主要部分。
任务概览
| 阶段 | 任务数 | 预计工时 |
|---|---|---|
| 1. 数据库表创建 | 2 | 0.5h |
| 2. 后端奖励管理API | 5 | 2h |
| 3. 后端签到配置API | 5 | 2h |
| 4. 后端任务管理API | 4 | 1.5h |
| 5. 后端权益等级API | 5 | 2h |
| 6. Checkpoint - 后端API验证 | 1 | 0.5h |
| 7. 前端API层开发 | 4 | 2h |
| 8. 前端奖励管理页面 | 4 | 3h |
| 9. 前端签到配置页面 | 5 | 4h |
| 10. Checkpoint - 奖励签到页面验证 | 1 | 0.5h |
| 11. 前端任务管理页面 | 4 | 3h |
| 12. 前端权益等级页面 | 5 | 4h |
| 13. 路由和菜单配置 | 2 | 1h |
| 14. Checkpoint - 完整功能验证 | 1 | 0.5h |
| 15. 属性测试 | 5 | 2h |
| 16. Final Checkpoint | 1 | 0.5h |
| 总计 | 54 | 29h |
Tasks
-
1. 数据库表创建
-
1.1 创建权益等级表
- 创建
equity_levels表,包含 id, level, title, required_points, created_at, updated_at, deleted_at 字段 - 创建
equity_level_prizes表,包含奖品相关字段 - 添加外键约束
- Requirements: 11.1, 11.2, 11.3
- 创建
-
1.2 创建Entity Framework实体类
- 在
HoneyBox.Model/Entities/创建EquityLevel.cs - 在
HoneyBox.Model/Entities/创建EquityLevelPrize.cs - 在
HoneyBoxDbContext.cs添加 DbSet - Requirements: 11.1, 11.2
- 在
-
-
2. 后端奖励管理API开发
-
2.1 创建奖励Models
- 在
HoneyBox.Admin.Business/Models/Reward/创建目录 - 创建
RewardModels.cs定义请求和响应模型 - 定义
RewardListRequest列表查询请求 - 定义
RewardResponse奖励响应模型 - 定义
RewardCreateRequest新增请求 - 定义
RewardBatchRequest批量更新请求 - Requirements: 10.1
- 在
-
2.2 创建奖励Service接口和实现
- 在
HoneyBox.Admin.Business/Services/Interfaces/创建IRewardService.cs - 在
HoneyBox.Admin.Business/Services/创建RewardService.cs - 实现列表查询、新增、编辑、删除、状态更新方法
- 实现根据reward_id获取奖励列表方法
- 实现批量更新奖励方法
- Requirements: 10.1, 10.5, 10.6
- 在
-
2.3 创建奖励Controller
- 在
HoneyBox.Admin.Business/Controllers/创建RewardController.cs - 实现
GET /api/business/reward列表查询接口 - 实现
GET /api/business/reward/{id}详情查询接口 - 实现
POST /api/business/reward新增接口 - 实现
PUT /api/business/reward/{id}编辑接口 - 实现
DELETE /api/business/reward/{id}删除接口 - 实现
PUT /api/business/reward/{id}/status状态更新接口 - 实现
GET /api/business/reward/by-reward-id根据reward_id查询接口 - 实现
POST /api/business/reward/batch批量更新接口 - Requirements: 10.1, 10.5, 10.6
- 在
-
2.4 注册奖励服务
- 在
ServiceCollectionExtensions.cs注册IRewardService和RewardService - Requirements: 10.1
- 在
-
2.5 编写奖励API单元测试
- 测试列表查询逻辑
- 测试类型筛选逻辑
- 测试CRUD操作
- Requirements: 10.1
-
-
3. 后端签到配置API开发
-
3.1 创建签到配置Models
- 在
HoneyBox.Admin.Business/Models/SignConfig/创建目录 - 创建
SignConfigModels.cs定义请求和响应模型 - 定义
SignConfigListRequest列表查询请求(含type参数) - 定义
SignConfigResponse签到配置响应模型(含关联奖励) - 定义
SignConfigCreateRequest新增请求 - 定义
SignConfigUpdateRequest编辑请求 - Requirements: 10.2
- 在
-
3.2 创建签到配置Service接口和实现
- 在
HoneyBox.Admin.Business/Services/Interfaces/创建ISignConfigService.cs - 在
HoneyBox.Admin.Business/Services/创建SignConfigService.cs - 实现列表查询方法,支持按类型筛选
- 实现新增方法,同时创建关联奖励
- 实现编辑方法
- 实现删除方法
- 实现状态更新方法
- 实现排序更新方法
- 实现奖励配置更新方法
- Requirements: 10.2, 10.6
- 在
-
3.3 创建签到配置Controller
- 在
HoneyBox.Admin.Business/Controllers/创建SignConfigController.cs - 实现
GET /api/business/signconfig列表查询接口 - 实现
GET /api/business/signconfig/{id}详情查询接口 - 实现
POST /api/business/signconfig新增接口 - 实现
PUT /api/business/signconfig/{id}编辑接口 - 实现
DELETE /api/business/signconfig/{id}删除接口 - 实现
PUT /api/business/signconfig/{id}/status状态更新接口 - 实现
PUT /api/business/signconfig/{id}/sort排序更新接口 - 实现
PUT /api/business/signconfig/{id}/reward奖励配置更新接口 - Requirements: 10.2
- 在
-
3.4 注册签到配置服务
- 在
ServiceCollectionExtensions.cs注册ISignConfigService和SignConfigService - Requirements: 10.2
- 在
-
3.5 编写签到配置API单元测试
- 测试列表查询逻辑
- 测试类型切换逻辑
- 测试奖励关联逻辑
- Requirements: 10.2
-
-
4. 后端任务管理API开发
-
4.1 创建任务Models
- 在
HoneyBox.Admin.Business/Models/Task/创建目录 - 创建
TaskModels.cs定义请求和响应模型 - 定义
TaskListRequest列表查询请求(含keyword和type参数) - 定义
TaskResponse任务响应模型 - 定义
TaskCreateRequest新增请求 - 定义
TaskUpdateRequest编辑请求 - Requirements: 10.3
- 在
-
4.2 创建任务Service接口和实现
- 在
HoneyBox.Admin.Business/Services/Interfaces/创建ITaskService.cs - 在
HoneyBox.Admin.Business/Services/创建TaskService.cs - 实现列表查询方法,支持关键词和类型筛选
- 实现新增方法,验证必填字段和数值范围
- 实现编辑方法
- 实现软删除方法
- Requirements: 10.3, 10.8
- 在
-
4.3 创建任务Controller
- 在
HoneyBox.Admin.Business/Controllers/创建TaskController.cs - 实现
GET /api/business/task列表查询接口 - 实现
GET /api/business/task/{id}详情查询接口 - 实现
POST /api/business/task新增接口 - 实现
PUT /api/business/task/{id}编辑接口 - 实现
DELETE /api/business/task/{id}删除接口(软删除) - Requirements: 10.3
- 在
-
4.4 注册任务服务
- 在
ServiceCollectionExtensions.cs注册ITaskService和TaskService - Requirements: 10.3
- 在
-
-
5. 后端权益等级API开发
-
5.1 创建权益等级Models
- 在
HoneyBox.Admin.Business/Models/QyLevel/创建目录 - 创建
QyLevelModels.cs定义请求和响应模型 - 定义
QyLevelListRequest列表查询请求 - 定义
QyLevelResponse权益等级响应模型 - 定义
QyLevelUpdateRequest编辑请求 - 定义
QyLevelPrizeListRequest奖品列表查询请求 - 定义
QyLevelPrizeResponse奖品响应模型 - 定义
QyLevelPrizeCreateRequest奖品新增请求 - Requirements: 10.4
- 在
-
5.2 创建权益等级Service接口和实现
- 在
HoneyBox.Admin.Business/Services/Interfaces/创建IQyLevelService.cs - 在
HoneyBox.Admin.Business/Services/创建QyLevelService.cs - 实现等级列表查询方法
- 实现等级编辑方法
- 实现奖品列表查询方法,支持类型筛选
- 实现奖品新增方法,区分优惠券和实物奖品
- 实现奖品编辑方法
- 实现奖品软删除方法
- Requirements: 10.4, 10.8
- 在
-
5.3 创建权益等级Controller
- 在
HoneyBox.Admin.Business/Controllers/创建QyLevelController.cs - 实现
GET /api/business/qylevel等级列表查询接口 - 实现
GET /api/business/qylevel/{id}等级详情查询接口 - 实现
PUT /api/business/qylevel/{id}等级编辑接口 - 实现
GET /api/business/qylevel/{id}/prizes奖品列表查询接口 - 实现
POST /api/business/qylevel/{id}/prizes奖品新增接口 - 实现
PUT /api/business/qylevel/prizes/{prizeId}奖品编辑接口 - 实现
DELETE /api/business/qylevel/prizes/{prizeId}奖品删除接口 - Requirements: 10.4
- 在
-
5.4 注册权益等级服务
- 在
ServiceCollectionExtensions.cs注册IQyLevelService和QyLevelService - Requirements: 10.4
- 在
-
5.5 编写权益等级API单元测试
- 测试等级列表查询
- 测试奖品类型筛选
- 测试概率值验证
- Requirements: 10.4
-
-
6. Checkpoint - 后端API验证
- 确保所有API编译通过
- 使用Swagger测试API基本功能
- 确保权限验证正常工作
- 验证数据库表创建成功
-
7. 前端API层开发
-
7.1 创建奖励管理API模块
- 创建
src/api/business/reward.ts - 定义所有TypeScript接口(RewardListRequest, RewardResponse等)
- 实现奖励列表查询API调用
getRewards - 实现奖励详情查询API调用
getRewardById - 实现奖励新增API调用
createReward - 实现奖励编辑API调用
updateReward - 实现奖励删除API调用
deleteReward - 实现奖励状态更新API调用
updateRewardStatus - 实现根据reward_id查询API调用
getRewardsByRewardId - 实现批量更新奖励API调用
batchUpdateRewards - Requirements: 10.1
- 创建
-
7.2 创建签到配置API模块
- 创建
src/api/business/signconfig.ts - 定义所有TypeScript接口
- 实现签到配置列表查询API调用
getSignConfigs - 实现签到配置详情查询API调用
getSignConfigById - 实现签到配置新增API调用
createSignConfig - 实现签到配置编辑API调用
updateSignConfig - 实现签到配置删除API调用
deleteSignConfig - 实现状态更新API调用
updateSignConfigStatus - 实现排序更新API调用
updateSignConfigSort - 实现奖励配置更新API调用
updateSignConfigReward - Requirements: 10.2
- 创建
-
7.3 创建任务管理API模块
- 创建
src/api/business/task.ts - 定义所有TypeScript接口
- 实现任务列表查询API调用
getTasks - 实现任务详情查询API调用
getTaskById - 实现任务新增API调用
createTask - 实现任务编辑API调用
updateTask - 实现任务删除API调用
deleteTask - Requirements: 10.3
- 创建
-
7.4 创建权益等级API模块
- 创建
src/api/business/qylevel.ts - 定义所有TypeScript接口
- 实现等级列表查询API调用
getQyLevels - 实现等级详情查询API调用
getQyLevelById - 实现等级编辑API调用
updateQyLevel - 实现奖品列表查询API调用
getQyLevelPrizes - 实现奖品新增API调用
createQyLevelPrize - 实现奖品编辑API调用
updateQyLevelPrize - 实现奖品删除API调用
deleteQyLevelPrize - Requirements: 10.4
- 创建
-
-
8. 前端奖励管理页面开发
-
8.1 创建奖励列表主页面
- 创建
src/views/business/reward/list.vue - 实现页面布局(搜索区 + 表格区)
- 集成搜索表单和表格组件
- 实现分页逻辑
- 实现新增、编辑、删除、状态切换操作
- Requirements: 1.1, 1.4, 1.5, 1.6, 1.7
- 创建
-
8.2 创建奖励搜索表单组件
- 创建
src/views/business/reward/components/RewardSearchForm.vue - 实现奖励类型下拉选择(优惠券/钻石/货币1/货币2)
- 实现关键词输入框
- 实现搜索和重置按钮
- Requirements: 1.2, 1.3
- 创建
-
8.3 创建奖励表格组件
- 创建
src/views/business/reward/components/RewardTable.vue - 实现表格列配置(ID、标题、类型、值、关联ID、创建时间、状态)
- 实现状态开关切换
- 实现操作按钮(编辑、删除)
- 实现删除确认弹窗
- Requirements: 1.1, 1.4, 1.7
- 创建
-
8.4 创建奖励表单弹窗
- 创建
src/views/business/reward/components/RewardFormDialog.vue - 实现奖励类型选择
- 实现条件显示字段(优惠券选择/数值输入)
- 实现表单验证
- 实现提交逻辑
- Requirements: 2.1, 2.2, 2.3, 2.4, 2.5
- 创建
-
-
9. 前端签到配置页面开发
-
9.1 创建签到配置主页面
- 创建
src/views/business/signconfig/list.vue - 实现页面布局(Tab切换 + 表格区)
- 实现每日签到/累计签到Tab切换
- 实现分页逻辑
- 实现新增、编辑、删除、状态切换操作
- Requirements: 3.1, 3.2, 3.4, 3.6, 3.7, 3.9
- 创建
-
9.2 创建签到配置表格组件
- 创建
src/views/business/signconfig/components/SignConfigTable.vue - 实现表格列配置(ID、标题、图标、天数、奖励信息、排序、状态)
- 实现图标预览
- 实现排序值内联编辑
- 实现状态开关切换
- 实现操作按钮(编辑、编辑奖励、删除)
- Requirements: 3.3, 3.4, 3.5, 3.8
- 创建
-
9.3 创建签到配置表单弹窗
- 创建
src/views/business/signconfig/components/SignConfigFormDialog.vue - 实现标题、天数、图标上传、描述输入
- 实现奖励配置组件集成
- 实现表单验证
- 实现提交逻辑
- Requirements: 4.1, 4.2, 4.4, 4.5
- 创建
-
9.4 创建奖励配置弹窗
- 创建
src/views/business/signconfig/components/RewardConfigDialog.vue - 实现多奖励类型配置(钻石、UU币、达达券、优惠券)
- 实现动态添加/删除奖励项
- 实现优惠券选择联动
- 实现提交逻辑
- Requirements: 4.3, 3.8
- 创建
-
9.5 编写签到配置组件单元测试
- 测试Tab切换逻辑
- 测试奖励配置组件
- Requirements: 3.2, 4.3
-
-
10. Checkpoint - 奖励签到页面验证
- 确保奖励列表页面正常显示
- 确保奖励新增、编辑、删除、状态切换功能正常
- 确保签到配置页面正常显示
- 确保签到配置Tab切换正常
- 确保签到配置新增、编辑、删除功能正常
- 确保奖励配置弹窗功能正常
- 测试搜索和分页功能
-
11. 前端任务管理页面开发
-
11.1 创建任务列表主页面
- 创建
src/views/business/task/list.vue - 实现页面布局(搜索区 + 表格区)
- 集成搜索表单和表格组件
- 实现分页逻辑
- 实现新增、编辑、删除操作
- Requirements: 5.1, 5.4, 5.5, 5.6
- 创建
-
11.2 创建任务搜索表单组件
- 创建
src/views/business/task/components/TaskSearchForm.vue - 实现任务标题关键词输入框
- 实现任务分类下拉选择(每日任务/每周任务)
- 实现搜索和重置按钮
- Requirements: 5.2, 5.3
- 创建
-
11.3 创建任务表格组件
- 创建
src/views/business/task/components/TaskTable.vue - 实现表格列配置(ID、分类、名称、任务次数、欧气值、排序、时间)
- 实现操作按钮(编辑、删除)
- 实现删除确认弹窗
- Requirements: 5.1, 5.6
- 创建
-
11.4 创建任务表单弹窗
- 创建
src/views/business/task/components/TaskFormDialog.vue - 实现任务标题、分类、任务次数、欧气值、排序输入
- 实现表单验证(必填、正数验证)
- 实现提交逻辑
- Requirements: 6.1, 6.2, 6.3, 6.4
- 创建
-
-
12. 前端权益等级页面开发
-
12.1 创建权益等级主页面
- 创建
src/views/business/qylevel/list.vue - 实现页面布局(搜索区 + 表格区)
- 实现分页逻辑
- 实现编辑、查看奖品操作
- Requirements: 7.1, 7.3, 7.4
- 创建
-
12.2 创建权益等级表格组件
- 创建
src/views/business/qylevel/components/QyLevelTable.vue - 实现表格列配置(ID、等级、名称、所需欧气值、时间)
- 实现操作按钮(编辑、奖品)
- Requirements: 7.1, 7.2
- 创建
-
12.3 创建权益等级表单弹窗
- 创建
src/views/business/qylevel/components/QyLevelFormDialog.vue - 实现等级、名称、所需欧气值输入
- 实现表单验证(正数验证)
- 实现提交逻辑
- Requirements: 8.1, 8.2, 8.3, 8.4
- 创建
-
12.4 创建权益等级奖品管理弹窗
- 创建
src/views/business/qylevel/components/QyLevelPrizeDialog.vue - 实现奖品列表展示
- 实现奖品类型筛选(优惠券/实物)
- 实现新增、编辑、删除奖品操作
- Requirements: 9.1, 9.2, 9.6
- 创建
-
12.5 创建权益等级奖品表单弹窗
- 创建
src/views/business/qylevel/components/QyLevelPrizeFormDialog.vue - 实现奖品类型选择
- 实现优惠券类型字段(优惠券选择、数量)
- 实现实物类型字段(名称、价值、兑换价、参考价、概率、图片)
- 实现概率值验证(0-100,最多2位小数)
- 实现表单验证和提交逻辑
- Requirements: 9.3, 9.4, 9.5
- 创建
-
-
13. 路由和菜单配置
-
13.1 配置路由
- 在
src/router/modules/business.ts添加福利与任务路由配置 - 配置奖励管理路由
/business/reward/list - 配置签到配置路由
/business/signconfig/list - 配置任务管理路由
/business/task/list - 配置权益等级路由
/business/qylevel/list - 配置权限标识
- Requirements: 12.2, 12.3
- 在
-
13.2 创建菜单SQL脚本并执行
- 在
HoneyBox/scripts/创建seed_welfare_task_menus.sql - 添加"福利与任务"父菜单
- 添加奖励管理、签到配置、任务管理、权益等级子菜单
- 添加相关权限配置
- 执行SQL脚本
- Requirements: 12.1
- 在
-
-
14. Checkpoint - 完整功能验证
- 确保所有页面正常访问
- 测试完整的奖励管理流程
- 测试完整的签到配置流程
- 测试完整的任务管理流程
- 测试完整的权益等级管理流程
- 验证权限控制正常工作
-
15. 属性测试
-
15.1 编写搜索参数传递属性测试
- Property 1: 奖励类型筛选正确性
- Property 2: 关键词搜索正确性
- Validates: Requirements 1.2, 1.3, 5.2
-
15.2 编写分页参数传递属性测试
- Property 10: 分页参数正确传递
- Validates: Requirements 1.1, 3.3, 5.1, 7.1
-
15.3 编写表单验证属性测试
- Property 5: 正数值验证
- Validates: Requirements 2.5, 6.2, 6.3, 8.2, 8.3
-
15.4 编写状态切换属性测试
- Property 3: 状态切换一致性
- Validates: Requirements 1.4, 3.4
-
15.5 编写类型筛选属性测试
- Property 6: 签到类型切换数据隔离
- Property 7: 任务分类筛选正确性
- Validates: Requirements 3.2, 5.3
-
-
16. Final Checkpoint - 最终验证
- 确保所有测试通过
- 确保所有功能正常工作
- 如有问题,询问用户
验收检查清单
功能验收
- 奖励列表正常显示,支持类型筛选、关键词搜索、分页
- 奖励新增功能正常,条件字段显示正确
- 奖励编辑功能正常
- 奖励删除功能正常(有二次确认)
- 奖励状态切换功能正常
- 签到配置列表正常显示,Tab切换正常
- 签到配置新增功能正常,奖励配置正常
- 签到配置编辑功能正常
- 签到配置删除功能正常(有二次确认)
- 签到配置状态切换和排序更新正常
- 任务列表正常显示,支持关键词搜索、分类筛选、分页
- 任务新增功能正常,表单验证正常
- 任务编辑功能正常
- 任务删除功能正常(有二次确认)
- 权益等级列表正常显示
- 权益等级编辑功能正常
- 权益等级奖品管理功能正常
- 权益等级奖品新增功能正常(优惠券/实物类型)
- 权益等级奖品编辑功能正常
- 权益等级奖品删除功能正常(有二次确认)
非功能验收
- 分页加载性能正常
- 图片懒加载生效
- 表单验证实时反馈
- 操作提示正确显示
- 危险操作有二次确认
- 属性测试全部通过
Notes
- 每个Checkpoint确保增量验证
- 后端API需要先完成才能进行前端开发
- 属性测试验证通用正确性属性
- 所有任务均为必需任务,确保全面测试覆盖
- 签到配置与奖励表有关联关系,需要注意数据一致性
- 权益等级奖品分为优惠券和实物两种类型,表单字段不同