编辑 | blame | 历史 | 原始文档

工艺参数与工艺参数模板

涉及页面

  • 工艺参数列表页(新增)
  • 工艺参数模板列表页(新增)

API

工艺参数

方法 路径 说明
POST /mes/pd/process-param/create 创建工艺参数
PUT /mes/pd/process-param/update 更新工艺参数
DELETE /mes/pd/process-param/delete?id= 删除工艺参数
GET /mes/pd/process-param/get?id= 获取工艺参数详情
GET /mes/pd/process-param/page 分页查询工艺参数
GET /mes/pd/process-param/export-excel 导出工艺参数

创建请求参数:

参数 类型 必填 说明
paramName String 参数名称
paramType Integer 参数类型(字典 mes_pd_process_param_type:1=文本 2=数值 3=布尔 4=日期)
unitMeasureId Long 计量单位ID
required Boolean 是否必填,默认false
remark String 备注

注意:参数编码(paramCode)由后端自动生成,前端无需传入。

响应:

{ "code": 200, "data": 1, "msg": "操作成功" }

分页查询参数:

参数 类型 必填 说明
pageNo Integer 页码
pageSize Integer 每页条数
paramCode String 参数编码(模糊搜索)
paramName String 参数名称(模糊搜索)
paramType Integer 参数类型(精确匹配)

响应结构:

{
  "code": 200,
  "data": {
    "list": [
      {
        "id": 1,
        "paramCode": "PP20240001",
        "paramName": "注塑温度",
        "paramType": 2,
        "unitMeasureId": 1,
        "unitMeasureName": "℃",
        "required": true,
        "remark": "",
        "createTime": "2024-01-01 00:00:00"
      }
    ],
    "total": 1
  }
}

工艺参数模板

方法 路径 说明
POST /mes/pd/process-param-template/create 创建工艺参数模板
PUT /mes/pd/process-param-template/update 更新工艺参数模板
DELETE /mes/pd/process-param-template/delete?id= 删除工艺参数模板
GET /mes/pd/process-param-template/get?id= 获取工艺参数模板详情
GET /mes/pd/process-param-template/page 分页查询工艺参数模板
GET /mes/pd/process-param-template/export-excel 导出工艺参数模板

创建/更新请求参数:

参数 类型 必填 说明
id Long 编号(更新时必填)
templateName String 模板名称
templateType Integer 模板类型(字典 mes_pd_process_param_template_type:1=通用 2=工序 3=产品)
remark String 备注
details List<Detail> 模板明细列表

Detail 结构:

参数 类型 必填 说明
processParamId Long 工艺参数ID
required Boolean 是否必填(可覆盖参数默认值)
remark String 备注(可覆盖参数默认值)

注意:模板编码(templateCode)由后端自动生成,前端无需传入。模板明细采用快照机制——关联时复制参数值,改变工艺参数列表的值不影响模板。

响应结构:

{
  "code": 200,
  "data": {
    "id": 1,
    "templateCode": "PPT20240001",
    "templateName": "注塑工艺参数模板",
    "templateType": 2,
    "remark": "",
    "createTime": "2024-01-01 00:00:00",
    "details": [
      {
        "id": 1,
        "templateId": 1,
        "processParamId": 1,
        "paramCode": "PP20240001",
        "paramName": "注塑温度",
        "paramType": 2,
        "unitMeasureId": 1,
        "unitMeasureName": "℃",
        "required": true,
        "remark": ""
      }
    ]
  }
}

前端修改点

1. 工艺参数列表页 - 新增页面

文件路径:src/views/mes/pd/processparam/index.vue

<!-- 搜索栏 -->
<el-form :model="queryParams" ref="queryFormRef" :inline="true">
  <el-form-item label="参数编码" prop="paramCode">
    <el-input v-model="queryParams.paramCode" placeholder="请输入参数编码" clearable />
  </el-form-item>
  <el-form-item label="参数名称" prop="paramName">
    <el-input v-model="queryParams.paramName" placeholder="请输入参数名称" clearable />
  </el-form-item>
  <el-form-item label="参数类型" prop="paramType">
    <el-select v-model="queryParams.paramType" placeholder="请选择参数类型" clearable>
      <el-option v-for="dict in getIntDictOptions(DICT_TYPE.MES_PD_PROCESS_PARAM_TYPE)"
        :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>

<!-- 操作栏 -->
<el-row :gutter="10" class="mb8">
  <el-col :span="1.5">
    <el-button type="primary" @click="openForm('create')"
      v-hasPermi="['mes:pd-process-param:create']"><Icon icon="ep:plus" />新增</el-button>
  </el-col>
  <el-col :span="1.5">
    <el-button type="warning" @click="handleExport"
      v-hasPermi="['mes:pd-process-param:export']"><Icon icon="ep:download" />导出</el-button>
  </el-col>
</el-row>

