# 归档台账（按产品聚合）前端对接文档

## 涉及页面

- 归档台账列表页（修改）
- 归档台账详情弹窗/页面（新增）

## API

### 1. 分页查询（按项目/产品聚合）

| 方法 | 路径 | 说明 |
|------|------|------|
| GET | /mes/pd/archive/page | 归档台账分页（按项目/产品聚合） |

**请求参数：**

| 参数 | 类型 | 必填 | 说明 |
|------|------|------|------|
| pageNo | Integer | 是 | 页码（从1开始） |
| pageSize | Integer | 是 | 每页条数 |
| archiveCode | String | 否 | 归档编号（模糊搜索） |
| projectId | Long | 否 | 设计项目ID |
| archiveStatus | Integer | 否 | 归档状态（0=待归档 1=已归档） |
| productCode | String | 否 | 产品编码（模糊搜索） |
| productName | String | 否 | 产品名称（模糊搜索） |

**响应结构：**

```json
{
  "code": 200,
  "data": {
    "list": [
      {
        "id": 3,
        "archiveCode": "ARC20240003",
        "projectId": 1,
        "taskCode": "PD20240001",
        "taskName": "新产品设计任务",
        "productCode": "P001",
        "productName": "注塑产品A",
        "archiveCount": 3,
        "archiver": 1,
        "archiverNickname": "王五",
        "archiveStatus": 1,
        "archiveTime": "2024-01-03 10:00:00",
        "remark": "",
        "createTime": "2024-01-01 00:00:00",
        "updater": "1",
        "updaterNickname": "张三",
        "updateTime": "2024-01-03 15:30:00"
      }
    ],
    "total": 5
  }
}
```

**字段说明：**

| 字段 | 类型 | 说明 |
|------|------|------|
| id | Long | 最新归档记录ID |
| archiveCode | String | 最新归档编号 |
| projectId | Long | 设计项目ID |
| taskCode | String | 任务编码 |
| taskName | String | 任务名称 |
| productCode | String | 产品编码 |
| productName | String | 产品名称 |
| archiveCount | Integer | 该项目下归档记录总数 |
| archiver | Long | 归档人ID |
| archiverNickname | String | 归档人名称 |
| archiveStatus | Integer | 归档状态（字典 mes_pd_archive_status） |
| archiveTime | LocalDateTime | 归档时间 |
| remark | String | 备注 |
| createTime | LocalDateTime | 创建时间 |
| updater | String | 更新人ID |
| updaterNickname | String | 更新人名称 |
| updateTime | LocalDateTime | 更新时间 |

---

### 2. 详情查询（按产品编码）

| 方法 | 路径 | 说明 |
|------|------|------|
| GET | /mes/pd/archive/detail-by-product | 归档台账详情（按产品编码查询） |

**请求参数：**

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

**响应结构：**

返回 `List<MesPdArchiveDetailRespVO>`，同一产品编码可能关联多个设计项目，每个项目一条详情。

```json
{
  "code": 200,
  "data": [
    {
      "project": {
        "id": 1,
        "taskCode": "PD20240001",
        "taskName": "新产品设计任务",
        "productCode": "P001",
        "productName": "注塑产品A",
        "version": "V1.0",
        "status": 4,
        "chiefDesigner": 1,
        "chiefDesignerNickname": "张三",
        "reviewer": 2,
        "reviewerNickname": "李四",
        "planFinishTime": "2024-12-31 00:00:00",
        "remark": "",
        "createTime": "2024-01-01 00:00:00"
      },
      "archives": [
        {
          "id": 1,
          "archiveCode": "ARC20240001",
          "archiver": 1,
          "archiverNickname": "王五",
          "archiveStatus": 1,
          "archiveTime": "2024-01-01 10:00:00",
          "remark": "",
          "createTime": "2024-01-01 10:00:00"
        },
        {
          "id": 2,
          "archiveCode": "ARC20240002",
          "archiver": 1,
          "archiverNickname": "王五",
          "archiveStatus": 1,
          "archiveTime": "2024-01-02 10:00:00",
          "remark": "",
          "createTime": "2024-01-02 10:00:00"
        }
      ],
      "documents": [
        {
          "id": 1,
          "documentType": "1",
          "documentName": "产品设计图",
          "documentVersion": "V1.0",
          "fileName": "design.pdf",
          "fileUrl": "/files/design.pdf",
          "uploadUserId": 1,
          "uploadUserNickname": "赵六",
          "uploadTime": "2024-01-01 09:00:00",
          "remark": "",
          "createTime": "2024-01-01 09:00:00"
        }
      ]
    }
  ]
}
```

