1

src/components/byTable/index.vue

@@ -231,7 +231,14 @@
 import { isFunction as isFn, isBoolean } from "./type";
 import ElementsMapping from "./ElementsMapping";
 import ComponentsMapping from "./ComponentsMapping";
-import { computed, defineComponent, getCurrentInstance, ref, watch } from "vue";
+import {
+  computed,
+  defineComponent,
+  getCurrentInstance,
+  nextTick,
+  ref,
+  watch,
+} from "vue";
 import expand from "./expand";
 import Sortable from "sortablejs";
 export default defineComponent({
@@ -364,7 +371,10 @@ export default defineComponent({
     });
     let isMore = ref(true);
     const changeStatData = () => {
-      statWarpHeight.value = document.getElementById("statWarp").offsetHeight;
+      nextTick(() => {
+        statWarpHeight.value = document.getElementById("statWarp").offsetHeight;
+        console.log(statWarpHeight.value, "awda");
+      });
     };
     let statWarpHeight = ref(0);
     watch(

src/views/EHSD/productLibrary/customerProduct/index.vue

@@ -87,6 +87,31 @@
           :rules="rules"
           ref="byform"
         >
+          <template #customerId>
+            <div>
+              <el-select
+                v-model="formData.data.customerId"
+                filterable
+                remote
+                reserve-keyword
+                placeholder="请输入关键字"
+                remote-show-suffix
+                :remote-method="remoteMethod"
+                :loading="loadingSearch"
+                @input="remoteMethod"
+                v-if="modalType == 'add'"
+              >
+                <el-option
+                  v-for="item in customerData"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+              <el-select v-model="formData.data.customerName" disabled v-else>
+              </el-select>
+            </div>
+          </template>
           <template #productPic>
             <div>
               <el-upload
@@ -364,17 +389,22 @@ const formConfig = computed(() => {
       type: "title",
       title: "客户信息",
     },
+    // {
+    //   type: "select",
+    //   prop: modalType.value == "add" ? "customerId" : "customerName",
+    //   label: "客户名称",
+    //   required: true,
+    //   itemWidth: 100,
+    //   data: customerData.value,
+    //   style: {
+    //     width: "50%",
+    //   },
+    //   disabled: false,
+    // },
     {
-      type: "select",
-      prop: "customerId",
+      type: "slot",
+      slotName: "customerId",
       label: "客户名称",
-      required: true,
-      itemWidth: 100,
-      data: customerData.value,
-      style: {
-        width: "50%",
-      },
-      disabled: false,
     },
     {
       type: "title",
@@ -799,17 +829,17 @@ const handleSuccess = (res) => {
   }
 };
 const getDict = () => {
-  proxy.post("/customer/page", { pageNum: 1, pageSize: 9999 }).then(
-    (res) => {
-      customerData.value = res.rows.map((x) => ({
-        label: x.name,
-        value: x.id,
-      }));
-    },
-    (err) => {
-      console.log(err);
-    }
-  );
+  // proxy.post("/customer/page", { pageNum: 1, pageSize: 99999 }).then(
+  //   (res) => {
+  //     customerData.value = res.rows.map((x) => ({
+  //       label: x.name,
+  //       value: x.id,
+  //     }));
+  //   },
+  //   (err) => {
+  //     console.log(err);
+  //   }
+  // );
   proxy
     .getDictOne([
       "inner_packaging_method_ehsd",
@@ -842,6 +872,26 @@ getList();
 const clickSelect = (item) => {
   proxy.$emit("selectProduct", item);
 };
+const loadingSearch = ref(false);
+const remoteMethod = (keyword) => {
+  loadingSearch.value = true;
+  if (keyword && typeof keyword === "string") {
+    proxy.post("/customer/page", { keyword }).then(
+      (res) => {
+        customerData.value = res.rows.map((x) => ({
+          label: x.name,
+          value: x.id,
+        }));
+        setTimeout(() => {
+          loadingSearch.value = false;
+        }, 100);
+      },
+      (err) => {
+        console.log(err);
+      }
+    );
+  }
+};
 </script>
 
 <style lang="scss" scoped>