no message

admin/src/App.vue

@@ -28,8 +28,5 @@ body {
   ::-webkit-scrollbar {
     display: none; /* Chrome Safari */
   }
-  .v-model {
-    display: none !important;
-  }
 }
 </style>

admin/src/components/SvgIcon/index.vue

@@ -1,9 +1,9 @@
 <template>
-    <div class="icon-wrapper" :style="wd">
-        <svg class="icon" aria-hidden="true" :style="wd">
-            <use :xlink:href="iconName"></use>
-        </svg>
-    </div>
+  <div class="icon-wrapper" :style="wd">
+    <svg class="icon" aria-hidden="true" :style="wd">
+      <use :xlink:href="iconName"></use>
+    </svg>
+  </div>
 </template>
  
 <script>
@@ -12,41 +12,41 @@
 
 // 引入本地的svg文件
 // 定义一个加载目录的函数
-const requireAll = requireContext => requireContext.keys().map(requireContext)
-const req = require.context('@/assets/icons/svg', false, /\.svg$/)
+const requireAll = (requireContext) =>
+  requireContext.keys().map(requireContext);
+const req = require.context("@/assets/icons/svg", false, /\.svg$/);
 // 加载目录下的所有的 svg 文件
-requireAll(req)
+requireAll(req);
 // console.log('I: 加载svg文件:', req.keys())
 export default {
-    name: 'IconSvg',
-    props: {
-        name: String,
-        prefix: {
-            type: String,
-            default: 'icon-'
-        },
-        W: {
-            type: Number,
-            default: 28
-        },
-        H: {
-            type: Number,
-            default: 28
-        }
+  name: "IconSvg",
+  props: {
+    name: String,
+    prefix: {
+      type: String,
+      default: "icon-",
     },
-    mounted() {
+    W: {
+      type: Number,
+      default: 28,
     },
-    computed: {
-        iconName() {
-            let name = `#${this.prefix}${this.name}`
-            return name
-        },
-        wd() {
-            const style = { width: this.W + 'px', height: this.H + 'px' }
-            return style
-        }
-    }
-}
+    H: {
+      type: Number,
+      default: 28,
+    },
+  },
+  mounted() {},
+  computed: {
+    iconName() {
+      let name = `#${this.prefix}${this.name}`;
+      return name;
+    },
+    wd() {
+      const style = { width: this.W + "px", height: this.H + "px" };
+      return style;
+    },
+  },
+};
 </script>
  
 <style scoped>
@@ -62,21 +62,20 @@ export default {
 }*/
 
 .icon-wrapper {
-    /* Using currentColor above lets
+  /* Using currentColor above lets
   us use `color` for changing the color
   of our icons: */
-    color: red;
+  color: red;
 
-    /* The width and height of the SVG
+  /* The width and height of the SVG
   was previously set to 1em.
   This allows us to use `font-size`
   to change the size of our icon: */
 }
 
 .icon {
-    display: inline-block;
-    color: #444444;
-
-    fill: currentColor;
+  display: inline-block;
+  color: #444444;
+  fill: currentColor;
 }
 </style>

admin/src/views/home/index.vue

@@ -161,7 +161,7 @@
                       {{ item.statuName }}
                     </div>
                   </div>
-                  <template v-if="item.statu != 2">
+                  <template v-if="item.statu == 3">
                     <div class="teacher">{{ item.useInfo.userName }}</div>
                     <div class="num">
                       <span>水:{{ item.useInfo.startOfWater }}吨</span
@@ -169,13 +169,13 @@
                       <span>电:{{ item.useInfo.startOfElectric }}度</span>
                     </div>
                     <div class="count-down">
-                      <span>退房倒计时 {{ Endtime }}</span>
+                      <span>退房倒计时 {{ item.useInfo.EndTime }}</span>
                       <div class="tuifang" @click.stop="doorLock = true">
                         <IconSvg :W="21" :H="21" name="tuifang" />
                         <el-dialog
                           title="门锁管理"
+                          :append-to-body="true"
                           :visible.sync="doorLock"
-                          :modal-append-to-body="true"
                           width="30%"
                           :before-close="lockClose"
                         >
@@ -286,7 +286,7 @@ export default {
       // 批量数据
       dialogVisible: false,
       enableEndTime: "", // 倒计时的日期
-      Endtime: "",
+      Endtime: [],
       count: 20,
       title: "",
       checked: true,
@@ -468,23 +468,25 @@ export default {
           });
           this.floorRoomDatas.forEach((items) => {
             items.room.forEach((item) => {
-              this.roomData.forEach((i) => {
+              this.roomData.forEach((i, index) => {
                 if (item.id == i.roomId) {
                   i = Object.assign(i, item);
                   console.log(i);
                   if (i.useInfo) {
                     this.enableEndTime = i.useInfo.enableEndTime;
-                    this.showTime("2022-08-25 12:00:00");
+                    this.showTime(index, "2022-08-25 12:00:00");
+                    console.log(i.useInfo.enableEndTime);
                   }
                 }
               });
             });
           });
+          // this.showTime(this.enableEndTime);
         });
       });
     },
     // 退房倒计时