**ProjectInfo 字段说明：**

| 字段 | 类型 | 说明 |
|------|------|------|
| id | Long | 项目ID |
| taskCode | String | 任务编码 |
| taskName | String | 任务名称 |
| productCode | String | 产品编码 |
| productName | String | 产品名称 |
| version | String | 版本号 |
| status | Integer | 项目状态（字典 mes_pd_project_status：0=待发布 1=待上传 2=待审核 3=待归档 4=已归档） |
| chiefDesigner | Long | 主设计师ID |
| chiefDesignerNickname | String | 主设计师名称 |
| reviewer | Long | 审核人ID |
| reviewerNickname | String | 审核人名称 |
| planFinishTime | LocalDateTime | 计划完成时间 |
| remark | String | 备注 |
| createTime | LocalDateTime | 创建时间 |

**ArchiveInfo 字段说明：**

| 字段 | 类型 | 说明 |
|------|------|------|
| id | Long | 归档ID |
| archiveCode | String | 归档编号 |
| archiver | Long | 归档人ID |
| archiverNickname | String | 归档人名称 |
| archiveStatus | Integer | 归档状态（字典 mes_pd_archive_status） |
| archiveTime | LocalDateTime | 归档时间 |
| remark | String | 备注 |
| createTime | LocalDateTime | 创建时间 |

**DocumentInfo 字段说明：**

| 字段 | 类型 | 说明 |
|------|------|------|
| id | Long | 资料ID |
| documentType | String | 资料类型（字典 mes_pd_document_type） |
| documentName | String | 资料名称 |
| documentVersion | String | 资料版本 |
| fileName | String | 文件名 |
| fileUrl | String | 文件URL |
| uploadUserId | Long | 上传人ID |
| uploadUserNickname | String | 上传人名称 |
| uploadTime | LocalDateTime | 上传时间 |
| remark | String | 备注 |
| createTime | LocalDateTime | 创建时间 |

---

## 前端修改点

### 1. 列表页 - 搜索栏新增

```html
<el-form :model="queryParams" ref="queryFormRef" :inline="true">
  <el-form-item label="产品编码" prop="productCode">
    <el-input v-model="queryParams.productCode" placeholder="请输入产品编码" clearable />
  </el-form-item>
  <el-form-item label="产品名称" prop="productName">
    <el-input v-model="queryParams.productName" placeholder="请输入产品名称" clearable />
  </el-form-item>
  <el-form-item label="归档状态" prop="archiveStatus">
    <el-select v-model="queryParams.archiveStatus" placeholder="请选择归档状态" clearable>
      <el-option v-for="dict in getIntDictOptions(DICT_TYPE.MES_PD_ARCHIVE_STATUS)"
        :key="dict.value" :label="dict.label" :value="dict.value" />
    </el-select>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
    <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
  </el-form-item>
</el-form>
```

### 2. 列表页 - 表格新增列

```html
<el-table v-loading="loading" :data="list">
  <el-table-column label="产品编码" align="center" prop="productCode" />
  <el-table-column label="产品名称" align="center" prop="productName" />
  <el-table-column label="归档数量" align="center" prop="archiveCount" width="100" />
  <el-table-column label="更新人" align="center" prop="updaterNickname" />
  <el-table-column label="更新时间" align="center" prop="updateTime" width="180" />
  <el-table-column label="操作" align="center" width="100">
    <template #default="scope">
      <el-button link type="primary" @click="handleDetail(scope.row.productCode)"
        v-hasPermi="['mes:pd-archive:query']">详情</el-button>
    </template>
  </el-table-column>
</el-table>
```

### 3. 详情弹窗/页面 - 新增