<!-- 列表 -->
<el-table v-loading="loading" :data="list">
  <el-table-column label="编号" align="center" prop="id" />
  <el-table-column label="参数编码" align="center" prop="paramCode" />
  <el-table-column label="参数名称" align="center" prop="paramName" />
  <el-table-column label="参数类型" align="center" prop="paramType">
    <template #default="scope">
      <dict-tag :type="DICT_TYPE.MES_PD_PROCESS_PARAM_TYPE" :value="scope.row.paramType" />
    </template>
  </el-table-column>
  <el-table-column label="单位" align="center" prop="unitMeasureName" />
  <el-table-column label="是否必填" align="center" prop="required">
    <template #default="scope">
      <el-tag :type="scope.row.required ? 'danger' : 'info'">{{ scope.row.required ? '是' : '否' }}</el-tag>
    </template>
  </el-table-column>
  <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
  <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
  <el-table-column label="操作" align="center" width="150">
    <template #default="scope">
      <el-button link type="primary" @click="openForm('update', scope.row.id)"
        v-hasPermi="['mes:pd-process-param:update']">编辑</el-button>
      <el-button link type="danger" @click="handleDelete(scope.row.id)"
        v-hasPermi="['mes:pd-process-param:delete']">删除</el-button>
    </template>
  </el-table-column>
</el-table>

2. 工艺参数表单弹窗 - 新增/编辑

文件路径:src/views/mes/pd/processparam/ProcessParamForm.vue

<el-dialog :title="dialogTitle" v-model="dialogVisible" width="500px">
  <el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px">
    <el-form-item label="参数名称" prop="paramName">
      <el-input v-model="formData.paramName" placeholder="请输入参数名称" />
    </el-form-item>
    <el-form-item label="参数类型" prop="paramType">
      <el-select v-model="formData.paramType" placeholder="请选择参数类型">
        <el-option v-for="dict in getIntDictOptions(DICT_TYPE.MES_PD_PROCESS_PARAM_TYPE)"
          :key="dict.value" :label="dict.label" :value="dict.value" />
      </el-select>
    </el-form-item>
    <el-form-item label="计量单位" prop="unitMeasureId">
      <el-select v-model="formData.unitMeasureId" placeholder="请选择计量单位" clearable filterable>
        <!-- 从计量单位接口获取列表 -->
      </el-select>
    </el-form-item>
    <el-form-item label="是否必填" prop="required">
      <el-switch v-model="formData.required" />
    </el-form-item>
    <el-form-item label="备注" prop="remark">
      <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
    </el-form-item>
  </el-form>
</el-dialog>

3. data 数据

const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
  paramCode: undefined,
  paramName: undefined,
  paramType: undefined,
})
const formData = reactive({
  id: undefined,
  paramName: undefined,
  paramType: undefined,
  unitMeasureId: undefined,
  required: false,
  remark: undefined,
})

4. 工艺参数模板列表页 - 新增页面

文件路径:src/views/mes/pd/processparamtemplate/index.vue

<!-- 搜索栏 -->
<el-form :model="queryParams" ref="queryFormRef" :inline="true">
  <el-form-item label="模板编码" prop="templateCode">
    <el-input v-model="queryParams.templateCode" placeholder="请输入模板编码" clearable />
  </el-form-item>
  <el-form-item label="模板名称" prop="templateName">
    <el-input v-model="queryParams.templateName" placeholder="请输入模板名称" clearable />
  </el-form-item>
  <el-form-item label="模板类型" prop="templateType">
    <el-select v-model="queryParams.templateType" placeholder="请选择模板类型" clearable>
      <el-option v-for="dict in getIntDictOptions(DICT_TYPE.MES_PD_PROCESS_PARAM_TEMPLATE_TYPE)"
        :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>

<!-- 列表 -->
<el-table v-loading="loading" :data="list">
  <el-table-column label="编号" align="center" prop="id" />
  <el-table-column label="模板编码" align="center" prop="templateCode" />
  <el-table-column label="模板名称" align="center" prop="templateName" />
  <el-table-column label="模板类型" align="center" prop="templateType">
    <template #default="scope">
      <dict-tag :type="DICT_TYPE.MES_PD_PROCESS_PARAM_TEMPLATE_TYPE" :value="scope.row.templateType" />
    </template>
  </el-table-column>
  <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
  <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
  <el-table-column label="操作" align="center" width="150">
    <template #default="scope">
      <el-button link type="primary" @click="openForm('update', scope.row.id)"
        v-hasPermi="['mes:pd-process-param-template:update']">编辑</el-button>
      <el-button link type="danger" @click="handleDelete(scope.row.id)"
        v-hasPermi="['mes:pd-process-param-template:delete']">删除</el-button>
    </template>
  </el-table-column>
</el-table>

5. 工艺参数模板表单弹窗(含明细)

