# 工艺路线工序接口新增投料BOM - 前端联调方案

## 涉及页面

- 生产工单新增/编辑页（`src/views/mes/pro/workorder/detail.vue`）
  - 子组件 `modules/process-list.vue`（工序列表）
  - 子组件 `modules/process-form.vue`（工序新增/编辑弹窗）

## 业务流程与数据带入

1. 用户新建/编辑工单 → 选择产品 → `process-list.vue` 调用接口获取工序列表
2. 工序列表返回数据中新增 `bomItems` 字段（工序投料明细）
3. 工序展开行自动展示投料明细（无需额外请求）
4. 保存工单时 `bomItems` 随工序数据一起提交

## API

### 接口说明

| 方法 | 路径 | 说明 |
|------|------|------|
| GET | `/mes/pro/route-process/list-by-product?productId={productId}` | 按产品获取工艺路线工序（含投料BOM） |

### 响应字段新增

`MesProRouteProcessRespVO` 新增字段：

| 字段 | 类型 | 说明 |
|------|------|------|
| bomItems | ProcessBomItem[] | 工序投料BOM列表，无投料时为空数组或 null |

### ProcessBomItem 结构

| 字段 | 类型 | 说明 |
|------|------|------|
| itemId | Long | BOM物料编号 |
| itemCode | String | BOM物料编码 |
| itemName | String | BOM物料名称 |
| quantity | BigDecimal | 用料比例 |
| remark | String | 备注 |

### 响应示例

```json
{
  "code": 0,
  "data": [
    {
      "id": 1,
      "routeId": 10,
      "processId": 100,
      "processCode": "P001",
      "processName": "焊接",
      "sort": 1,
      "nextProcessId": 101,
      "nextProcessName": "组装",
      "linkType": 3,
      "keyFlag": true,
      "checkFlag": false,
      "backflushFlag": true,
      "outputItemId": 200,
      "outputItemCode": "M200",
      "outputItemName": "半成品A",
      "bomItems": [
        {
          "itemId": 1001,
          "itemCode": "M001",
          "itemName": "钢板",
          "quantity": 2.0,
          "remark": ""
        },
        {
          "itemId": 1002,
          "itemCode": "M002",
          "itemName": "焊条",
          "quantity": 0.5,
          "remark": ""
        }
      ]
    },
    {
      "id": 2,
      "routeId": 10,
      "processId": 101,
      "processCode": "P002",
      "processName": "组装",
      "sort": 2,
      "nextProcessId": null,
      "bomItems": []
    }
  ]
}
```

## 字段展示规则

| 字段 | 展示位置 | 说明 |
|------|----------|------|
| bomItems | 工序表格展开行 | 点击展开按钮后以 Tag 列表形式展示每个投料物料 |
| itemName / itemCode | Tag 文本 | 优先显示物料名称，无名称时显示编码 |
| quantity | Tag 后缀 | 显示为 `×{quantity}` 格式 |

## 前端对接确认清单

### 已修改文件（当前分支已有）

| 文件 | 修改内容 |
|------|----------|
| `src/api/mes/pro/route/process/index.ts` | `RouteProcess` 接口新增 `bomItems?: ProcessBomItem[]` |
| `src/api/mes/pro/workorder/process/index.ts` | `WorkOrderProcess` 接口新增 `bomItems?: ProcessBomItem[]` |
| `src/views/mes/pro/workorder/data.ts` | `useProcessGridColumns` 新增展开列 `{ type: 'expand', width: 50 }` |
| `src/views/mes/pro/workorder/modules/process-list.vue` | `getList()` 映射 `bomItems`，模板新增 `#expand` slot |

### 需确认

1. `ProcessBomItem` 接口类型在前端 API 文件中已补充，确认与后端返回结构一致
2. 展开行内的投料明细 Tag 列表展示按当前设计：蓝色 Tag，显示 `物料名称 ×用量`
3. 无投料工序的展开行为空（无任何内容），不显示"投料明细"标题

## 业务规则说明

| 场景 | 规则 |
|------|------|
| 产品未配置工艺路线 | 返回空列表，不报错 |
| 工艺路线有工序但未配置投料 | bomItems 为空，展开行无内容 |
| 投料物料已被删除 | 不返回该条投料记录（数据库逻辑删除） |
| 工序被删除后重建 | 展开行重新从接口获取最新 BOM 数据 |

## 注意事项

- 后端确保无需重启即可验证（如果接口已有数据）：使用已配置投料的产品ID调用接口
- 投料 BOM 来自 `mes_pro_route_product_bom` 表（配置投料），不是产品标准 BOM
- BOM 物料名称通过 `MesMdItemService` 实时查询，确保展示最新物料名称
- Mapper 层使用 MyBatis-Plus `@TableLogic`，已逻辑删除的记录不会返回