火灾单位修改-提交

src/views/vent/fire/fireHome/components/emptyJc.vue

@@ -2,7 +2,10 @@
   <div class="emptyJc">
     <div class="empty-box" v-for="(item, index) in emptyList" :key="index">
       <div class="empty-label">{{ item.label }}</div>
-      <div class="empty-val">{{ item.val }}</div>
+      <div class="empty-val">
+        <span> {{ item.val }}</span>
+        <span>{{ item.unit }}</span>
+      </div>
     </div>
   </div>
 </template>

src/views/vent/fire/fireHome/components/fiberBunbleJc.vue

@@ -5,7 +5,7 @@
       <div class="jc-item">
         <span class="item-label">{{ `${item.label} : ` }}</span>
         <span class="item-val">{{ `${item.val}` }}</span>
-        <span class="item-dw">mg/m3</span>
+        <span class="item-dw">{{ item.unit }}</span>
       </div>
       <div class="jc-item1">
         <span class="item-label">{{ `${item.label1} : ` }}</span>
@@ -20,117 +20,115 @@
 </template>
 
 <script setup lang="ts">
-  import { ref, reactive,defineProps,watch } from 'vue';
-
-  let props=defineProps({
-    bunbleData:{
-      type:Array,
-      default:()=>{
-        return []
-      }
-    }
-  })
-  let fiberBunbleJcList = ref<any[]>([]);
+import { ref, reactive, defineProps, watch } from 'vue';
 
-  watch(()=>props.bunbleData,(newB,oldB)=>{
-    if(newB.length!=0){
-      fiberBunbleJcList.value=newB
+let props = defineProps({
+  bunbleData: {
+    type: Array,
+    default: () => {
+      return []
     }
-  },{immediate:true,deep:true})
+  }
+})
+let fiberBunbleJcList = ref<any[]>([]);
+
+watch(() => props.bunbleData, (newB, oldB) => {
+  if (newB.length != 0) {
+    fiberBunbleJcList.value = newB
+  }
+}, { immediate: true, deep: true })
 </script>
 
 <style lang="less" scoped>
-
-
-  .fiberBunbleJc {
-    display: flex;
+.fiberBunbleJc {
+  display: flex;
+  position: relative;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-around;
+  width: 100%;
+  height: 100%;
+
+  .fiberBunbleJc-box {
     position: relative;
-    flex-direction: column;
-    align-items: center;
-    justify-content: space-around;
     width: 100%;
-    height: 100%;
-
-    .fiberBunbleJc-box {
-      position: relative;
-      width: 100%;
-      height: 58px;
-      background: url('../../../../../assets/images/fire/firehome/fiber-jc.png') no-repeat center;
-      background-size: 100% 100%;
-
-      .jc-title {
-        position: absolute;
-        top: 50%;
-        transform: translate(0,-50%);
-        color: #fff;
-        // font-family: douyuFont;
-        font-size: 20px;
-        font-weight: bolder;
-      }
-
-      &:nth-child(1)  .jc-title {
-        left: 114px;
-      }
-
-      &:nth-child(2)  .jc-title {
-        left: 114px;
-      }
-
-      &:nth-child(3)  .jc-title {
-        left: 106px;
-      }
-
-      &:nth-child(4)  .jc-title {
-        left: 106px;
-      }
-
-      &:nth-child(5)  .jc-title {
-        left: 99px;
-      }
-
-      &:nth-child(6)  .jc-title {
-        left: 99px;
-      }
-
-    
-
-     
-     
-
-   
-
-      .jc-item {
-        position: absolute;
-        top: 10%;
-        left: 30%;
-      }
-
-      .jc-item1 {
-        position: absolute;
-        top: 10%;
-        left: 60%;
-      }
-
-      .jc-item2 {
-        position: absolute;
-        top: 50%;
-        left: 30%;
-      }
-
-      .item-label {
-        color: #9da5aa;
-        font-size: 14px;
-      }
-
-      .item-val {
-        color: #fff;
-        font-size: 14px;
-      }
-
-      .item-dw{
-        margin-left: 5px;
-        color: #fff;
-      }
+    height: 58px;
+    background: url('../../../../../assets/images/fire/firehome/fiber-jc.png') no-repeat center;
+    background-size: 100% 100%;
+
+    .jc-title {
+      position: absolute;
+      top: 50%;
+      transform: translate(0, -50%);
+      color: #fff;
+      // font-family: douyuFont;
+      font-size: 16px;
+      font-weight: bolder;
+    }
+
+    &:nth-child(1) .jc-title {
+      left: 112px;
+    }
+
+    &:nth-child(2) .jc-title {
+      left: 92px;
+    }
+
+    &:nth-child(3) .jc-title {
+      left: 92px;
+    }
+
+    &:nth-child(4) .jc-title {
+      left: 112px;
+    }
+
+    &:nth-child(5) .jc-title {
+      left: 112px;
+    }
+
+    &:nth-child(6) .jc-title {
+      left: 112px;
+    }
+
+
+
+
+
+
+
+
+    .jc-item {
+      position: absolute;
+      top: 10%;
+      left: 30%;
+    }
+
+    .jc-item1 {
+      position: absolute;
+      top: 10%;
+      left: 60%;
+    }
+
+    .jc-item2 {
+      position: absolute;
+      top: 50%;
+      left: 30%;
+    }
+
+    .item-label {
+      color: #9da5aa;
+      font-size: 14px;
+    }
+
+    .item-val {
+      color: #fff;
+      font-size: 14px;
+    }
+
+    .item-dw {
+      margin-left: 5px;
+      color: #fff;
     }
   }
+}
 </style>

src/views/vent/fire/fireHome/index.vue

@@ -240,7 +240,7 @@ async function getMbRealDataList() {
   console.log(res, '密闭监测实时信息')
   emptyData.length = 0
   res.forEach(el => {
-    emptyData.push({ label: el.name, val: el.currentValue },)
+    emptyData.push({ label: el.name, val: el.currentValue,unit:el.unit },)
   })
 }
 
@@ -268,13 +268,14 @@ async function getSgjcRealDataByPointCodeList() {
     bunbleData.length = 0
     res.forEach(el => {
       bunbleData.push({
-        type: el.type,
+        type: el.name,
         label: '最大浓度',
         val: el.currentValue,
         label1: '位置',
         val1: el.position,
         label2: '时间',
         val2: el.time,
+        unit:el.unit
       })
     })
   }