新增查询条件

张红振
1 parent 65e404ec
Showing 2 changed files with 149 additions and 12 deletions
src/views/community/housekeeper/index.vue
src/views/community/houses/index.vue
 <script setup lang="ts">
 import { reactive, onMounted, ref, getCurrentInstance, watchEffect } from "vue";
 import { getTableList, deleteBuilding } from "@/api/community/housekeeper.ts";
+import * as residence from "@/api/community/residence.ts";
 import { parseTime } from "@/utils/tool.ts";
 import HouseDetail from "./houseDetail.vue";
 import ChangeAdmin from "./changeAdmin.vue";
@@ -29,6 +30,7 @@ const data = reactive({
   loading: false,
   title: "新增楼宇",
   formObj: {},
+  communityList: [],
 });
 // 更换楼管相关数据属性
 const changeObj = reactive({
@@ -53,6 +55,17 @@ const search = (): void =&gt; {
       data.loading = false;
     });
 };
+
+/**
+ * 小区下拉列表查询
+ */
+const getSelectList = (): void => {
+  residence.getTableList({ page: 1, pageSize: 10000, type: 0 }).then((res) => {
+    console.log(res);
+    data.communityList = res.data.data.list;
+  });
+};
+
 /**
  * 编辑
  * @param { Object } 列表对象
@@ -94,7 +107,6 @@ const changeData: void = () =&gt; {
  * 弹框关闭
  */
 const dialogClose: void = () => {
-  console.log(111);
   data.title = "新增楼宇";
   data.formObj = {};
   houseDetailRef.value.resetForm();
@@ -141,15 +153,34 @@ watchEffect(() =&gt; {
     search();
   }
 });
+
+onMounted(() => {
+  getSelectList();
+});
 </script>
 <template>
   <div class="app-container">
     <!-- 搜索 -->
     <el-form :inline="true" :model="searchData" @submit.native.prevent>
+      <el-form-item prop="neighborhoodId">
+        <el-select
+          v-model="searchData.neighborhoodId"
+          placeholder="请选择所属小区"
+          clearable
+        >
+          <el-option
+            v-for="item in data.communityList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-input
-          placeholder="请输入楼宇名称/楼管姓名"
+          placeholder="请输入楼管姓名"
           v-model="searchData.name"
           clearable
         ></el-input>
