场所模块搜索功能完善，场所录入宗教和公安管理人员显示

src/main.js

@@ -9,7 +9,7 @@ import axios from 'axios';
 import dictUtils from '@/utils/dictUtils'
 
 
-import { NavBar, Button, Form, Field, CellGroup, Tabbar, TabbarItem, Icon, Toast, Image as VanImage, Grid, GridItem, Row, Col, Tab, Tabs, Popup, PickerGroup, DatePicker, TimePicker, Picker, Uploader, Dialog, List, Cell, Cascader, Search, RadioGroup, Radio, DropdownMenu, DropdownItem, SwipeCell, Checkbox, CheckboxGroup, Swipe, SwipeItem, Loading, TextEllipsis } from 'vant';
+import { NavBar, Button, Form, Field, CellGroup, Tabbar, TabbarItem, Icon, Toast, Image as VanImage, Grid, GridItem, Row, Col, Tab, Tabs, Popup, PickerGroup, DatePicker, TimePicker, Picker, Uploader, Dialog, List, Cell, Cascader, Search, RadioGroup, Radio, DropdownMenu, DropdownItem, SwipeCell, Checkbox, CheckboxGroup, Swipe, SwipeItem, Loading, TextEllipsis, TreeSelect } from 'vant';
 import 'vant/lib/index.css';
 import store from './store';
 
@@ -54,7 +54,7 @@ app.use(router)
     .use(SwipeItem)
     .use(Loading)
     .use(TextEllipsis)
-
+    .use(TreeSelect)
 app.config.globalProperties.$API = api
 app.config.globalProperties.$axios = axios
 app.config.globalProperties.$dictUtils = dictUtils

src/views/placeManage/ManageList.vue

@@ -1,5 +1,51 @@
 <template>
   <div class="personList">
+    <div class="nav-left">
+      <p style="font-size: 16px; color: #00bfff">请选择左侧部门机构！</p>
+      <ul>
+        <li v-for="item in items" v-bind:key="item.id">
+          <a @click="clickonlod(item.id)">{{ item.name }}</a>
+          <ul v-if="item.children">
+            <li
+              style="padding-left: 5px"
+              v-for="subitem in item.children"
+              v-bind:key="subitem.id"
+            >
+              <a @click="clickonlod(subitem.id)">{{ subitem.name }}</a>
+              <ul v-if="subitem.children">
+                <li
+                  style="padding-left: 5px"
+                  v-for="subitem2 in subitem.children"
+                  v-bind:key="subitem2.id"
+                >
+                  <a @click="clickonlod(subitem2.id)">{{ subitem2.name }}</a>
+                  <ul v-if="subitem2.children">
+                    <li
+                      style="padding-left: 5px"
+                      v-for="subitem3 in subitem2.children"
+                      v-bind:key="subitem3.id"
+                    >
+                      <a @click="clickonlod(subitem3.id)">{{ subitem3.name }}</a>
+                      <ul v-if="subitem3.children">
+                        <li
+                          style="padding-left: 5px"
+                          v-for="subitem4 in subitem3.children"
+                          v-bind:key="subitem4.id"
+                        >
+                          <a @click="clickonlod(subitem4.id)">{{
+                            subitem4.name
+                          }}</a>
+                        </li>
+                      </ul>
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+            </li>
+          </ul>
+        </li>
+      </ul>
+    </div>
     <van-list
       v-model:loading="loading"
       :finished="finished"
@@ -22,148 +68,90 @@
         </van-cell-group>
       </van-radio-group>
     </van-list>
+    <!-- <van-list
+      v-model:loading="loading2"
+      :finished="finished2"
+      finished-text="没有更多了"
+      @load="onLoad2"
+    >
+      <van-radio-group v-model="checked">
+        <van-cell-group inset>
+          <van-cell
+            v-for="item in list4"
+            clickable
+            :key="item"
+            :title="item.name"
+            @click="selectes(item)"
+          >
+            <template #right-icon>
+              <van-radio :name="item" />
+            </template>
+          </van-cell>
+        </van-cell-group>
+      </van-radio-group>
+    </van-list> -->
   </div>
 </template>
 
 <script>