-    showTime(endtime) {
+    showTime(index, endtime) {
       setInterval(() => {
         //设置2020年春节时间
         var newyear = new Date(endtime);
@@ -514,7 +516,8 @@ export default {
           s = "0" + s;
         }
         let enableEndTime = day + ":" + h + ":" + m + ":" + s;
-        this.Endtime = enableEndTime;
+        // this.roomData[index].useInfo.EndTime = enableEndTime;
+        this.$set(this.roomData[index].useInfo, "EndTime", enableEndTime);
       }, 0);
     },
     bgState(e) {
@@ -1020,78 +1023,130 @@ export default {
   box-shadow: 0px 3px 10px rgba(0, 97, 255, 0.2);
   border-radius: 8px;
 }
-
 /deep/ .el-dialog {
-  height: 565px !important;
-
-  .el-dialog__header {
-    height: 81px;
-    margin: 0;
-    padding: 0;
-    border-bottom: 1px solid rgba(230, 230, 230, 1);
+  box-shadow: none;
+  margin: 350px 0 0 450px !important;
+  width: 555px !important;
+  height: 377px !important;
+  .text {
     display: flex;
-    align-items: center;
-    color: rgba(0, 0, 0, 1);
-
+    margin-left: 34px;
+    margin-bottom: 15px;
+    font-size: 14px;
+    font-weight: 400;
     span {
-      font-size: 20px;
-      font-weight: 500;
-      margin-left: 30px;
+      margin-right: 20px;
     }
-
-    button {
-      font-size: 20px;
+    .password {
+      color: #fff;
+      border-radius: 2px;
+      font-size: 12px;
+      padding: 2px;
+      cursor: pointer;
+      background-color: rgba(41, 109, 227, 1);
+    }
+  }
+  .el-dialog__header {
+    border-bottom: 1px solid rgba(204, 204, 204, 1);
+    padding: 25px 20px;
+    .el-dialog__headerbtn {
       width: 35px;
       height: 35px;
-      top: 23px !important;
+      font-size: 24px;
+      i {
+        color: #000;
+      }
     }
   }
-
   .el-dialog__body {
-    display: flex;
-    justify-content: center;
-    padding: 21px 0 0 0;
-
-    .tree {
-      .tree-left {
-        width: 316px;
-        height: 44px;
-        background: rgba(240, 243, 247, 1);
-        border: 1px solid rgba(230, 230, 230, 1);
-        box-sizing: border-box;
-        display: flex;
-        align-items: center;
+    flex-direction: column;
+  }
+  .el-dialog__footer {
+    margin: 40px 14px 0 0;
+    .dialog-footer {
+      .el-button:nth-child(2) {
+        color: #fff;
+        background: rgba(41, 109, 227, 1);
       }
-    }
-
-    .el-tree {
-      width: 316px;
-      height: 324px;
-      border: 1px solid rgba(230, 230, 230, 1);
-      box-sizing: border-box;
-      padding-left: 9px;
-    }
-
-    ul {
-      width: 316px;
-      height: 324px;
-      list-style: none;
-      padding: 0;
-      margin: 0;
-      border: 1px solid rgba(230, 230, 230, 1);
-      box-sizing: border-box;
-      li {
-        display: flex;
-        justify-content: space-between;
-        padding-right: 17px;
+      .el-button {
+        width: 67px;
+        height: 37px;
+        padding-left: 20px;
       }
     }
   }
-
-  .el-dialog__footer {
-    padding: 24px 30px 0 0;
-  }
 }
+// /deep/ .el-dialog {
+//   height: 565px !important;
+
+//   .el-dialog__header {
+//     height: 81px;
+//     margin: 0;
+//     padding: 0;
+//     border-bottom: 1px solid rgba(230, 230, 230, 1);
+//     display: flex;
+//     align-items: center;
+//     color: rgba(0, 0, 0, 1);
+
+//     span {
+//       font-size: 20px;
+//       font-weight: 500;
+//       margin-left: 30px;
+//     }
+
+//     button {
+//       font-size: 20px;
+//       width: 35px;
+//       height: 35px;
+//       top: 23px !important;
+//     }
+//   }
+
+//   .el-dialog__body {
+//     display: flex;
+//     justify-content: center;
+//     padding: 21px 0 0 0;
+
+//     .tree {
+//       .tree-left {
+//         width: 316px;
+//         height: 44px;
+//         background: rgba(240, 243, 247, 1);
+//         border: 1px solid rgba(230, 230, 230, 1);
+//         box-sizing: border-box;
+//         display: flex;
+//         align-items: center;
+//       }
+//     }
+
+//     .el-tree {
+//       width: 316px;
+//       height: 324px;
+//       border: 1px solid rgba(230, 230, 230, 1);
+//       box-sizing: border-box;
+//       padding-left: 9px;
+//     }
+
+//     ul {
+//       width: 316px;
+//       height: 324px;
+//       list-style: none;
+//       padding: 0;
+//       margin: 0;
+//       border: 1px solid rgba(230, 230, 230, 1);
+//       box-sizing: border-box;
+//       li {
+//         display: flex;
+//         justify-content: space-between;
+//         padding-right: 17px;
+//       }
+//     }
+//   }
+
+//   .el-dialog__footer {
+//     padding: 24px 30px 0 0;
+//   }
+// }
 </style>
 <style lang="scss">
 .el-popover.popperOptions {