HaniBlindBox/.kiro/specs/welfare-task-frontend/tasks.md
2026-01-18 12:42:28 +08:00

20 KiB
Raw Blame History

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 注册 IRewardServiceRewardService
      • 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 注册 ISignConfigServiceSignConfigService
      • 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 注册 ITaskServiceTaskService
      • 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 注册 IQyLevelServiceQyLevelService
      • 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需要先完成才能进行前端开发
  • 属性测试验证通用正确性属性
  • 所有任务均为必需任务,确保全面测试覆盖
  • 签到配置与奖励表有关联关系,需要注意数据一致性
  • 权益等级奖品分为优惠券和实物两种类型,表单字段不同