楼账单院长与居民信息所属房屋加下拉功能

src/views/components/resiForm.vue

@@ -1951,7 +1951,7 @@ export default {
     },
     // 证件号失去焦点事件
     handleValidBlur (item) {
-
+      console.log(item);
       if (item.formName !== 'idNum') return
       if (!isCard(this.form.idNum) && !isPassport(this.form.idNum)) return
       const { user } = this.$store.state

src/views/components/resiSearch.vue

@@ -156,7 +156,9 @@
                          clearable
                          class="u-item-width-communitycascader"
                          @clear="handleClearVillage"
-                         @change="handleChangeV">
+                         @change="handleChangeV"
+                         v-el-select-loadmore="loadmore"
+                         >
                 <el-option v-for="item in optionsV"
                            :key="item.value"
                            :label="item.label"
@@ -516,7 +518,7 @@ export default {
           }
         }
       },
-
+      optionsVPageNo:1
     }
   },
   computed: {
@@ -570,6 +572,23 @@ export default {
       immediate: true
     }
   },
+  directives: {
+    //这个是写到data外面 与mounted同级
+    "el-select-loadmore": {
+      bind(el, binding) {
+        const SELECTWRAP_DOM = el.querySelector(
+          ".el-select-dropdown .el-select-dropdown__wrap"
+        );
+        SELECTWRAP_DOM.addEventListener("scroll", function () {
+          const condition =
+            this.scrollHeight - this.scrollTop <= this.clientHeight;
+          if (condition) {
+            binding.value();
+          }
+        });
+      },
+    },
+  },
   created () {
     // this.initForm()
     // console.log('formcccc---', this.form)
@@ -824,7 +843,10 @@ export default {
           return this.$message.error('网络错误')
         })
     },
-
+    loadmore() {
+      this.optionsVPageNo++;
+      this.getValiheList();
+    },
     getValiheList () {
       const { user } = this.$store.state
       var agencyIdTemp = ''
@@ -844,6 +866,8 @@ export default {
         .post('/actual/base/communityQuarters/listQuartersOptions', {
           gridId: gridIdQuery,
           agencyId: agencyIdQuery,
+          pageNo: this.optionsVPageNo,
+          pageSize:20
           // agencyId: user.agencyId
         })
         .then(({ data: res }) => {
@@ -851,7 +875,7 @@ export default {
             return this.$message.error(res.msg)
           } else {
             console.log('获取查询详情成功', res.data)
-            this.optionsV = res.data
+            this.optionsV = [...this.optionsV, ...res.data];
           }
         })
         .catch(() => {

src/views/modules/base/residentManagement/louzhang/louzhangList.vue

@@ -28,7 +28,9 @@
               <div class="resi-cell-value">
                 <span style="width:100px;text-align: right;padding-right:14px;display: inline-block; ">所属房屋:</span>
                 <el-select v-model.trim="formData.villageId" placeholder="请选择小区" size="small" remote filterable clearable
-                  class="u-item-width-communitycascader" @clear="handleClearVillage" @change="handleChangeV" :remote-method="getValiheList">
+                  class="u-item-width-communitycascader" @clear="handleClearVillage" @change="handleChangeV" :remote-method="getValiheList"
+                  v-el-select-loadmore="loadmore"
+                  >
                   <el-option v-for="item in optionsV" :key="item.value" :label="item.label" :value="item.value">
                   </el-option>
                 </el-select>
@@ -193,6 +195,7 @@ export default {
       pageSize: window.localStorage.getItem("pageSize") || 20,
       total: 1,
 
+      optionsVPageNo:1,
       showAdd: false,
       showEdit: false,
       //   showDetail: false,
@@ -232,8 +235,29 @@ export default {
 
     this.getTableData();
   },
-  methods: {
+  directives: {
+    //这个是写到data外面 与mounted同级
+    "el-select-loadmore": {
+      bind(el, binding) {
+        const SELECTWRAP_DOM = el.querySelector(
+          ".el-select-dropdown .el-select-dropdown__wrap"
+        );
+        SELECTWRAP_DOM.addEventListener("scroll", function () {
+          const condition =
+            this.scrollHeight - this.scrollTop <= this.clientHeight;
+          if (condition) {
+            binding.value();
+          }
+        });
+      },
+    },
+  },
 
+  methods: {
+    loadmore() {
+      this.optionsVPageNo++;
+      this.getValiheList();
+    },
     handleChangeV(val) {
       console.log('小区val', val)
       this.formData.buildId = ''
@@ -250,17 +274,14 @@ export default {
       console.log('单元val', val)
 
     },
-
-
     getValiheList(quarterName) {
-
       this.$http
         .post('/actual/base/communityQuarters/listQuartersOptions', {
           gridId: '',
           agencyId: '',
           neighborHoodName: quarterName,
-          pageNo: 0,
-          // pageSize:
+          pageNo: this.optionsVPageNo,
+          pageSize:20
           // agencyId: user.agencyId
         })
         .then(({ data: res }) => {
@@ -268,7 +289,7 @@ export default {
             return this.$message.error(res.msg)
           } else {
             console.log('获取查询详情成功', res.data)
-            this.optionsV = res.data
+            this.optionsV = [...this.optionsV, ...res.data];
           }
         })
         .catch(() => {

src/views/modules/base/residentManagement/oldPeople/oldPeople.vue

@@ -614,10 +614,10 @@
             .catch((err) => {
               console.log("失败", err);
               file.onError(); //上传失败的文件会从文件列表中删除
-            });
+          });
           this.importLoading = false;
           this.importBtnTitle = "导入";
-    },
+      },
       // 搜索事件
       handleSearch(val) {
         console.log(this.formData);