```html
<!-- 按产品编码可能返回多个项目，用 tab 或手风琴展示 -->
<el-tabs v-model="activeProject" type="border-card">
  <el-tab-pane v-for="(detail, index) in detailList" :key="detail.project.id"
    :label="detail.project.taskName" :name="String(index)">

    <!-- 项目信息 -->
    <el-descriptions :column="3" border>
      <el-descriptions-item label="任务编码">{{ detail.project.taskCode }}</el-descriptions-item>
      <el-descriptions-item label="任务名称">{{ detail.project.taskName }}</el-descriptions-item>
      <el-descriptions-item label="产品编码">{{ detail.project.productCode }}</el-descriptions-item>
      <el-descriptions-item label="产品名称">{{ detail.project.productName }}</el-descriptions-item>
      <el-descriptions-item label="版本号">{{ detail.project.version }}</el-descriptions-item>
      <el-descriptions-item label="主设计师">{{ detail.project.chiefDesignerNickname }}</el-descriptions-item>
      <el-descriptions-item label="审核人">{{ detail.project.reviewerNickname }}</el-descriptions-item>
      <el-descriptions-item label="计划完成时间">{{ detail.project.planFinishTime }}</el-descriptions-item>
    </el-descriptions>

    <!-- 归档记录列表 -->
    <el-card header="归档记录" style="margin-top: 16px">
      <el-table :data="detail.archives" border>
        <el-table-column label="归档编号" prop="archiveCode" />
        <el-table-column label="归档人" prop="archiverNickname" />
        <el-table-column label="归档状态" prop="archiveStatus">
          <template #default="scope">
            <dict-tag :type="DICT_TYPE.MES_PD_ARCHIVE_STATUS" :value="scope.row.archiveStatus" />
          </template>
        </el-table-column>
        <el-table-column label="归档时间" prop="archiveTime" width="180" />
        <el-table-column label="备注" prop="remark" show-overflow-tooltip />
      </el-table>
    </el-card>

    <!-- 设计资料列表 -->
    <el-card header="设计资料" style="margin-top: 16px">
      <el-table :data="detail.documents" border>
        <el-table-column label="资料名称" prop="documentName" />
        <el-table-column label="资料类型" prop="documentType">
          <template #default="scope">
            <dict-tag :type="DICT_TYPE.MES_PD_DOCUMENT_TYPE" :value="scope.row.documentType" />
          </template>
        </el-table-column>
        <el-table-column label="版本" prop="documentVersion" width="80" />
        <el-table-column label="文件名" prop="fileName" />
        <el-table-column label="上传人" prop="uploadUserNickname" />
        <el-table-column label="上传时间" prop="uploadTime" width="180" />
        <el-table-column label="操作" width="80">
          <template #default="scope">
            <el-button v-if="scope.row.fileUrl" link type="primary" @click="handleDownload(scope.row)">下载</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>

  </el-tab-pane>
</el-tabs>
```

### 4. API 接口定义

文件路径：`src/api/mes/pd/archive/index.ts`

```ts
import request from '@/config/axios'

// 获得归档台账分页（按项目/产品聚合）
export const getArchivePage = (params) => {
  return request.get({ url: '/mes/pd/archive/page', params })
}

// 获得归档台账详情（按产品编码）
export const getArchiveDetailByProduct = (productCode: string) => {
  return request.get({ url: '/mes/pd/archive/detail-by-product', params: { productCode } })
}

// 创建归档台账
export const createArchive = (data) => {
  return request.post({ url: '/mes/pd/archive/create', data })
}

// 更新归档台账
export const updateArchive = (data) => {
  return request.put({ url: '/mes/pd/archive/update', data })
}

// 删除归档台账
export const deleteArchive = (id: number) => {
  return request.delete({ url: '/mes/pd/archive/delete?id=' + id })
}

// 获得归档台账
export const getArchive = (id: number) => {
  return request.get({ url: '/mes/pd/archive/get?id=' + id })
}

// 导出归档台账 Excel
export const exportArchiveExcel = (params) => {
  return request.download({ url: '/mes/pd/archive/export-excel', params })
}
```

### 5. data 数据

```js
const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
  archiveCode: undefined,
  projectId: undefined,
  archiveStatus: undefined,
  productCode: undefined,
  productName: undefined,
})

const detailList = ref([])
const detailVisible = ref(false)
const activeProject = ref('0')
```

### 6. 方法

```js
// 查看详情（按产品编码）
const handleDetail = async (productCode) => {
  const res = await ArchiveApi.getArchiveDetailByProduct(productCode)
  detailList.value = res
  activeProject.value = '0'
  detailVisible.value = true
}
```

## 注意事项

- **分页聚合逻辑**：`/page` 接口按 `project_id` 分组，每组取最新一条归档记录（`MAX(id)`），所以 `updater` 和 `updateTime` 是该组最新归档的更新信息
- **详情接口参数变化**：从 `projectId` 改为 `productCode`，因为前端列表展示的是产品维度，点击详情时传产品编码更自然
- **详情返回列表**：`detail-by-product` 返回 `List`，因为同一产品编码可能关联多个设计项目（如不同版本），前端用 tab 切换展示
- **字典类型**：
  - 归档状态：`mes_pd_archive_status`（0=待归档 1=已归档）
  - 项目状态：`mes_pd_project_status`（0=待发布 1=待上传 2=待审核 3=待归档 4=已归档）
  - 资料类型：`mes_pd_document_type`