完成房态管理页面筛选功能

admin/config/index.js

@@ -13,7 +13,7 @@ module.exports = {
     assetsPublicPath: '/hotel/manage',
     proxyTable: {
       '/hotel/ihotel-api': {
-        target: 'http://192.168.161.34:8089',
+        target: 'https://chtech.ncjti.edu.cn/hotel/ihotel-api',
         changeOrigin: true,
         pathRewrite: {
           '^/hotel/ihotel-api': ''

admin/src/App.vue

@@ -1,6 +1,9 @@
 <template>
   <div id="app">
-    <router-view />
+    <keep-alive>
+      <router-view v-if="$route.meta.keepAlive"></router-view>
+    </keep-alive>
+    <router-view v-if="!$route.meta.keepAlive"></router-view>
   </div>
 </template>
 

admin/src/router/index.js

@@ -29,7 +29,11 @@ export const asyncRoutes = [
             {
                 path: 'home',
                 name: 'Home',
-                meta: { isAuth: true, title: '主页' },
+                meta: {
+                    isAuth: true,
+                    title: '主页',
+                    keepAlive: true //缓存组件 
+                },
                 component: () => import('@/views/home'),
             },
             {

admin/src/store/index.js

@@ -15,7 +15,7 @@ const store = new Vuex.Store({
     plugins: [createPersistedState({
         storage: window.sessionStorage,
         reducer(val) {
-            console.log(val);
+            // console.log(val);
             return { // 只储存state中的user 
                 inform: val.inform,
                 user: val.user

admin/src/utils/request.js

@@ -9,7 +9,7 @@ const service = axios.create({
     // 公共接口--这里注意后面会讲
     baseURL: process.env.BASE_API,
     // 超时时间 单位是ms，这里设置了3s的超时时间
-    timeout: 3 * 1000
+    timeout: 10 * 1000
 })
 // 2.请求拦截器
 service.interceptors.request.use(config => {

admin/src/views/home/index.vue

@@ -124,7 +124,7 @@
                       >转空闲</el-button
                     >
                     <el-button size="mini" @click="closeEle(item)">{{
-                      switchOff
+                      item.electricName
                     }}</el-button>
                     <!-- <el-button
                       size="mini"
@@ -144,12 +144,17 @@
                     slot="reference"
                   >
                     <div class="title">
-                      <span>{{ item.build }}栋 {{ item.roomNo }}</span>
+                      <span
+                        ><span style="font-size: 16px; font-weight: 800"
+                          >{{ item.build }}栋</span
+                        >
+                        {{ item.roomNo }}</span
+                      >
                       <div class="state" :style="bgState(item.statu)">
                         {{ item.statuName }}
                       </div>
                     </div>
-                    <template v-if="item.statu == 3">
+                    <template v-if="item.statu == 2">
                       <div class="teacher">{{ item.useInfo.userName }}</div>
                       <div class="num">
                         <span>水:{{ item.useInfo.startOfWater }}吨</span
@@ -310,7 +315,7 @@
                 @change="handleCheckAllChange"
                 >全选</el-checkbox
               >
-              <span class="all">{{ ids }} / {{ roomData.length }}间</span>
+              <span class="all">{{ allNum ? allNum : roomData.length }}间</span>
             </div>
             <div style="margin: 15px 0"></div>
             <el-checkbox-group
@@ -323,7 +328,12 @@
                 v-for="(city, ind) in cities"
                 :label="city"
                 :key="city"
-                >{{ city }} <span>{{ citiesNum[ind] }}间</span></el-checkbox
+                >{{ city }}
+                <span
+                  >{{
+                    citiesNumber[ind] ? citiesNumber[ind] : citiesNum[ind]
+                  }}间</span
+                ></el-checkbox
               >
             </el-checkbox-group>
           </div>
@@ -387,7 +397,6 @@ export default {
       floorRoomDatas: [],
       Data: [],
       roomData: [],
-      DataClone: [],
       defaultProps: {
         children: "children",
         label: "label",
@@ -434,6 +443,9 @@ export default {
       citiesNum: [0, 0, 0, 0, 0],
       isIndeterminate: false,
       ids: 0, // 勾选的房间数量
+      allNum: 0,
+      allData: [],
+      citiesNumber: "",
     };
   },
   mounted() {
@@ -446,10 +458,9 @@ export default {
     document.getElementsByClassName(
       "el-button--plain"
     )[2].children[0].innerText = ">";
-    console.log(this.$store);
     // this.$store.commit("user/SET_TIME", this.date);
-
     this.date = this.$store.state.user.time;
+    this.allList();
     this.roomList();
   },
   created() {
@@ -476,6 +487,11 @@ export default {
       console.log(newVal);
       this.$store.commit("user/SET_TIME", this.date);
       this.roomList();
+      this.allList();
+      this.checkedCities = [];
+      this.isIndeterminate = false;
+      this.checkAll = false;
+      this.ids = 0;
     },
   },
   methods: {
@@ -517,7 +533,89 @@ export default {
     //     // 这这里可以写一些业务逻辑，请求数据等
     //   }
     // },
+    allList() {
+      this.API.room.roomPageGroup({ curPage: 1, pageSize: 100 }).then((res) => {
+        let arrays = [];
+        res.data.list.forEach((items) => {
+          items.floors.forEach((item) => {
+            // console.log(item);
+            arrays.push(item);
+          });
+        });
+        console.log(arrays);
+        var res = []; // 层数
+        var narr = []; // 每层对应的数组
+        for (var i = 0; i < arrays.length; i++) {
+          var n = res.indexOf(arrays[i].floor);
+          if (n == -1) {
+            res.push(arrays[i].floor);
+            narr.push({ floor: arrays[i].floor, room: [...arrays[i].room] });
+          } else {
+            narr[n].room.push(...arrays[i].room);
+          }
+        }
+        console.log(narr);
+        let ids = [];
+        narr.forEach((item) => {
+          item.room.forEach((item) => {
+            ids.push(item.id);
+          });
+        });
+        let roomIds = [];
+        ids.forEach((item) => {
+          roomIds.push("roomIds=" + item);
+        });
+        roomIds = roomIds.join("&");
+        let startDay = dayjs(this.date).format("YYYY-MM-DD");
+        // console.log(startDay);
+        let endDay = dayjs(this.date).add(1, "day").format("YYYY-MM-DD");
+        let params =
+          "?" +
+          "startDay=" +
+          startDay +
+          "&" +
+          "endDay=" +
+          endDay +
+          "&" +
+          roomIds;
+        this.API.roomRealTimeStatu.realData(params).then((res) => {
+          let roomData = res.data;
+          this.allNum = roomData.length;
+          narr.forEach((items) => {
+            items.room.forEach((item) => {
+              // console.log(item);
+              roomData.forEach((i) => {
+                if (i.electricType == 1) {
+                  i.electricName = "关电";
+                } else {
+                  i.electricName = "开电";
+                }
+                if (item.id == i.roomId) {
+                  item = Object.assign(item, i);
+                  i = Object.assign(i, item);
+                }
+              });
+            });
+          });
+
+          let citiesNum = [0, 0, 0, 0, 0];
+          narr.forEach((items) => {
+            items.room.forEach((resItem) => {
+              this.cities.forEach((i, ind) => {
+                if (resItem.statu == ind + 1) {
+                  resItem.statuName = i;
+                  citiesNum[resItem.statu - 1] += 1;
+                }
+              });
+            });
+          });
+          console.log(citiesNum);
 
+          this.allData = narr;
+          this.citiesNumber = citiesNum;
+        });
+      });
+    },
     roomList(Datas, resData) {
       this.cardShow = true; // 数据加载前
       this.API.room.roomPageGroup({ curPage: 1, pageSize: 100 }).then((res) => {
@@ -527,13 +625,13 @@ export default {
         let arrays = [];
         let lists = resData ? resData : res.data.list;
         lists.forEach((items) => {
-          console.log(items);
+          // console.log(items);
           items.floors.forEach((item) => {
             // console.log(item);
             arrays.push(item);
           });
         });
-
+        // console.log(arrays);
         var res = []; // 层数
         var narr = []; // 每层对应的数组
         for (var i = 0; i < arrays.length; i++) {
@@ -545,21 +643,10 @@ export default {
             narr[n].room.push(...arrays[i].room);
           }
         }
-        console.log(narr);
+        // console.log(narr);
         // 筛选时传进来的数据代替接口数据(Datas)
         this.floorRoomDatas = Datas ? Datas : narr;
         console.log(this.floorRoomDatas);
-        this.floorRoomDatas.forEach((item) => {
-          item.room.forEach((items) => {
-            items.roomno =
-              items.roomNo.split("-")[0] +
-              "单元" +
-              items.floor +
-              "层" +
-              items.roomNo.split("-")[2] +
-              "房";
-          });
-        });
         let ids = [];
         this.floorRoomDatas.forEach((item) => {
           item.room.forEach((item) => {
@@ -572,7 +659,7 @@ export default {
         });
         roomIds = roomIds.join("&");
         let startDay = dayjs(this.date).format("YYYY-MM-DD");
-        console.log(startDay);
+        // console.log(startDay);
         let endDay = dayjs(this.date).add(1, "day").format("YYYY-MM-DD");
         let params =
           "?" +
@@ -592,6 +679,24 @@ export default {
             items.room.forEach((item) => {
               // console.log(item);
               this.roomData.forEach((i) => {
+                if (i.electricType == 1) {
+                  i.electricName = "关电";
+                } else {
+                  i.electricName = "开电";
+                }
+                if (item.id == i.roomId) {
+                  item = Object.assign(item, i);
+                  i = Object.assign(i, item);
+                }
+              });
+            });
+          });
+          this.floorRoomDatas.forEach((items) => {
+            // console.log(items);
+            items.room.forEach((item) => {
+              // console.log(item);
+
+              this.roomData.forEach((i) => {
                 if (item.id == i.roomId) {
                   item = Object.assign(item, i);
                   i = Object.assign(i, item);
@@ -633,8 +738,7 @@ export default {
               });
             });
           });
-          console.log(this.Data);
-          this.DataClone = _.cloneDeep(this.Data);
+          // console.log(this.Data);
           this.cardShow = false;
         });
       });
@@ -695,6 +799,10 @@ export default {
           console.log(res);
           if (res.data.list.length) {
             this.roomList("", res.data.list);
+            this.checkedCities = [];
+            this.isIndeterminate = false;
+            this.checkAll = false;
+            this.inquireValue = "";
           } else {
             this.$message.error("请输入正确的房间号");
           }
@@ -781,6 +889,7 @@ export default {
                     type: "success",
                   });
                   this.roomList(this.Data);
+                  this.allList();
                   this.room = false;
                   this.count = [];
                   this.$refs.roomTree.setCheckedNodes([]);
@@ -804,6 +913,7 @@ export default {
         console.log(item);
         if (res.success) {
           this.roomList(this.Data);
+          this.allList();
           this.$message({
             message: "成功转为空闲房",
             type: "success",
@@ -829,6 +939,7 @@ export default {
           console.log(res);
           if (res.success) {
             this.roomList(this.Data);
+            this.allList();
             this.$message({
               message: "关房成功",
               type: "success",
@@ -852,6 +963,7 @@ export default {
           console.log(res);
           if (res.success) {
             this.roomList(this.Data);
+            this.allList();
             this.$message({
               message: "成功转为脏房",
               type: "success",
@@ -864,25 +976,34 @@ export default {
     // 关电
     closeEle(item) {
       console.log(item);
-      let operType = "2";
+      let operType = "";
       let roomId = item.roomId;
-      this.$confirm(`确认${this.switchOff}吗？`)
+      this.$confirm(`确认${item.electricName}吗？`)
         .then((_) => {
-          this.API.roomThirdSetting
-            .changeElectric(roomId, operType)
-            .then((res) => {
-              console.log(res);
-              if (res.success) {
-                this.$message({
-                  message: "关电成功",
-                  type: "success",
-                });
-                this.switchOff = "开电";
-                // this.roomList(this.Data);
-              } else {
-                this.$message.error(res.message);
-              }
-            });
+          if (item.electricType == 1) {
+            operType = "2";
+          } else {
+            operType = "1";
+          }
+          let reqFlag = true;
+          if (reqFlag) {
+            this.API.roomThirdSetting
+              .changeElectric(roomId, operType)
+              .then((res) => {
+                reqFlag = false;
+                console.log(res);
+                if (res.success) {
+                  this.roomList(this.Data);
+                  this.$message({
+                    message: `${item.electricName}成功`,
+                    type: "success",
+                  });
+                  reqFlag = true;
+                } else {
+                  this.$message.error(res.message);
+                }
+              });
+          }
         })
         .catch((_) => {});
     },
@@ -908,50 +1029,83 @@ export default {
     // 房态筛查
     handleCheckAllChange(val) {
       console.log(val);
-      if (val) {
-        this.ids = this.roomData.length;
-      } else {
-        this.ids = 0;
-      }
+      this.roomList();
       this.checkedCities = val ? this.cities : [];
       this.isIndeterminate = false;
     },
     handleCheckedCitiesChange(value) {
-      console.log(value);
+      // this.API.room.roomPageGroup({ curPage: 1, pageSize: 100 }).then((res) => {
+      //
+      // });
+      // this.roomList();
+      if (value.length) {
+        console.log(this.Data);
+
+        let array = [];
+        let room = [];
+        this.allData.forEach((items, index) => {
+          array.push({ floor: items.floor, room: [] });
+          items.room.forEach((item, ind) => {
+            if (
+              value.some((i) => {
+                return i == item.statuName;
+              })
+            ) {
+              room.push(item);
+            }
+          });
+        });
+        room.forEach((items) => {
+          array.forEach((item) => {
+            if (items.floor == item.floor) {
+              item.room.push(items);
+            }
+          });
+        });
+        array = array.filter((item, index) => {
+          return item.room.length;
+        });
+        if (array.length == 0) {
+          // this.roomList();
+          console.log("勾选的房间数量为0");
+          this.Data = [];
+          this.data[0].children = [];
+        } else {
+          // this.roomList(array, "");
+          console.log("勾选的房间数量有房间");
+          this.Data = array;
+          this.data[0].children = [];
+
+          this.Data.forEach((items) => {
+            items.room.forEach((item) => {
+              this.roomData.forEach((i, index) => {
+                if (item.id == i.roomId) {
+                  this.$set(item, "doorLockShow", false);
+                  // console.log(i);
+                  let arr = {
+                    id: i.roomId,
+                    label: i.build + "栋" + i.roomNo,
+                  };
+                  if (i.statu == 1) {
+                    this.data[0].children.push(arr);
+                  }
+                }
+              });
+            });
+          });
+        }
+        console.log(value);
+      } else {
+        this.roomList();
+      }
+
       let checkedCount = value.length;
       this.checkAll = checkedCount === this.cities.length;
       this.isIndeterminate =
         checkedCount > 0 && checkedCount < this.cities.length;
-
-      let startDay = dayjs(this.date).format("YYYY-MM-DD");
-      console.log(startDay);
-      let endDay = dayjs(this.date).add(1, "day").format("YYYY-MM-DD");
-      let ids = [];
-      this.Data.forEach((items) => {
-        items.room.filter((item) => {
-          if (
-            value.some((i) => {
-              return item.statuName == i;
-            })
-          ) {
-            ids.push(item.id);
-          }
-        });
-      });
-      this.ids = ids.length;
-      let roomIds = [];
-      ids.forEach((item) => {
-        roomIds.push("roomIds=" + item);
-      });
-      roomIds = roomIds.join("&");
-      let params =
-        "?" + "startDay=" + startDay + "&" + "endDay=" + endDay + "&" + roomIds;
-      // this.API.roomRealTimeStatu.realData(params).then((res) => {
-      //   console.log(res.data);
-      // this.roomList("", "");
-      // });
     },
     reset() {
+      this.roomList();
       this.checkedCities = [];
       this.isIndeterminate = false;
       this.checkAll = false;
@@ -968,11 +1122,7 @@ export default {
       //   });
       // });
       // item.doorLockShow = false;
-      this.$confirm(`确认取消修改吗？`)
-        .then((_) => {
-          this.$set(item, "doorLockShow", false);
-        })
-        .catch((_) => {});
+      this.$set(item, "doorLockShow", false);
     },
     // 下发密码
     sending(item) {
@@ -1062,17 +1212,21 @@ export default {
         lockId: this.doorLockList.doorId,
       };
       console.log(arr);
-      this.API.roomThirdSetting.Updata(arr).then((res) => {
-        if (res.success) {
-          this.$message({
-            message: "修改成功",
-            type: "success",
+      this.$confirm(`确认修改吗？`)
+        .then((_) => {
+          this.API.roomThirdSetting.Updata(arr).then((res) => {
+            if (res.success) {
+              this.$message({
+                message: "修改成功",
+                type: "success",
+              });
+            } else {
+              console.log(res);
+              this.$message.error(res.message);
+            }
           });
-        } else {
-          console.log(res);
-          this.$message.error(res.message);
-        }
-      });
+        })
+        .catch((_) => {});
     },
 
     // 取消修改房间水表码、电表码、锁id