添加物料名称输入建议

src/api/goods.js

@@ -15,6 +15,14 @@ const getPartInfo = (params) => {
     })
 }
 
+const getPartInfoList = (params) => {
+    return request({
+        url: '/goods/getPartInfoList',
+        method: 'post',
+        data: params
+    })
+}
+
 const updateGoodsInfo = (params) => {
     return request({
         url: '/goods/updateGoodsInfo',
@@ -68,5 +76,6 @@ export {
     updatePartInfo,
     queryPartNo,
     deleteCurrentPartInfo,
-    clearGoodsInfo
+    clearGoodsInfo,
+    getPartInfoList
 }

src/components/BindingGoods.vue

@@ -8,19 +8,27 @@
             label-width="100px"
             :model="bindingData"
             require-asterisk-position="right"
-            inline
         >
-          <el-form-item label="载具号：" required>
+          <el-form-item label="载具号：" required label-width="100px">
             <el-input class="form-input" v-model="bindingData.vehicleNo" clearable/>
           </el-form-item>
-          <el-form-item label="零件号：">
-            <el-input class="form-input" v-model="bindingData.goodsId" clearable/>
+          <el-form-item label="零件号：" required>
+            <el-autocomplete
+                style="width: 500px;"
+                v-model="bindingData.goodsId"
+                :fetch-suggestions="querySearch"
+                :trigger-on-focus="false"
+                @select="handleSelect"
+            ></el-autocomplete>
           </el-form-item>
+<!--          <el-form-item label="零件号：">-->
+<!--            <el-input class="form-input" v-model="bindingData.goodsId" clearable/>-->
+<!--          </el-form-item>-->
           <el-form-item label="数量：" >
             <el-input class="form-input" v-model="bindingData.goodsNum" clearable/>
           </el-form-item>
           <el-form-item label="库区选择：" prop="abcSelect" required>
-            <el-select v-model="bindingData.abcSelect" placeholder="请选择" style="width: 100%;">
+            <el-select  v-model="bindingData.abcSelect" placeholder="请选择" style="width: 100px;">
               <el-option label="毛坯区域" value="A"></el-option>
               <el-option label="待置区域" value="B"></el-option>
               <el-option label="半成品区域" value="C"></el-option>
@@ -54,6 +62,7 @@ import {formatterOrderInEnum} from "@/enum/order.in.enum";
 import {formatCellValueTime} from "@/utils/formatter";
 import {ElMessage, ElMessageBox} from "element-plus";
 import apiOrderIn from '@/api/order.in';
+import {getPartInfoList} from "@/api/goods";
 
 export default {
   // import 引入的组件需要注入到对象中才能使用
@@ -63,6 +72,7 @@ export default {
   data() {
     // 这里存放数据
     return {
+      goodsName: '',
       // 绑定表单数据
       bindingData: {
         vehicleNo: '',
@@ -84,6 +94,24 @@ export default {
     test() {
       console.log(this.bindingData);
     },
+    handleSelect(item) {
+
+    },
+   async querySearch(queryString, cb) {
+     const res = await getPartInfoList({goodsName: queryString})
+     let result = []
+     if (res.data.code == 0) {
+       // 调用 callback 返回建议列表的数据
+       result = res.data.data.map(item => {
+         return {
+           "value" : item.goodsName,
+         }
+       })
+     }
+     console.log(result)
+     // 调用 callback 返回建议列表的数据
+     cb(result);
+    },
     // 查看载具的绑定
     addOrderIn() {
       if(this.bindingData.efSelect === 'G') {

src/layout/goods.vue

@@ -25,7 +25,7 @@
             <el-radio :label="scope.row.material" v-model="material">&nbsp;</el-radio>
           </template>
         </el-table-column>
-        <el-table-column prop="goodsId" label="物料号" fixed="left" sortable min-width="120px"/>
+        <el-table-column prop="goodsName" label="物料号" fixed="left" sortable min-width="120px"/>
         <el-table-column prop="goodsUnit" label="规格型号" fixed="left" sortable min-width="120px"/>
         <el-table-column prop="singleWeight" label="单重(kg)" fixed="left" sortable min-width="120px"/>
         <el-table-column prop="remark" label="描述" fixed="left" sortable min-width="120px"/>
@@ -137,9 +137,9 @@ export default {
       this.pageInfo.pageSize = this.pageSize
       const tableRequest = {
         page: this.pageInfo,
-        param: {
-          goodsName: this.queryKey.trim()
-        },
+        // param: {
+        //   goodsName: this.queryKey.trim()
+        // },
       }
       getPartInfo(tableRequest).then(res => {
         const tableResponse = res.data