文件路径:src/views/mes/pd/processparamtemplate/ProcessParamTemplateForm.vue

<el-dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
  <el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px">
    <el-form-item label="模板名称" prop="templateName">
      <el-input v-model="formData.templateName" placeholder="请输入模板名称" />
    </el-form-item>
    <el-form-item label="模板类型" prop="templateType">
      <el-select v-model="formData.templateType" placeholder="请选择模板类型">
        <el-option v-for="dict in getIntDictOptions(DICT_TYPE.MES_PD_PROCESS_PARAM_TEMPLATE_TYPE)"
          :key="dict.value" :label="dict.label" :value="dict.value" />
      </el-select>
    </el-form-item>
    <el-form-item label="备注" prop="remark">
      <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
    </el-form-item>

    <!-- 模板明细列表 -->
    <el-form-item label="工艺参数" prop="details">
      <el-button type="primary" size="small" @click="addDetail"><Icon icon="ep:plus" />添加参数</el-button>
      <el-table :data="formData.details" border style="width: 100%; margin-top: 10px">
        <el-table-column label="工艺参数" align="center" min-width="200">
          <template #default="scope">
            <el-select v-model="scope.row.processParamId" placeholder="请选择工艺参数" filterable
              @change="onParamChange(scope.row)">
              <!-- 从工艺参数列表接口获取 -->
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="参数编码" align="center" prop="paramCode" width="120" />
        <el-table-column label="参数类型" align="center" prop="paramTypeName" width="100" />
        <el-table-column label="单位" align="center" prop="unitMeasureName" width="80" />
        <el-table-column label="是否必填" align="center" width="100">
          <template #default="scope">
            <el-switch v-model="scope.row.required" />
          </template>
        </el-table-column>
        <el-table-column label="备注" align="center" min-width="120">
          <template #default="scope">
            <el-input v-model="scope.row.remark" placeholder="备注" />
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="60">
          <template #default="scope">
            <el-button link type="danger" @click="removeDetail(scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form-item>
  </el-form>
</el-dialog>

6. API 接口定义

文件路径:src/api/mes/pd/processparam/index.ts

import request from '@/config/axios'

// 创建工艺参数
export const createProcessParam = (data) => {
  return request.post({ url: '/mes/pd/process-param/create', data })
}

// 更新工艺参数
export const updateProcessParam = (data) => {
  return request.put({ url: '/mes/pd/process-param/update', data })
}

// 删除工艺参数
export const deleteProcessParam = (id: number) => {
  return request.delete({ url: '/mes/pd/process-param/delete?id=' + id })
}

// 获取工艺参数
export const getProcessParam = (id: number) => {
  return request.get({ url: '/mes/pd/process-param/get?id=' + id })
}

// 获取工艺参数分页
export const getProcessParamPage = (params) => {
  return request.get({ url: '/mes/pd/process-param/page', params })
}

// 导出工艺参数 Excel
export const exportProcessParamExcel = (params) => {
  return request.download({ url: '/mes/pd/process-param/export-excel', params })
}

文件路径:src/api/mes/pd/processparamtemplate/index.ts

import request from '@/config/axios'

// 创建工艺参数模板
export const createProcessParamTemplate = (data) => {
  return request.post({ url: '/mes/pd/process-param-template/create', data })
}

// 更新工艺参数模板
export const updateProcessParamTemplate = (data) => {
  return request.put({ url: '/mes/pd/process-param-template/update', data })
}

// 删除工艺参数模板
export const deleteProcessParamTemplate = (id: number) => {
  return request.delete({ url: '/mes/pd/process-param-template/delete?id=' + id })
}

// 获取工艺参数模板
export const getProcessParamTemplate = (id: number) => {
  return request.get({ url: '/mes/pd/process-param-template/get?id=' + id })
}

// 获取工艺参数模板分页
export const getProcessParamTemplatePage = (params) => {
  return request.get({ url: '/mes/pd/process-param-template/page', params })
}

// 导出工艺参数模板 Excel
export const exportProcessParamTemplateExcel = (params) => {
  return request.download({ url: '/mes/pd/process-param-template/export-excel', params })
}

注意事项

  • 快照机制:模板关联工艺参数时,后端会复制参数的当前值到模板明细中。之后修改工艺参数的名称、类型、单位等,不会影响已关联的模板。这是设计上要求的"改变工艺参数列表的值不能影响模板的变化"。
  • 参数编码和模板编码由后端自动生成,前端创建时不需要传入。
  • 工艺参数类型字典:mes_pd_process_param_type(1=文本、2=数值、3=布尔、4=日期)
  • 工艺参数模板类型字典:mes_pd_process_param_template_type(1=通用、2=工序、3=产品)
  • 计量单位下拉框需要调用 MDM 模块的计量单位列表接口获取数据
  • 模板表单中的明细行,选择工艺参数后会自动带出参数编码、名称、类型、单位等信息