1、修改房间管理页面

src/views/ledger/room/index.vue

 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="楼层id" prop="floorId">
+      <el-form-item label="所属区域" prop="deptId">
+        <treeselect
+          v-model="queryParams.deptId"
+          :options="deptOptions"
+          :show-count="true"
+          placeholder="请选择所属区域"
+          style="width: 250px"
+        />
+      </el-form-item>
+      <el-form-item label="项目名称" prop="projectName">
         <el-input
-          v-model="queryParams.floorName"
-          placeholder="请输入楼层"
+          v-model="queryParams.projectName"
+          placeholder="请输入项目名称"
           clearable
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="房间名称" prop="name">
+      <el-form-item label="楼宇名称" prop="buildingName">
         <el-input
-          v-model="queryParams.name"
-          placeholder="请输入房间名称"
+          v-model="queryParams.buildingName"
+          placeholder="请输入楼宇名称"
           clearable
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="房间编号" prop="number">
+      <el-form-item label="楼层名称" prop="floorName">
         <el-input
-          v-model="queryParams.number"
-          placeholder="请输入房间编号"
+          v-model="queryParams.floorName"
+          placeholder="请输入楼层名称"
           clearable
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="房间面积" prop="area">
+      <el-form-item label="房间名称" prop="name">
         <el-input
-          v-model="queryParams.area"
-          placeholder="请输入房间面积"
+          v-model="queryParams.name"
+          placeholder="请输入房间名称"
           clearable
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="房屋类型" prop="roomType">
+        <el-select
+          v-model="queryParams.roomType"
+          placeholder="请选择房屋类型"
+          clearable
+        >
+          <el-option
+            v-for="dict in dict.type.risk_plan_room_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select
+          v-model="queryParams.status"
+          placeholder="请选择状态"
+          clearable
+        >
+          <el-option
+            v-for="dict in dict.type.sys_normal_disable"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -93,11 +130,12 @@
              {{ (queryParams.pageNum - 1) * queryParams.pageSize + $index + 1 }}
           </template>
       </el-table-column>
-      </el-table-column>
-      <el-table-column label="楼层" align="center" prop="floorName" />
+      <el-table-column label="所属区域" align="center" prop="deptName" />
+      <el-table-column label="项目名称" align="center" prop="projectName" />
+      <el-table-column label="楼宇名称" align="center" prop="buildingName" />
+      <el-table-column label="楼层名称" align="center" prop="floorName" />
       <el-table-column label="房间名称" align="center" prop="name" />
-      <el-table-column label="房间编号" align="center" prop="number" />
-      <el-table-column label="房间面积" align="center" prop="area" />
+      <el-table-column label="房间类型" align="center" prop="roomType" />
      <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
@@ -140,12 +178,6 @@
         <el-form-item label="房间名称" prop="name">
           <el-input v-model="form.name" placeholder="请输入房间名称" />
         </el-form-item>
-        <el-form-item label="房间编号" prop="number">
-          <el-input v-model="form.number" placeholder="请输入房间编号" />
-        </el-form-item>
-        <el-form-item label="房间面积" prop="area">
-          <el-input v-model="form.area" placeholder="请输入房间面积" />
-        </el-form-item>
         <el-form-item label="状态" prop="status">
           <el-select v-model="form.status" placeholder="请选择状态">
             <el-option
@@ -167,11 +199,17 @@
 
 <script>
 import { listRoom, getRoom, delRoom, addRoom, updateRoom } from "@/api/ledger/room";
+import { deptTreeSelect } from "@/api/system/user";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 
 export default {
   name: "Room",
-  dicts: ['sys_normal_disable', 'data_source'],
+  dicts: ['sys_normal_disable', 'data_source','risk_plan_room_type'],
+  components: {
+    Treeselect,
+  },
   data() {
     return {
       // 遮罩层
@@ -196,23 +234,33 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        floorId: null,
-        name: null,
-        number: null,
-        area: null,
+        deptId: null,
+        projectName:null,
+        buildingName:null,
+        floorName:null,
+        name:null,
+        roomType:null,
         status: null,
       },
       // 表单参数
       form: {},
       // 表单校验
       rules: {
-      }
+      },
+      deptOptions: []
     };
   },
   created() {
     this.getList();
+    this.getDeptTree();
   },
   methods: {
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      deptTreeSelect().then((response) => {
+        this.deptOptions = response.data;
+      });
+    },
     /** 查询基础数据-楼层列表 */
     getList() {
       this.loading = true;
@@ -231,16 +279,13 @@ export default {
     reset() {
       this.form = {
         id: null,
-        floorId: null,
-        name: null,
-        number: null,
-        area: null,
+        deptId: null,
+        projectName:null,
+        buildingName:null,
+        floorName:null,
+        name:null,
+        roomType:null,
         status: null,
-        delFlag: null,
-        createBy: null,
-        createTime: null,
-        updateBy: null,
-        updateTime: null
       };
       this.resetForm("form");
     },
@@ -308,7 +353,7 @@ export default {
     },
     /** 导出按钮操作 */
     handleExport() {
-      this.download('system/room/export', {
+      this.download('system/ledger/room/export', {
         ...this.queryParams
       }, `room_${new Date().getTime()}.xlsx`)
     }