入场卷号输入优化

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;