意见反馈功能说明.md 4.9 KB

意见反馈功能说明

功能概述

意见反馈功能允许用户提交反馈信息,包括反馈类型、详细描述和图片。管理员可以在后台管理系统中查看和回复反馈。

数据库设计

反馈表 (feedback)

创建数据库表:

# 执行数据库脚本
mysql -u root -p books_db < book/src/main/resources/db/feedback_schema.sql

表结构说明:

  • id: 反馈ID(主键)
  • user_id: 用户ID(外键,关联users表)
  • type: 反馈类型(bug-产品bug,suggestion-功能建议,other-其他)
  • description: 详细描述(TEXT类型)
  • images: 图片URL列表(多个用逗号分隔)
  • status: 处理状态(0-待处理,1-处理中,2-已处理,3-已关闭)
  • reply: 管理员回复
  • replied_at: 回复时间
  • replied_by: 回复人ID(管理员ID)
  • created_at: 创建时间
  • updated_at: 更新时间

后端实现

1. 实体类

  • Feedback.java - 反馈实体类

2. DTO

  • FeedbackDTO.java - 反馈数据传输对象

3. Mapper

  • FeedbackMapper.java - Mapper接口
  • FeedbackMapper.xml - MyBatis映射文件

4. Service

  • FeedbackService.java - 反馈服务类

5. Controller

  • FeedbackController.java - 反馈控制器

API接口

1. 提交反馈

接口地址POST /api/feedback/submit

请求参数

{
  "userId": 1,
  "type": "bug",
  "description": "反馈内容描述",
  "images": ["图片URL1", "图片URL2"]
}

响应示例

{
  "code": 200,
  "message": "提交成功",
  "data": {
    "id": 1,
    "userId": 1,
    "type": "bug",
    "description": "反馈内容描述",
    "images": "图片URL1,图片URL2",
    "status": 0,
    "createdAt": "2025-01-11 10:00:00"
  }
}

2. 查询用户反馈列表

接口地址GET /api/feedback/list?userId=1&page=1&size=10

响应示例

{
  "code": 200,
  "data": {
    "list": [...],
    "total": 10,
    "page": 1,
    "size": 10
  }
}

3. 查询反馈详情

接口地址GET /api/feedback/{id}

响应示例

{
  "code": 200,
  "data": {
    "id": 1,
    "userId": 1,
    "type": "bug",
    "description": "反馈内容描述",
    "images": "图片URL1,图片URL2",
    "status": 0,
    "reply": null,
    "createdAt": "2025-01-11 10:00:00"
  }
}

前端实现

1. API函数

books/utils/api.js 中添加了以下函数:

  • submitFeedback(feedbackData) - 提交反馈
  • getFeedbackList(userId, page, size) - 获取反馈列表
  • getFeedbackById(id) - 获取反馈详情

2. 页面

books/pages/feedback/feedback.vue - 意见反馈页面

功能特性

  • 选择反馈类型(产品bug、功能建议、其他)
  • 输入详细描述
  • 上传图片(最多3张)
  • 提交反馈到后端

使用说明

用户端

  1. 打开意见反馈页面
  2. 选择反馈类型
  3. 输入详细描述
  4. (可选)上传图片
  5. 点击"提交"按钮

注意事项

  1. 图片上传

    • 当前版本使用临时文件路径
    • 生产环境建议先上传图片到服务器获取URL,再提交反馈
    • 可以集成图床服务(如七牛云、阿里云OSS等)
  2. 用户登录

    • 提交反馈前需要用户登录
    • 未登录用户会自动跳转到登录页面
  3. 数据验证

    • 反馈类型必须是:bug、suggestion、other
    • 详细描述不能为空
    • 用户ID必须有效

后续扩展

后台管理功能(可选)

可以创建后台管理页面用于:

  • 查看反馈列表
  • 筛选反馈(按类型、状态)
  • 回复反馈
  • 更新反馈状态

图片上传功能(建议实现)

  1. 创建图片上传接口
  2. 将图片上传到服务器或OSS
  3. 返回图片URL
  4. 前端提交反馈时使用图片URL

示例代码结构:

@PostMapping("/upload")
public Result<String> uploadImage(@RequestParam("file") MultipartFile file) {
    // 上传图片逻辑
    // 返回图片URL
}

测试步骤

  1. 启动后端服务

    cd book
    mvn spring-boot:run
    
  2. 创建数据库表

    mysql -u root -p books_db < book/src/main/resources/db/feedback_schema.sql
    
  3. 测试提交反馈

    • 打开小程序或H5页面
    • 进入意见反馈页面
    • 填写反馈信息并提交
    • 检查数据库中是否保存成功
  4. 测试查询反馈

    • 调用查询接口
    • 验证返回数据正确性

常见问题

Q: 图片上传失败怎么办?

A: 当前版本图片使用临时路径,生产环境需要先上传图片到服务器。可以:

  1. 创建图片上传接口
  2. 使用图床服务
  3. 使用云存储服务(OSS、COS等)

Q: 如何查看用户的反馈?

A: 可以调用 GET /api/feedback/list 接口,传入用户ID即可。

Q: 反馈状态如何更新?

A: 可以通过 FeedbackService.updateFeedbackReply() 方法更新反馈状态和回复。