-import { ref, watch } from "vue";
+import { ref } from "vue";
 import placeRegister from "@/api/placeRegister/placeRegister";
 export default {
   name: "personList",
   emits: ["selected"],
-  props: [ "placeAddress"],
-  setup(props, { emit }) {
-    const list = ref([]);
+  setup(props,{ emit }) {
     const list3 = ref([]);
+    const list4 = ref([]);
     const loading = ref(false);
     const finished = ref(false);
     let index = 0;
-    let zjList = ref([]);
-    let mechanism1 = ref([]); //宗教
+    let items = ref([]);
     new placeRegister().treeDate2().then((res) => {
-      mechanism1.value.push(res[0]);
-      Getzj(mechanism1.value);
+      items.value.push(res[0]);
     });
-
-    const onLoad = () => {
-      // 异步更新数据
+    const clickonlod = (id)=>{
+      list3.value = [];
+      onLoad(id)
+    }
+    const onLoad = (id) => {
+      if(id!=undefined){
+        // 异步更新数据
       new placeRegister()
         .list({
           current: index + 1,
           size: 10,
+          "officeDTO.id": id,
         })
-        .then(({ records }) => {
-          list.value.push(...records);
+        .then(({ records, pages }) => {
+          list3.value = list3.value.concat(records);
           // 加载状态结束
           loading.value = false;
-          index++;
           // 数据全部加载完成
-          if (records.length < 10) {
+          if (index + 1 >= pages) {
             finished.value = true;
           }
+          index++;
         });
-      let placeAddress = "";
-      placeAddress = props.placeAddress.split("/");
-      let itemId = [];
-      let listTwo = [];
-      zjList.value.forEach((item1) => {
-        if (item1.regionLevel5 == placeAddress[2]) {
-          itemId.push(item1.id);
-        }
-      });
-      itemId.forEach((N1) => {
-        if (!listTwo.includes(N1)) {
-          listTwo.push(N1);
-        }
-      });
-      list.value.forEach((item2) => {
-        listTwo.forEach((ID) => {
-          if (ID == item2.officeDTO.id) {
-            list3.value.push(item2);
-          }
-        });
-      });
-      let listOne = [];
-      list3.value.forEach((N2)=>{
-        if(!listOne.includes(N2)){
-          listOne.push(N2)
-        }
-      })
-      list3.value = listOne
+      }
     };
-    //获取宗教部门数组
-    function Getzj(list) {
-      list.forEach((item) => {
-        zjList.value.push(item);
-        if (item.children) {
-          Getzj(item.children);
-        }
-      });
-    }
-    const close = ()=>{
-      list3.value.splice(0,list3.value.length);
-    }
-    //获取公安部门数组
-    // function Getga(list) {
-    //   list.forEach((item) => {
-    //     gaList.value.push(item);
-    //     if (item.children) {
-    //       Getga(item.children);
-    //     }
-    //   });
-    // }
     // 选择人员
     const checked = ref([]);
     const checkboxRefs = ref([]);
     const checkboxGroup = ref(null);
     const toggle = (index) => {
       checkboxRefs.value[index].toggle();
-      emit("selected",checked.value);
+      emit("selected", checked.value);
     };
     // 全选
     const checkAll = () => {
       checkboxGroup.value.toggleAll(true);
-      emit("selected",checked.value);
+      emit("selected", checked.value);
     };
     const selectes = (val) => {
       checked.value = val;
-      emit("selected",checked.value);
+      emit("selected", checked.value);
     };
 
-    // let placeAddress = "";
-    // watch(
-    //   () => props.placeAddress,
-    //   (val) => {
-    //     placeAddress = val.split("/");
-    //     let mechanism1 = ref([]); //宗教
-    //     new placeRegister().treeDate2().then((res) => {
-    //       mechanism1.value.push(res[0]);
-    //       Getzj(mechanism1.value);
-    //       let listone = [];
-    //       zjList.value.forEach((item1) => {
-    //         let itemId = '';
-    //         if (item1.regionLevel5 == placeAddress[2]) {
-    //           itemId = item1.id;
-    //           list.value.forEach((item2) => {
-    //             if (itemId == item2.officeDTO.id) {
-    //               listone.push(item2);
-    //             }
-    //           });
-    //           list3.value = listone;
-    //         }
-    //       });
-    //     });
-    //   },
-    //   {
-    //     //如果加了这个参数，值为true的话，就消除了惰性，watch会在创建后立即执行一次
-    //     //那么首次执行，val为默认值,preVal为undefined
-    //     immediate: true,
-    //     //这个参数代表监听对象时，可以监听深度嵌套的对象属性
-    //     //比如message是一个对象的话，可以监听到message.a.b.c，也就是message下的所有属性
-    //     deep: true,
-    //   }
-    // );
-
     return {
       // 人员
       onLoad,
@@ -178,17 +166,34 @@ export default {
       // 单选
       selectes,
       list3,
-      close
+      list4,
+      items,
+      clickonlod,
     };
   },
 };
 </script>
 
-<style scoped>
+<style lang="less" scoped>
 .personList {
   height: 65vh;
   overflow: auto;
   margin: 10px;
+  .nav-left {
+    float: left;
+    width: 50%;
+    font-size: 16px;
+    border-right: 1px solid #a3a3a3;
+    li {
+      width: 100%;
+      overflow: hidden;
+      padding: 5px 0;
+      a {
+        width: 100%;
+        border-bottom: 1px solid #a3a3a3;
+      }
+    }
+  }
 }
 .van-button {
   top: -5px;

src/views/placeManage/ManageList2.vue

@@ -1,5 +1,53 @@
 <template>
   <div class="personList">
+    <div class="nav-left">
+      <p style="font-size: 16px; color: #00bfff">请选择左侧部门机构！</p>
+      <ul>
+        <li v-for="item in items" v-bind:key="item.id">
+          <a @click="clickonlod(item.id)">{{ item.name }}</a>
+          <ul v-if="item.children">
+            <li
+              style="padding-left: 5px"
+              v-for="subitem in item.children"
+              v-bind:key="subitem.id"
+            >
+              <a @click="clickonlod(subitem.id)">{{ subitem.name }}</a>
+              <ul v-if="subitem.children">
+                <li
+                  style="padding-left: 5px"
+                  v-for="subitem2 in subitem.children"
+                  v-bind:key="subitem2.id"
+                >
+                  <a @click="clickonlod(subitem2.id)">{{ subitem2.name }}</a>
+                  <ul v-if="subitem2.children">
+                    <li
+                      style="padding-left: 5px"
+                      v-for="subitem3 in subitem2.children"
+                      v-bind:key="subitem3.id"
+                    >
+                      <a @click="clickonlod(subitem3.id)">{{
+                        subitem3.name
+                      }}</a>
+                      <ul v-if="subitem3.children">
+                        <li
+                          style="padding-left: 5px"
+                          v-for="subitem4 in subitem3.children"
+                          v-bind:key="subitem4.id"
+                        >
+                          <a @click="clickonlod(subitem4.id)">{{
+                            subitem4.name
+                          }}</a>
+                        </li>
+                      </ul>
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+            </li>
+          </ul>
+        </li>
+      </ul>
+    </div>
     <van-list
       v-model:loading="loading"
       :finished="finished"
@@ -9,7 +57,7 @@
       <van-radio-group v-model="checked">
         <van-cell-group inset>
           <van-cell
-            v-for="item in list4"
+            v-for="item in list3"
             clickable
             :key="item"
             :title="item.name"
@@ -22,128 +70,88 @@
         </van-cell-group>
       </van-radio-group>
     </van-list>
+    <!-- <van-list
+      v-model:loading="loading2"
+      :finished="finished2"
+      finished-text="没有更多了"
+      @load="onLoad2"
+    >
+      <van-radio-group v-model="checked">
+        <van-cell-group inset>
+          <van-cell
+            v-for="item in list4"
+            clickable
+            :key="item"
+            :title="item.name"
+            @click="selectes(item)"
+          >
+            <template #right-icon>
+              <van-radio :name="item" />
+            </template>
+          </van-cell>
+        </van-cell-group>
+      </van-radio-group>
+    </van-list> -->
   </div>
 </template>
 
 <script>
-import { ref, watch } from "vue";
+import { ref } from "vue";
 import placeRegister from "@/api/placeRegister/placeRegister";
 export default {
   name: "personList",
   emits: ["selected2"],
-  props: [ "placeAddress"],
   setup(props, { emit }) {
-    const list = ref([]);
-    const list4 = ref([]);
+    const list3 = ref([]);
     const loading = ref(false);
     const finished = ref(false);
     let index = 0;
-    let gaList = ref([]);
-    let placeAddress = "";
-    placeAddress = props.placeAddress.split("/");
-    let mechanism2 = ref([]); //公安
+    let items = ref([]);
     new placeRegister().treeDate2().then((res) => {
-      mechanism2.value.push(res[1]);
-      Getga(mechanism2.value);
+      items.value.push(res[1]);
     });
-    const onLoad = () => {
-      // 异步更新数据
-      new placeRegister()
-        .list({
-          current: index + 1,
-          size: 10,
-        })
-        .then(({ records }) => {
-          list.value.push(...records);
-          // 加载状态结束
-          loading.value = false;
-          index++;
-          // console.log(list.value);
-          // 数据全部加载完成
-          if (records.length < 10) {
-            finished.value = true;
-          }
-        });
-      let itemId = [];
-      let listTwo = [];
-      gaList.value.forEach((item3) => {
-        if (item3.regionLevel5 == placeAddress[2]) {
-          itemId.push(item3.id);
-        }
-      });
-      itemId.forEach((N1) => {
-        if (!listTwo.includes(N1)) {
-          listTwo.push(N1);
-        }
-      });
-      list.value.forEach((item2) => {
-        itemId.forEach((ID) => {
-          if (ID == item2.officeDTO.id) {
-            list4.value.push(item2);
-          }
-        });
-      });
-      let listOne = [];
-      list4.value.forEach((N2) => {
-        if (!listOne.includes(N2)) {
-          listOne.push(N2);
-        }
-      });
-      list4.value = listOne;
+    const clickonlod = (id) => {
+      list3.value = [];
+      onLoad(id);
+    };
+    const onLoad = (id) => {
+      if (id != undefined) {
+        // 异步更新数据
+        new placeRegister()
+          .list({
+            current: index + 1,
+            size: 10,
+            "officeDTO.id": id,
+          })
+          .then(({ records, pages }) => {
+            list3.value = list3.value.concat(records);
+            // 加载状态结束
+            loading.value = false;
+            // 数据全部加载完成
+            if (index + 1 >= pages) {
+              finished.value = true;
+            }
+            index++;
+          });
+      }
     };
-    //获取公安部门数组
-    function Getga(list) {
-      list.forEach((item) => {
-        gaList.value.push(item);
-        if (item.children) {
-          Getga(item.children);
-        }
-      });
-    }
-    //获取宗教部门数组
-    // function Getzj(list) {
-    //   list.forEach((item) => {
-    //     zjList.value.push(item);
-    //     if (item.children) {
-    //       Getzj(item.children);
-    //     }
-    //   });
-    // }
-
     // 选择人员
     const checked = ref([]);
     const checkboxRefs = ref([]);
     const checkboxGroup = ref(null);
     const toggle = (index) => {
       checkboxRefs.value[index].toggle();
-      emit("selected2", checked.value);
+      emit("selected", checked.value);
     };
     // 全选
     const checkAll = () => {
       checkboxGroup.value.toggleAll(true);
-      emit("selected2", checked.value);
+      emit("selected", checked.value);
     };
     const selectes2 = (val) => {
-      // console.log(val);
       checked.value = val;
       emit("selected2", checked.value);
     };
-    // let placeAddress = "";
-    // watch(
-    //   () => props.placeAddress,
-    //   (val) => {
-    //     placeAddress = val.split("/");
-
-    //   },
-    //   {
-    //     //如果加了这个参数，值为true的话，就消除了惰性，watch会在创建后立即执行一次
-    //     //那么首次执行，val为默认值,preVal为undefined
-    //     immediate: true,
-    //     //这个参数代表监听对象时，可以监听深度嵌套的对象属性
-    //     //比如message是一个对象的话，可以监听到message.a.b.c，也就是message下的所有属性
-    //     deep: true,
-    //   }
-    // );
 
     return {
       // 人员
@@ -158,17 +166,34 @@ export default {
       checkboxGroup,
       // 单选
       selectes2,
-      list4,
+      list3,
+      items,
+      clickonlod,
     };
   },
 };
 </script>
 
-<style scoped>
+<style lang="less" scoped>
 .personList {
   height: 65vh;
   overflow: auto;
   margin: 10px;
+  .nav-left {
+    float: left;
+    width: 50%;
+    font-size: 16px;
+    border-right: 1px solid #a3a3a3;
+    li {
+      width: 100%;
+      overflow: hidden;
+      padding: 5px 0;
+      a {
+        width: 100%;
+        border-bottom: 1px solid #a3a3a3;
+      }
+    }
+  }
 }
 .van-button {
   top: -5px;

src/views/placeManage/placePerson/placePerson.vue

@@ -14,22 +14,14 @@
   <div class="main">
     <van-tabs v-model:active="active">
       <van-tab title="姓名查询">
-        <van-search
-          v-model="value1"
-          show-action
-          placeholder="请输入姓名"
-        >
+        <van-search v-model="value1" show-action placeholder="请输入姓名">
           <template #action>
             <div @click="search1">搜索</div>
           </template>
         </van-search>
       </van-tab>
       <van-tab title="身份证查询">
-        <van-search
-          v-model="value2"
-          show-action
-          placeholder="请输入身份证号"
-        >
+        <van-search v-model="value2" show-action placeholder="请输入身份证号">
           <template #action>
             <div @click="search2">搜索</div>
           </template>
@@ -97,7 +89,7 @@
         </van-list>
       </van-pull-refresh>
     </div>
-    <div class="PersonList" v-if="value1 != '' || value2!='' ">
+    <div class="PersonList" v-if="value1 != '' || value2 != ''">
       <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
         <van-list
           v-model:loading="loading"
@@ -236,24 +228,36 @@ export default {
     //搜索选择
     const value1 = ref("");
     const value2 = ref("");
-    const search1 = ()=>{
-      new UserManage().list({
-            current:1,
-            size:10000,
-            name:value1.value
-          }).then((res)=>{
-            PersonList.value = res.records
-          })
-    }
-    const search2 = ()=>{
-      new UserManage().list({
-            current:1,
-            size:10000,
-            idcard:value2.value
-          }).then((res)=>{
-            PersonList.value = res.records
-          })
-    }
+    const search1 = () => {
+      loading.value = true;
+      finished.value = false;
+      new UserManage()
+        .list({
+          current: 1,
+          size: 10000,
+          name: value1.value,
+        })
+        .then(({ records, pages }) => {
+          PersonList.value = PersonList.value.concat(records);
+          // 加载状态结束
+          loading.value = false;
+          if (index + 1 >= pages) {
+            finished.value = true;
+          }
+          index++;
+        });
+    };
+    const search2 = () => {
+      new UserManage()
+        .list({
+          current: 1,
+          size: 10000,
+          idcard: value2.value,
+        })
+        .then((res) => {
+          PersonList.value = res.records;
+        });
+    };
     //返回
     const onClickLeft = () => {
       history.back();

src/views/placeManage/placeRegister/placeRegister.vue

@@ -654,11 +654,11 @@
       title="宗教部门管理人员"
       show-cancel-button
       @confirm="reselected"
+      width="100%"
     >
       <manage-list
         @selected="selected"
         :type="0"
-        :placeAddress="placeAddress"
       ></manage-list>
     </van-dialog>
     <!-- 公安部门人员 -->
@@ -667,10 +667,10 @@
       title="公安部门管理人员"
       show-cancel-button
       @confirm="reselected2"
+      width="100%"
     >
       <manage-list-2
         @selected2="selected2"
-        :placeAddress="placeAddress"
       ></manage-list-2>
     </van-dialog>
     <!-- 直播类型 -->

src/views/placeManage/placeRegister/placeRegisterInfo.vue

@@ -659,11 +659,11 @@
       title="宗教部门管理人员"
       show-cancel-button
       @confirm="reselected"
+      width="100%"
     >
       <manage-list
         @selected="selected"
         :type="0"
-        :placeAddress="placeAddress"
       ></manage-list>
     </van-dialog>
     <!-- 公安部门人员 -->
@@ -672,10 +672,10 @@
       title="公安部门管理人员"
       show-cancel-button
       @confirm="reselected2"
+      width="100%"
     >
       <manage-list-2
         @selected2="selected2"
-        :placeAddress="placeAddress"
       ></manage-list-2>
     </van-dialog>
     <!-- 直播类型 -->

src/views/placeManage/placeRegister/placeRegisterList.vue

@@ -40,7 +40,7 @@
           placeholder="请输入场所名称"
         >
           <template #action>
-            <div @click="search">搜索</div>
+            <div @click="search1">搜索</div>
           </template>
         </van-search>
       </div>
@@ -161,9 +161,16 @@ export default {
     //搜索事件
     const show = ref(false);
     const searchList = ref([]);
+
+    const search1 = () => {
+      searchList.value = [];
+      search();
+    }
+
     const search = () => {
       loading.value = true;
       finished.value = false;
+      // searchList.value = [];
       if (value2.value == 0) {
         show.value = true;
         new PlaceRegister()
@@ -183,10 +190,11 @@ export default {
             index++;
           });
       } else {
+        show.value = true;
         new PlaceRegister()
           .searchlist({
             current: index + 1,
-          size: 11,
+            size: 11,
             name: value.value,
             address: value1.value,
             religiousType: value2.value,
@@ -321,6 +329,7 @@ export default {
       value2,
       option1,
       option2,
+      search1,
     };
   },
 };

src/views/placeManage/placeTablet/placeTablet.vue

@@ -51,10 +51,10 @@
     </van-pull-refresh>
     <van-pull-refresh v-if="show==false" v-model="refreshing" @refresh="onRefresh">
       <van-list
-        v-model:loading="loading"
-        :finished="finished"
+        v-model:loading="loading1"
+        :finished="finished1"
         finished-text="没有更多了"
-        @load="onLoad"
+        @load="search"
       >
         <van-swipe-cell v-for="item in searchList" :key="item">
           <div class="list-item" @click="goTabletInfo(item)">
@@ -91,14 +91,25 @@ export default {
     const show = ref(true)
     const searchName = ref("");
     const searchList = ref([]);
+    const loading1 = ref(false);
+    const finished1 = ref(false);
+    const refreshing1 = ref(false);
+    let index1 = 0;
     const search = () => {
       show.value = false
+      loading1.value = true;
+      finished1.value = false;
       new TabletServer().list({
-        current:1,
-        size:10000,
+        current:index1 + 1,
+        size:11,
         brandName:searchName.value
-      }).then((res)=>{
-        searchList.value = res.records
+      }).then(({records,pages})=>{
+        searchList.value = searchList.value.concat(records)
+        loading1.value = false;
+          if (index1 + 1 >= pages) {
+            finished1.value = true;
+          }
+          index1++;
       })
     };
 
@@ -160,6 +171,10 @@ export default {
       refreshing,
       onLoad,
       onRefresh,
+      loading1,
+      finished1,
+      refreshing1,
+      onRefresh,
       goTabletInfo,
       selectColor,
       //搜索