入场卷号输入优化

2026-05-23 11:53:05 +08:00
parent a81032dedf
commit 40067a3680
3 changed files with 130 additions and 11 deletions
--- a/klp-ui/src/views/mes/qc/certificate/chemistry.vue
+++ b/klp-ui/src/views/mes/qc/certificate/chemistry.vue
@@ -121,10 +121,14 @@
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="入场钢卷号" prop="coilNo">
-          <el-input v-model="form.coilNo" placeholder="请输入入场钢卷号" />
-          <!-- <coil-selector :use-trigger="true" @select="handleSelect"
-            :filters="{ selectType: 'product', status: 0, dataType: 1 }" /> -->
-          <!-- <el-input v-model="form.coilNo" placeholder="自动填写" /> -->
+          <el-autocomplete
+            v-model="form.coilNo"
+            :fetch-suggestions="queryCoilNo"
+            placeholder="请输入入场钢卷号（输入2个字符以上自动搜索）"
+            :loading="coilNoLoading"
+            :trigger-on-focus="false"
+            clearable
+          />
        </el-form-item>
        <el-form-item label="炉号" prop="heatNo">
          <el-input v-model="form.heatNo" placeholder="请输入炉号" />
@@ -258,6 +262,7 @@
 import * as XLSX from 'xlsx';
 import { listChemicalItem, getChemicalItem, delChemicalItem, addChemicalItem, updateChemicalItem, batchAddChemicalItem } from "@/api/mes/qc/chemicalItem";
 import CoilSelector from "@/components/CoilSelector";
+import { listMaterialCoil } from "@/api/wms/coil";

 const CHEMI_TEMPLATE_HEADERS = ['入场钢卷号', 'C(%)', 'Si(%)', 'Mn(%)', 'P(%)', 'S(%)', 'Als(%)'];

