- 从服务器拉取完整代码 - 按框架规范整理项目结构 - 配置 Drone CI 测试环境部署 - 包含后端(FastAPI)、前端(Vue3)、管理端 技术栈: Vue3 + TypeScript + FastAPI + MySQL
4.5 KiB
4.5 KiB
陪练记录问题排查指南
问题现象
- 显示"共找到 3 条陪练记录"
- 怀疑数据仍然是硬编码
已完成的修复
- ✅ 移除了所有硬编码假数据
- ✅ 移除了前端重复筛选逻辑(
filteredRecordsList) - ✅ 修复了数据显示数量(改用
total而不是filteredRecordsList.length) - ✅ 为所有用户注入了完整的测试数据
数据库实际数据
最近30天内各用户的陪练记录数
用户ID 用户名 角色 记录数
1 superadmin admin 9条
2 admin admin 11条
5 consultant_001 trainee 8条
6 nurse_001 trainee 20条
7 therapist_001 trainee 15条
8 receptionist_001 trainee 8条
所有时间范围内各用户的陪练记录数
用户ID 用户名 角色 记录数
1 superadmin admin 20条
2 admin admin 18条
5 consultant_001 trainee 25条
6 nurse_001 trainee 20条
7 therapist_001 trainee 22条
8 receptionist_001 trainee 18条
排查步骤
步骤1:确认当前登录用户
在浏览器控制台执行:
const token = localStorage.getItem('access_token')
console.log('Token:', token)
// 解析token查看用户信息(如果是JWT)
if (token) {
const payload = JSON.parse(atob(token.split('.')[1]))
console.log('用户信息:', payload)
}
步骤2:清除浏览器缓存
-
Chrome/Edge:
- 按
Cmd + Shift + R(Mac) 或Ctrl + Shift + R(Windows) 硬刷新 - 或者右键点击刷新按钮 → "清空缓存并硬性重新加载"
- 按
-
清除所有缓存:
- 打开开发者工具 (F12)
- 右键点击刷新按钮
- 选择"清空缓存并硬性重新加载"
步骤3:检查网络请求
- 打开浏览器开发者工具 (F12)
- 切换到 "Network" (网络) 标签
- 刷新页面
- 找到
sessions/list请求 - 查看:
- 请求参数 (Query String Parameters)
- 响应数据 (Response)
应该看到的响应格式:
{
"code": 200,
"message": "success",
"data": {
"items": [...],
"total": 实际记录数,
"page": 1,
"page_size": 20,
"pages": 总页数
}
}
步骤4:检查日期筛选
前端默认筛选最近30天的数据:
const dateRange = ref<[Date, Date] | null>([
new Date(new Date().setDate(new Date().getDate() - 30)),
new Date()
])
如果想显示所有数据,可以:
- 点击页面上的"清空全部"按钮
- 或者手动清除日期范围选择器
步骤5:检查控制台错误
查看浏览器控制台是否有:
- 红色错误信息
- API请求失败
- 数据格式错误
可能的原因分析
如果确实只有3条
- 登录了manager用户 - manager_beijing 和 manager_shanghai 没有陪练记录
- 应用了严格的筛选条件 - 场景类型、关键词、日期等
- 当前登录用户确实只完成了3次陪练
如果看到的数据重复或异常
- 浏览器缓存了旧的JS文件
- 需要强制刷新
验证数据真实性的方法
方法1:直接查询数据库
-- 查看当前用户的陪练记录(假设user_id=6)
SELECT
ps.session_id,
ps.scene_name,
ps.start_time,
pr.total_score
FROM practice_sessions ps
LEFT JOIN practice_reports pr ON ps.session_id = pr.session_id
WHERE ps.user_id = 6
AND ps.is_deleted = 0
AND ps.status = 'completed'
ORDER BY ps.start_time DESC;
方法2:查看后端日志
# 查看后端容器日志
docker logs kaopeilian-backend-dev -f --tail=100
# 筛选陪练相关日志
docker logs kaopeilian-backend-dev 2>&1 | grep "practice"
方法3:使用curl测试API
# 先登录获取token
TOKEN=$(curl -s -X POST http://localhost:8000/api/v1/auth/login \
-H "Content-Type: application/json" \
-d '{"username":"nurse_001","password":"password123"}' | \
jq -r '.data.access_token')
# 测试陪练记录API
curl -X GET "http://localhost:8000/api/v1/practice/sessions/list?page=1&size=20" \
-H "Authorization: Bearer $TOKEN" | jq
联系信息
如果以上步骤都无法解决问题,请提供:
- 当前登录的用户名
- 浏览器控制台的Network请求截图
- 控制台的错误信息(如果有)
- 后端日志相关内容
重要提醒:前端代码已经完全修复,不再有硬编码数据。如果仍然看到异常,99%是浏览器缓存问题,请务必先清除缓存!