内容提交

longyvfengyun

2023-08-27 5e77dd17b896184787fedb60e9acbb56506a7ae4

 src/views/accessControl/accessControl.vue

@@ -1,6 +1,7 @@
<script setup>
import FlexBox from "@/components/FlexBox.vue";
import doorInfoModule from "@/views/accessControl/js/doorInfoModule";
import HdwLight from "@/components/HdwLight.vue";
const {doorInfos} = doorInfoModule();

</script>
@@ -13,6 +14,17 @@
               <el-row>
                  <el-col :span="4" v-for="item in doorInfos" :key="item">
                     <div class="access-control-item">
                        <div class="access-control-tool">
                           <div class="access-control-tool-item" v-if="item.status === 0">
                              <el-button type="primary" size="large">开门</el-button>
                           </div>
                           <div class="access-control-tool-item" v-else-if="item.status === 1">
                              <el-button type="warning" size="large">关门</el-button>
                           </div>
                           <div class="access-control-tool-item" v-else>
                              <hdw-light :type="1"></hdw-light>
                           </div>
                        </div>
                        <flex-box>
                           <div class="access-control-img">
                              <img src="./images/menJin.png" alt="">
@@ -20,8 +32,8 @@
<!--                           <div class="access-control-text update-time">-->
<!--                              2023-06-29 00:00:00-->
<!--                           </div>-->
                           <div class="access-control-text home-number">{{ item.ip }}</div>
                           <div class="access-control-text state">门锁状态：{{ item.status }}</div>
                           <div class="access-control-text home-number">{{ item.name }}</div>
                           <div class="access-control-text state">门锁状态：{{ item.statusText }}</div>
                        </flex-box>
                     </div>
                  </el-col>
@@ -41,9 +53,19 @@
   overflow-y: auto;
}
.access-control-item {
   position: relative;
   margin-left: 16px;
   margin-bottom: 16px;
   text-align: center;
   .access-control-tool {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 7;
      .access-control-tool-item {
         margin-bottom: 8px;
      }
   }
}
.access-control-img {
   display: inline-block;