@@ -331,7 +336,9 @@ export default {
      importStatus: 'idle', // idle | validated | matched | processing | finished | error
      importErrorMsg: '',
      importValidateLoading: false,
-      importLoading: false
+      importLoading: false,
+      coilNoOptions: [],
+      coilNoLoading: false,
    };
  },
  created() {
@@ -399,6 +406,26 @@ export default {
    handleSelect(coil) {
      this.form.coilNo = coil.enterCoilNo;
    },
+    queryCoilNo(queryString, cb) {
+      if (!queryString || queryString.length < 2) {
+        cb([]);
+        return;
+      }
+      this.coilNoLoading = true;
+      listMaterialCoil({
+        enterCoilNo: queryString,
+        pageNum: 1,
+        pageSize: 20
+      }).then(response => {
+        const options = (response.rows || []).map(item => ({
+          value: item.enterCoilNo,
+          label: item.enterCoilNo
+        }));
+        cb(options);
+      }).finally(() => {
+        this.coilNoLoading = false;
+      });
+    },
    handleBatchAdd(rows) {
      this.loading = true;
      this.buttonLoading = true;
--- a/klp-ui/src/views/mes/qc/certificate/physics.vue
+++ b/klp-ui/src/views/mes/qc/certificate/physics.vue
@@ -171,9 +171,14 @@
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-form-item label="入场钢卷号" prop="coilNo">
-          <!-- <coil-selector :use-trigger="true" @select="handleSelect"
-            :filters="{ selectType: 'product', status: 0, dataType: 1 }" /> -->
-          <el-input v-model="form.coilNo" placeholder="请输入入场钢卷号" />
+          <el-autocomplete
+            v-model="form.coilNo"
+            :fetch-suggestions="queryCoilNo"
+            placeholder="请输入入场钢卷号（输入2个字符以上自动搜索）"
+            :loading="coilNoLoading"
+            :trigger-on-focus="false"
+            clearable
+          />
        </el-form-item>
        <el-form-item label="屈服强度(MPa)" prop="yieldStrength">
          <el-input v-model="form.yieldStrength" placeholder="请输入屈服强度(MPa)" />
@@ -312,6 +317,7 @@
 import * as XLSX from 'xlsx';
 import { listPhysicalItem, getPhysicalItem, delPhysicalItem, addPhysicalItem, updatePhysicalItem, batchAddPhysicalItem } from "@/api/mes/qc/physicalItem";
 import CoilSelector from "@/components/CoilSelector";
+import { listMaterialCoil } from "@/api/wms/coil";

 const PHYS_TEMPLATE_HEADERS = [
  '当前钢卷号', '屈服强度(MPa)', '抗拉强度(MPa)', '伸长率(%)', '硬度(HRB)', '弯曲试验',
@@ -391,7 +397,9 @@ export default {
      importStatus: 'idle', // idle | validated | matched | processing | finished | error
      importErrorMsg: '',
      importValidateLoading: false,
-      importLoading: false
+      importLoading: false,
+      coilNoOptions: [],
+      coilNoLoading: false,
    };
  },
  created() {
@@ -460,6 +468,26 @@ export default {
    handleSelect(coil) {
      this.form.coilNo = coil.enterCoilNo;
    },
+    queryCoilNo(queryString, cb) {
+      if (!queryString || queryString.length < 2) {
+        cb([]);
+        return;
+      }
+      this.coilNoLoading = true;
+      listMaterialCoil({
+        enterCoilNo: queryString,
+        pageNum: 1,
+        pageSize: 20
+      }).then(response => {
+        const options = (response.rows || []).map(item => ({
+          value: item.enterCoilNo,
+          label: item.enterCoilNo
+        }));
+        cb(options);
+      }).finally(() => {
+        this.coilNoLoading = false;
+      });
+    },
    handleBatchAdd(rows) {
      this.loading = true;
      this.buttonLoading = true;
--- a/klp-ui/src/views/mes/qc/inspection/task.vue
+++ b/klp-ui/src/views/mes/qc/inspection/task.vue
@@ -246,7 +246,25 @@
          <el-input v-model="taskForm.taskCode" placeholder="请输入任务编号" />
        </el-form-item>
        <el-form-item label="入场卷号" prop="enterCoilNos">
-          <el-input v-model="taskForm.enterCoilNos" placeholder="请输入入场卷号" />
+          <div style="display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px;">
+            <el-tag
+              v-for="(coilNo, index) in selectedEnterCoilNos"
+              :key="index"
+              closable
+              @close="removeEnterCoilNo(index)"
+            >
+              {{ coilNo }}
+            </el-tag>
+          </div>
+          <el-autocomplete
+            v-model="tempEnterCoilNo"
+            :fetch-suggestions="queryEnterCoilNo"
+            placeholder="2个字符以上自动搜索"
+            :loading="enterCoilNoLoading"
+            :trigger-on-focus="false"
+            clearable
+            @select="handleSelectEnterCoilNo"
+          />
        </el-form-item>
        <el-form-item label="任务类型" prop="taskType">
          <el-select v-model="taskForm.taskType" placeholder="请选择任务类型" clearable filterable allow-create>
@@ -358,7 +376,7 @@ import { listInspectionItemTemplate } from "@/api/mes/qc/inspectionItemTemplate"
 import { SchemeSelect } from "@/components/KLPService";
 import CoilSelector from "@/components/CoilSelector/index.vue";
 import CurrentCoilNo from "@/components/KLPService/Renderer/CurrentCoilNo.vue";
-import { listCoilByIds } from "@/api/wms/coil";
+import { listCoilByIds, listMaterialCoil } from "@/api/wms/coil";

 export default {
  name: "InspectionTask",
@@ -449,6 +467,10 @@ export default {
      schemeOptions: [],
      selectedCompany: '',
      selectedScheme: '',
+      enterCoilNoOptions: [],
+      enterCoilNoLoading: false,
+      selectedEnterCoilNos: [],
+      tempEnterCoilNo: '',
    };
  },
  computed: {
@@ -506,6 +528,8 @@ export default {
    },
    handleTaskAdd() {
      this.resetTaskForm();
+      this.selectedEnterCoilNos = [];
+      this.tempEnterCoilNo = '';
      this.taskOpen = true;
      this.taskTitle = "添加检验任务";
    },
@@ -522,6 +546,13 @@ export default {
            this.taskCoilList = res.rows || [];
          });
        }
+        // 初始化已选择的入场卷号
+        if (response.data.enterCoilNos) {
+          this.selectedEnterCoilNos = response.data.enterCoilNos.split(',').filter(item => item.trim());
+        } else {
+          this.selectedEnterCoilNos = [];
+        }
+        this.tempEnterCoilNo = '';
        this.taskLoading = false;
        this.taskOpen = true;
        this.taskTitle = "修改检验任务";
@@ -667,6 +698,37 @@ export default {
      this.taskQueryParams.schemeName = this.selectedScheme || undefined;
      this.handleTaskQuery();
    },
+    queryEnterCoilNo(queryString, cb) {
+      if (!queryString || queryString.length < 2) {
+        cb([]);
+        return;
+      }
+      this.enterCoilNoLoading = true;
+      listMaterialCoil({
+        enterCoilNo: queryString,
+        pageNum: 1,
+        pageSize: 20
+      }).then(response => {
+        const options = (response.rows || []).map(item => ({
+          value: item.enterCoilNo,
+          label: item.enterCoilNo
+        })).filter(opt => !this.selectedEnterCoilNos.includes(opt.value));
+        cb(options);
+      }).finally(() => {
+        this.enterCoilNoLoading = false;
+      });
+    },
+    handleSelectEnterCoilNo(item) {
+      if (!this.selectedEnterCoilNos.includes(item.value)) {
+        this.selectedEnterCoilNos.push(item.value);
+      }
+      this.tempEnterCoilNo = '';
+      this.taskForm.enterCoilNos = this.selectedEnterCoilNos.join(',');
+    },
+    removeEnterCoilNo(index) {
+      this.selectedEnterCoilNos.splice(index, 1);
+      this.taskForm.enterCoilNos = this.selectedEnterCoilNos.join(',');
+    },
    cancelTask() {
      this.taskOpen = false;
      this.resetTaskForm();
@@ -695,6 +757,8 @@ export default {
        updateBy: undefined
      };
      this.taskCoilList = [];
+      this.selectedEnterCoilNos = [];
+      this.tempEnterCoilNo = '';
      this.resetForm("taskForm");
    },