# 生产流程 - 查看产品设计归档及附件（前端联调方案）

## 涉及页面

| 页面 | 路由路径 | 说明 |
|------|----------|------|
| 生产工单列表/详情 | `/mes/pro-workorder` | 新增"查看归档"按钮 |
| 生产工单中心 | `/mes/workorder-center` | 新增"查看归档"按钮 |
| 生产任务列表/详情 | `/mes/pro-task` | 新增"查看归档"按钮 |
| 待报工台账 | `/mes/pro-task` (pending-feedback) | 新增"查看归档"按钮 |
| 生产报工列表/详情 | `/mes/pro-feedback` | 新增"查看归档"按钮 |

---

## API（已有接口，无需新增）

### 归档分页列表

| 方法 | 路径 | 说明 |
|------|------|------|
| GET | `/mes/pd/archive/page` | 按产品编码筛选归档列表 |

**请求参数（关键）：**

| 参数 | 类型 | 必填 | 说明 |
|------|------|------|------|
| productCode | String | 是 | 产品编码，从当前记录的 `itemCode` 或 `productCode` 传入 |
| pageNo | Integer | 否 | 页码 |
| pageSize | Integer | 否 | 每页条数 |

### 归档详情（含附件）

| 方法 | 路径 | 说明 |
|------|------|------|
| GET | `/mes/pd/archive/detail-by-product` | 按产品编码获取归档详情和附件 |

**请求参数：**

| 参数 | 类型 | 必填 | 说明 |
|------|------|------|------|
| productCode | String | 是 | 产品编码 |

**响应结构：**

```json
{
  "code": 0,
  "data": [
    {
      "project": {
        "id": 1,
        "taskCode": "PD2024001",
        "taskName": "新产品设计任务",
        "productCode": "P001",
        "productName": "注塑产品A",
        "version": "V1.0",
        "status": 4,
        "chiefDesigner": 1,
        "chiefDesignerNickname": "张三"
      },
      "archives": [
        {
          "id": 1,
          "archiveCode": "ARC2024001",
          "archiver": 1,
          "archiverNickname": "王五",
          "archiveStatus": 1,
          "archiveTime": "2024-01-15T10:30:00"
        }
      ],
      "documents": [
        {
          "id": 1,
          "documentType": "1",
          "documentName": "产品设计图",
          "documentVersion": "V1.0",
          "fileName": "design.pdf",
          "attachmentList": [
            {
              "id": "blob-id-xxx",
              "name": "设计图纸.pdf",
              "url": "/system/storage-blob/preview/xxx"
            }
          ],
          "uploadUserId": 1,
          "uploadUserNickname": "赵六",
          "uploadTime": "2024-01-10T09:00:00"
        }
      ]
    }
  ]
}
```

---

## 数据传递

生产流程各环节的记录中已包含产品编码，直接传给归档接口：

| 来源页面 | 字段名 | 传给归档接口 |
|----------|--------|-------------|
| 生产工单 | `productCode` | `?productCode={productCode}` |
| 生产任务 | `itemCode` | `?productCode={itemCode}` |
| 生产报工 | `itemCode` | `?productCode={itemCode}` |
| 待报工台账 | `itemCode` | `?productCode={itemCode}` |

---

## 前端修改点

### 1. 查看归档按钮

在生产工单、任务、报工列表的操作列，以及详情页，新增"设计归档"按钮。

点击后弹出抽屉或弹窗，调用 `/mes/pd/archive/detail-by-product?productCode={code}` 获取归档详情。

### 2. 弹窗内容展示

以 Tab 或分区展示三部分内容：

| 区域 | 内容 | 数据来源 |
|------|------|----------|
| 项目信息 | 任务编码、任务名称、产品编码/名称、版本、主设计师、状态 | `response[].project` |
| 归档记录 | 表格：归档编号、归档人、归档状态、归档时间 | `response[].archives` |
| 设计资料 | 表格：资料类型、名称、版本、文件名，附件可点击下载/预览 | `response[].documents` |

### 3. 附件处理

设计资料中的 `attachmentList` 为附件列表，其中 `url` 可直接用于文件预览/下载。

文件预览 URL 格式：
- 预览：`/system/storage-blob/preview/{fileName}`
- 下载：`/system/storage-blob/download/{fileName}`

---

## 业务规则说明

| 规则 | 说明 |
|------|------|
| 产品未归档 | 接口返回空数组，弹窗提示"该产品暂无设计归档" |
| 多个项目 | 同一产品可能有多个设计项目，按项目分组展示 |
| 附件权限 | 附件预览/下载走 system 模块 Storage API，无需额外鉴权 |
| 空附件 | `attachmentList` 可能为空数组，前端判断后不显示下载链接 |

---

## 注意事项

- 列表页操作列宽度有限，建议按钮文字简写为"归档"
- `detail-by-product` 接口返回数组，一个产品可能对应多个设计项目
- 附件预览使用 `window.open()` 打开预览 URL
- 接口已存在，前端直接调用 `src/api/mes/pd/archive/index.ts` 中的封装方法