# 工单页面数据不显示问题排查

## 问题描述
工单页面刷新不出数据，但数据库中确实有工单记录。

## 可能的原因

### 原因 1：字段名称不匹配（已修复）
- **旧字段**: `test_order_id`
- **新字段**: `batch_id`
- **状态**: ✅ 已在之前的修复中完成

### 原因 2：浏览器缓存
前端代码已更新，但浏览器仍在使用旧的缓存代码。

### 原因 3：后端服务未重启
DO 模型修改后（`name` 字段从 `String(20)` 改为 `String(200)`），后端服务需要重启。

### 原因 4：数据问题
数据库中的工单数据可能有问题（如 `order_id` 不为 NULL）。

## 诊断步骤

### 步骤 1：验证数据库数据
```bash
mysql -u root -p your_database < verify_workorder_data.sql
```

**检查项**:
- ✅ 是否有工单数据
- ✅ `batch_id` 和 `batch_name` 是否有值
- ✅ `order_id` 是否为 NULL（未汇总的工单）
- ✅ `name` 字段是否完整（没有被截断）

**预期结果**:
```
工单ID | 批次ID        | 批次名称           | 工单名称                    | 订单ID
-------|---------------|--------------------|-----------------------------|-------
745    | 1767886070328 | 批次-20260108232750 | SN0005-入库测试（PCBA）_DSM | NULL
```

### 步骤 2：检查浏览器开发者工具

#### 2.1 打开开发者工具
按 `F12` 或右键 → 检查

#### 2.2 查看 Network 标签
1. 刷新工单列表页面
2. 找到 `/system/test_work_order/list` 请求
3. 查看 **Request** 和 **Response**

**检查 Request（请求参数）**:
```json
{
  "pageNum": 1,
  "pageSize": 10,
  "batchId": null,  // 应该是 null，表示查询所有
  "testStep": null
}
```

**检查 Response（返回数据）**:
```json
{
  "code": 200,
  "msg": "success",
  "data": {
    "rows": [
      {
        "id": 745,
        "batchId": 1767886070328,
        "batchName": "批次-20260108232750",
        "name": "SN0005-入库测试（PCBA）_DSM",
        "testEutName": "SN0005",
        ...
      }
    ],
    "total": 1
  }
}
```

#### 2.3 查看 Console 标签
检查是否有 JavaScript 错误。

### 步骤 3：清除浏览器缓存
- **Windows**: `Ctrl + Shift + R`
- **Mac**: `Cmd + Shift + R`
- **或**: 开发者工具 → Network → 勾选 "Disable cache" → 刷新

### 步骤 4：重启后端服务
```bash
# 停止后端服务
# 启动后端服务
```

**原因**: DO 模型修改后需要重启服务才能生效。

## 常见问题和解决方案

### 问题 1：API 返回空数组
**现象**: 
```json
{
  "code": 200,
  "data": {
    "rows": [],
    "total": 0
  }
}
```

**原因**: 
- 所有工单的 `order_id` 不为 NULL（已汇总）
- 查询条件过滤了所有数据

**解决方案**:
```sql
-- 检查工单的 order_id
SELECT 
    COUNT(*) AS 总数,
    COUNT(CASE WHEN order_id IS NULL THEN 1 END) AS 未汇总数量,
    COUNT(CASE WHEN order_id IS NOT NULL THEN 1 END) AS 已汇总数量
FROM test_work_order;
```

如果所有工单都已汇总，需要重置：
```sql
UPDATE test_work_order
SET order_id = NULL
WHERE id IN (选择要重置的工单ID);
```

### 问题 2：API 返回 500 错误
**现象**: Network 标签显示 500 Internal Server Error

**原因**: 后端代码有错误

**解决方案**:
1. 查看后端日志
2. 检查 DO 模型是否正确
3. 确认数据库字段类型是否匹配

### 问题 3：前端显示字段错误
**现象**: API 返回数据正常，但前端不显示或显示错误

**原因**: 前端字段映射错误

**解决方案**:
检查前端代码中的字段名（应该是 camelCase）：
```vue
<el-table-column label="工单分组" prop="batchName" />
<el-table-column label="产品SN" prop="testEutName" />
```

### 问题 4：路由参数问题
**现象**: 从订单页面跳转到工单页面时，工单列表为空

**原因**: 路由参数名称不匹配

**当前代码**:
```javascript
watch: {
  '$route': {
    handler(to) {
      const orderId = to.query.orderId || to.params.orderId;
      if(orderId !== undefined && orderId !== null) {
        this.queryParams.batchId = orderId;  // 将 orderId 赋值给 batchId
        this.getList();
      }
    }
  }
}
```

**说明**: 
- 这段代码是为了兼容从订单页面跳转过来的情况
- 如果 URL 中有 `orderId` 参数，就用它来过滤工单
- 如果没有参数，就显示所有未汇总的工单

**如果需要修改**:
```javascript
// 方案 1：同时支持 orderId 和 batchId
const id = to.query.batchId || to.query.orderId || to.params.batchId || to.params.orderId;
if(id !== undefined && id !== null) {
  this.queryParams.batchId = id;
  this.getList();
}

// 方案 2：只支持 batchId
const batchId = to.query.batchId || to.params.batchId;
if(batchId !== undefined && batchId !== null) {
  this.queryParams.batchId = batchId;
  this.getList();
}
```

## 完整的修复流程

### 1. 验证数据库
```bash
mysql -u root -p your_database < verify_workorder_data.sql
```

确认：
- ✅ 有工单数据
- ✅ `batch_id` 和 `batch_name` 有值
- ✅ `order_id` 为 NULL

### 2. 重启后端服务
```bash
# 停止后端服务
# 启动后端服务
```

### 3. 清除浏览器缓存
- 按 `Ctrl + Shift + R`（Windows）或 `Cmd + Shift + R`（Mac）
- 或者在开发者工具中勾选 "Disable cache"

### 4. 刷新工单列表页面
直接访问工单列表页面（不带任何参数）：
```
http://localhost:8080/#/system/test_work_order
```

### 5. 检查开发者工具
- **Network**: 查看 API 请求和响应
- **Console**: 查看是否有 JavaScript 错误

## 快速检查清单

- [ ] 数据库中有工单数据
- [ ] 工单的 `order_id` 为 NULL
- [ ] 工单的 `batch_id` 和 `batch_name` 有值
- [ ] 后端服务已重启
- [ ] 浏览器缓存已清除
- [ ] API 请求返回 200 状态码
- [ ] API 响应中有数据（`rows` 不为空）
- [ ] 浏览器 Console 没有错误

## 相关文件
- `verify_workorder_data.sql` - 验证工单数据脚本 ✅
- `test_work_order_dao.py` - 工单 DAO（查询逻辑）
- `test_work_order/index.vue` - 工单列表前端页面
- `工单列表显示修复完成.md` - 之前的修复说明

## 完成时间
2026-01-08 23:45