@@ -183,22 +214,44 @@ watchEffect(() =&gt; {
           <span>{{ scope.row.neighborhood.name }}</span></template
         >
       </el-table-column>
-      <el-table-column label="楼宇名称" prop="buildingName" align="center"></el-table-column>
-      <el-table-column label="单元数" prop="unitCount" align="center"></el-table-column>
-      <el-table-column label="总房屋数量" prop="houseCount" align="center"></el-table-column>
+      <el-table-column
+        label="楼宇名称"
+        prop="buildingName"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        label="单元数"
+        prop="unitCount"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        label="总房屋数量"
+        prop="houseCount"
+        align="center"
+      ></el-table-column>
       <el-table-column label="建成日期" prop="createTime">
         <template #default="scope">
-          <span>{{ parseTime(new Date(scope.row.createTime).getTime()).split(' ')[0].split('-')[0] }}</span>
+          <span>{{
+            parseTime(new Date(scope.row.createTime).getTime())
+              .split(" ")[0]
+              .split("-")[0]
+          }}</span>
         </template>
       </el-table-column>
       <el-table-column label="建筑面积" prop="grossArea" align="center">
-       <template #default="scope">
-          <span>{{ [0,null].includes(scope.row.grossArea) ?'--':scope.row.grossArea }}</span>
+        <template #default="scope">
+          <span>{{
+            [0, null].includes(scope.row.grossArea) ? "--" : scope.row.grossArea
+          }}</span>
         </template>
       </el-table-column>
       <el-table-column label="使用面积" prop="employArea" align="center">
-      <template #default="scope">
-          <span>{{ [0,null].includes(scope.row.employArea) ?'--':scope.row.employArea }}</span>
+        <template #default="scope">
+          <span>{{
+            [0, null].includes(scope.row.employArea)
+              ? "--"
+              : scope.row.employArea
+          }}</span>
         </template>
       </el-table-column>
       <el-table-column label="楼管姓名" align="center">
 <script setup lang="ts">
 import { reactive, onMounted, getCurrentInstance, watchEffect } from "vue";
 import { getTableList, deleteHouse, getHouse } from "@/api/community/houses.ts";
+import * as residence from "@/api/community/residence.ts";
+import * as housekeeper from "@/api/community/housekeeper.ts";
 import { parseTime } from "@/utils/tool.ts";
 import Detail from "./detail.vue";
 import BuildOwner from "./buildOwner.vue";
@@ -18,6 +20,7 @@ const searchData = reactive({
   roomNumber: null,
   page: 1,
   pageSize: 10,
+  neighborhoodId: null,
 });
 // 展示
 const data = reactive({
@@ -27,6 +30,8 @@ const data = reactive({
   loading: false,
   title: "房屋详情",
   formObj: {},
+  communityList: [],
+  buildingList: [],
 });
 // 绑定业主相关变量
 const build = reactive({
@@ -61,6 +66,40 @@ const search = (): void =&gt; {
       data.loading = false;
     });
 };
+
+/**
+ * 小区下拉列表查询
+ */
+const getSelectList = (): void => {
+  residence.getTableList({ page: 1, pageSize: 10000, type: 0 }).then((res) => {
+    console.log(res);
+    data.communityList = res.data.data.list;
+  });
+};
+
+/**
+ * 监听小区改变
+ */
+const getHousekeeper = (event: Event): void => {
+  console.log(event);
+  if (event) {
+    housekeeper
+      .getTableList({
+        page: 1,
+        pageSize: 10000,
+        type: 0,
+        neighborhoodId: event,
+      })
+      .then((res) => {
+        data.buildingList = res.data.data.list;
+        searchData.buildingId = data.buildingList[0].id;
+        console.log(res);
+      });
+  } else {
+    data.buildingList = [];
+    searchData.buildingId = null;
+  }
+};
 /**
  * 详情
  * @param { number } houseId 房屋ID
@@ -121,12 +160,48 @@ watchEffect(() =&gt; {
     search();
   }
 });
+
+onMounted(() => {
+  getSelectList();
+});
 </script>
 <template>
   <div class="app-container">
     <!-- 搜索 -->
     <el-form :inline="true" :model="searchData" @submit.native.prevent>
+      <el-form-item prop="neighborhoodId">
+        <el-select
+          v-model="searchData.neighborhoodId"
+          placeholder="请选择所属小区"
+          @change="getHousekeeper"
+          clearable
+        >
+          <el-option
+            v-for="item in data.communityList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item prop="buildingId">
+        <el-select
+          v-model="searchData.buildingId"
+          placeholder="请选择楼宇"
+          @change="getHousekeeper"
+          clearable
+        >
+          <el-option
+            v-for="item in data.buildingList"
+            :key="item.id"
+            :label="item.buildingName"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-input
           placeholder="请输入房间号"
@@ -134,6 +209,7 @@ watchEffect(() =&gt; {
           clearable
         ></el-input>
       </el-form-item>
+
       <el-form-item
         ><el-button type="primary" @click="search"
           >查询</el-button
@@ -161,8 +237,16 @@ watchEffect(() =&gt; {
           <span>{{ scope.row.building?.buildingName }}</span></template
         >
       </el-table-column>
-      <el-table-column label="单元" prop="unitNumber" align="center"></el-table-column>
-      <el-table-column label="房间号" prop="roomNumber" align="center"></el-table-column>
+      <el-table-column
+        label="单元"
+        prop="unitNumber"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        label="房间号"
+        prop="roomNumber"
+        align="center"
+      ></el-table-column>
       <el-table-column label="建筑面积" prop="grossArea" align="center">
         <template #default="scope">
           <span>{{