Browse Source

火灾监测首页,粉尘监测首页修改-提交

lxh 6 months ago
parent
commit
9ea367914d

+ 4 - 4
src/views/vent/dust/dustHome/components/dustFallDevice.vue

@@ -4,22 +4,22 @@
             <div class="box-left-t">
                 <img src="../../../../../assets/images/dust/dusthome/sbzs.png" class="item-icon"  alt="">
                 <div class="item-label">设备总数</div>
-                <div class="item-val">{{ deviceTotal }}</div>
+                <div class="item-val">{{ deviceTotal || '--' }}</div>
             </div>
             <div class="box-left-b">
                 <img src="../../../../../assets/images/dust/dusthome/pwkqs.png" class="item-icon"  alt="">
                 <div class="item-label">喷雾开启数</div>
-                <div class="item-val">{{ pwTotal }}</div>
+                <div class="item-val">{{ pwTotal || '--' }}</div>
             </div>
             <div class="box-right-t">
                 <img src="../../../../../assets/images/dust/dusthome/lwsl.png" class="item-icon"  alt="">
                 <div class="item-label">联网数量</div>
-                <div class="item-val">{{ interTotal }}</div>
+                <div class="item-val">{{ interTotal || '--' }}</div>
             </div>
             <div class="box-right-b">
                 <img src="../../../../../assets/images/dust/dusthome/dwsl.png" class="item-icon"  alt="">
                 <div class="item-label">断网数量</div>
-                <div class="item-val">{{ unInterTotal }}</div>
+                <div class="item-val">{{ unInterTotal || '--'}}</div>
             </div>
         </div>
        

+ 11 - 128
src/views/vent/dust/dustHome/components/dustGlzb.vue

@@ -1,4 +1,4 @@
-<!-- <template>
+<template>
     <div class="dustGlzb">
         <div class="safety-head">
             <div class="safety-head-item" v-for="(item, index) in safetyHeadList" :key="index">{{
@@ -6,12 +6,12 @@
                 }}</div>
         </div>
         <div class="safety-content">
-            <vue3-seamless-scroll hover-stop="true" :list="safetyList" :hover="true" :step="0.15" class="seamless-warp">
-                <div class="safety-content-box" v-for="(ite, ind) in safetyList" :key="ind">
-                    <span>{{ ite.wd }}</span>
-                    <span>{{ ite.sd }}</span>
-                    <span>{{ ite.fs }}</span>
-                    <span>{{ ite.sy }}</span>
+            <vue3-seamless-scroll hover-stop="true" :list="dustZbList" :hover="true" :step="0.15" class="seamless-warp">
+                <div class="safety-content-box" v-for="(ite, ind) in dustZbList" :key="ind">
+                    <span>{{ ite.label || '--' }}</span>
+                    <span>{{ ite.temperature || '--' }}</span>
+                    <span>{{ ite.windSpeed || '--' }}</span>
+                    <span>{{ ite.pwList || '--' }}</span>
                 </div>
             </vue3-seamless-scroll>
         </div>
@@ -33,16 +33,11 @@ let props = defineProps({
 
 let dustZbList = ref<any[]>([])
 let safetyHeadList = ref<any[]>([
+    {label:'名称'},
     { label: '温度(­°C)' },
-    { label: '湿度(%)' },
+    // { label: '湿度(%)' },
     { label: '风速(m/s)' },
-    { label: '水压(MPa)' },
-])
-let safetyList = ref<any[]>([
-    { wd: 10, sd: 10, fs: 10, sy: 10 },
-    { wd: 10, sd: 10, fs: 10, sy: 10 },
-    { wd: 10, sd: 10, fs: 10, sy: 10 },
-    { wd: 10, sd: 10, fs: 10, sy: 10 },
+    { label: '喷雾数量' },
 ])
 
 watch(() => props.dustGlzbData, (newD, oldD) => {
@@ -148,120 +143,8 @@ watch(() => props.dustGlzbData, (newD, oldD) => {
         }
     }
 }
-</style> -->
+</style>
 
 
-<template>
-    <div class="dustGlzb">
-        <div class="dust-gl-box" v-for="(item, index) in dustZbList" :key="index">
-            <div class="gl-box-content">
-                <span class="gl-label">{{ item.label }}</span>
-                <span class="gl-val">{{ item.val }}</span>
-            </div>
-        </div>
-    </div>
-</template>
 
-<script lang="ts" setup>
-import { reactive, ref, defineProps, watch } from 'vue'
 
-let props = defineProps({
-    dustGlzbData: {
-        type: Array,
-        default: () => {
-            return []
-        }
-    }
-})
-
-let dustZbList = ref<any[]>([])
-
-watch(() => props.dustGlzbData, (newD, oldD) => {
-    console.log(newD, 'newD--------')
-    if (newD.length != 0) {
-        dustZbList.value = newD
-    }
-}, {
-    immediate: true,
-    deep: true
-})
-
-</script>
-
-<style lang="less" scoped>
-.dustGlzb {
-    display: flex;
-    position: relative;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: flex-start;
-    width: 100%;
-    height: 100%;
-
-    .dust-gl-box {
-        display: flex;
-        box-sizing: border-box;
-        align-items: center;
-        justify-content: center;
-        width: 50%;
-        height: 60px;
-        padding-top: 10px;
-
-        .gl-box-content {
-            position: relative;
-            width: 254px;
-            height: 100%;
-
-            .gl-label {
-                position: absolute;
-                top: 50%;
-                left: 49px;
-                transform: translate(0, -50%);
-                color: #fff;
-                font-size: 12px;
-            }
-
-            .gl-val {
-                position: absolute;
-                top: 50%;
-                right: 24px;
-                transform: translate(0, -48%);
-                color: #089dff;
-                // font-family: douyuFont;
-                font-size: 14px;
-                font-weight: bold;
-            }
-        }
-
-        &:nth-child(1) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-1.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-
-        &:nth-child(2) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-2.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-
-        &:nth-child(3) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-3.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-
-        &:nth-child(4) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-4.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-
-        &:nth-child(5) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-5.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-
-        &:nth-child(6) .gl-box-content {
-            background: url('../../../../../assets/images/dust/dusthome/gl-6.png') no-repeat center;
-            background-size: 100% 100%;
-        }
-    }
-}
-</style>

+ 1 - 1
src/views/vent/dust/dustHome/components/dustJtzb.vue

@@ -7,7 +7,7 @@
                 <div style="margin-bottom: 5px;">{{ item.label }}</div>
                 <div>{{ item.dw }}</div>
             </div>
-            <div class="box-item-val">{{ item.value }}</div>
+            <div class="box-item-val">{{ item.value || '--' }}</div>
         </div>
 
     </div>

+ 16 - 16
src/views/vent/dust/dustHome/components/dustTimeNow.vue

@@ -8,10 +8,10 @@
     <div class="safety-content">
       <vue3-seamless-scroll hover-stop="true" :list="dustZbList" :hover="true" :step="0.15" class="seamless-warp">
         <div class="safety-content-box" v-for="(ite, ind) in dustZbList" :key="ind">
-          <span>{{ ite.label }}</span>
-          <span>{{ ite.temperature }}</span>
-          <span>{{ ite.windSpeed }}</span>
-          <span>{{ ite.dust }}</span>
+          <span>{{ ite.label || '--' }}</span>
+          <!-- <span>{{ ite.temperature }}</span>
+          <span>{{ ite.windSpeed }}</span> -->
+          <span>{{ ite.dust || '0' }}</span>
 
         </div>
       </vue3-seamless-scroll>
@@ -35,9 +35,9 @@ let props = defineProps({
 let dustZbList = ref<any[]>([])
 let safetyHeadList = ref<any[]>([
   { label: '名称' },
-  { label: '温度(­°C)' },
+  // { label: '温度(­°C)' },
   // { label: '湿度(%)' },
-  { label: '风速(m/s)' },
+  // { label: '风速(m/s)' },
   { label: '粉尘浓度' }
   // { label: '水压(MPa)' },
 ])
@@ -73,7 +73,7 @@ watch(() => props.timeNowData, (newT, oldT) => {
 
     .safety-head-item {
       display: inline-block;
-      width: 25%;
+      width: 50%;
       height: 50px;
       background: url("/src/assets/images/fire/firehome/list-head.png") no-repeat center;
       background-position: 50% 0%;
@@ -111,7 +111,7 @@ watch(() => props.timeNowData, (newT, oldT) => {
 
         span {
           display: inline-block;
-          width: 25%;
+          width: 50%;
           height: 40px;
           overflow: hidden;
 
@@ -130,15 +130,15 @@ watch(() => props.timeNowData, (newT, oldT) => {
             font-size: 14px;
           }
 
-          &:nth-child(3) {
-            color: #089dff;
-            font-size: 14px;
-          }
+          // &:nth-child(3) {
+          //   color: #089dff;
+          //   font-size: 14px;
+          // }
 
-          &:nth-child(4) {
-            color: #089dff;
-            font-size: 14px;
-          }
+          // &:nth-child(4) {
+          //   color: #089dff;
+          //   font-size: 14px;
+          // }
         }
 
       }

+ 4 - 4
src/views/vent/dust/dustHome/components/dustWork.vue

@@ -2,11 +2,11 @@
   <div class="workJc">
     <div class="echart-workJc" :style="{ height: heightT }">
 
-      <div class="workJc-l">{{ echartDatas || 0 }}</div>
+      <div class="workJc-l">{{ echartDatas || '0' }}</div>
       <div class="workJc-r">
         <div class="workJc-r-box" v-for="(item, index) in fxLenged" :key="index">
           <div class="r-box-label">{{ item.name }}</div>
-          <div class="r-box-val">{{ item.value || 0 }}</div>
+          <div class="r-box-val">{{ item.value || '0' }}</div>
         </div>
       </div>
     </div>
@@ -15,12 +15,12 @@
         class="seamless-warp">
         <div class="card-box" v-for="(ite, ind) in cardList" :key="ind">
           <div class="card-l-label">{{ ite.title }}</div>
-          <div class="card-l-val">{{ ite.val || 0 }}</div>
+          <div class="card-l-val">{{ ite.val || '0' }}</div>
           <div class="card-r-label">{{ ite.label }}</div>
          
           <div class="card-r-des">
             <span>最大值:</span>
-            <span style="color:#089dff">{{ ite.val1 || 0 }}</span>
+            <span style="color:#089dff">{{ ite.val1 || '0' }}</span>
           </div>
         </div>
       </vue3-seamless-scroll>

+ 27 - 25
src/views/vent/dust/dustHome/index.vue

@@ -73,7 +73,8 @@
           <!-- 右中区域 -->
           <div class="right-c">
             <DanelBd :moduleName="'粉尘关联指标'" :contentStyle="{ contentH: '328px' }" :bgSize="'middle'">
-              <dustGlzb :dustGlzbData="dustGlzbData" />
+              <!-- <dustGlzb :dustGlzbData="dustGlzbData" />selectListBd1 -->
+              <dustGlzb :dustGlzbData="selectListBd1" />
             </DanelBd>
           </div>
           <!-- 右下区域 -->
@@ -137,13 +138,13 @@ let unInterTotal = ref(0);
 let pwData = reactive<any[]>([]);
 
 //粉尘关联指标数据
-let dustGlzbData = reactive<any[]>([
-  { label: '最高温度(°C)', val: '' },
-  { label: '环境湿度(%)', val: '' },
-  { label: '风速(m/s)', val: '' },
-  { label: '水压(Mpa)', val: '10' },
-  { label: '水阀', val: '--' },
-]);
+// let dustGlzbData = reactive<any[]>([
+//   { label: '最高温度(°C)', val: '' },
+//   { label: '环境湿度(%)', val: '' },
+//   { label: '风速(m/s)', val: '' },
+//   { label: '水压(Mpa)', val: '10' },
+//   { label: '水阀', val: '--' },
+// ]);
 
 //粉尘静态指标数据
 let selectListJt = reactive<any[]>([
@@ -168,7 +169,7 @@ function getMonitor() {
     await getDustWarningCntByTypeList()
     await getFireAreaInfoList();
     await getRealDataList();
-    await getGzmMaxBySensorTypeList()
+    // await getGzmMaxBySensorTypeList()
     if (timer) {
       timer = null;
     }
@@ -242,7 +243,8 @@ async function getRealSensorDataByTypeList() {
           humidity: el.humidity,
           windSpeed: el.windSpeed,
           waterPressure: el.waterPressure,
-          dust:el.dust
+          dust:el.dust,
+          pwList:el.pwList.length
         });
       }
 
@@ -307,26 +309,26 @@ async function getRealDataList() {
 }
 
 //粉尘关联指标数据
-async function getGzmMaxBySensorTypeList() {
-  let res = await getGzmMaxBySensorType()
-  if (res.length != 0) {
-    res.forEach(el => {
-      if (el.sensorType == 'M0201') {
-        dustGlzbData[0]['val'] = el.value || '--'
-      } else if (el.sensorType == 'M0202') {
-        dustGlzbData[1]['val'] = el.value || '--'
-      } else if (el.sensorType == 'M0302') {
-        dustGlzbData[2]['val'] = el.value || '--'
-      }
-    })
-  }
-}
+// async function getGzmMaxBySensorTypeList() {
+//   let res = await getGzmMaxBySensorType()
+//   if (res.length != 0) {
+//     res.forEach(el => {
+//       if (el.sensorType == 'M0201') {
+//         dustGlzbData[0]['val'] = el.value || '--'
+//       } else if (el.sensorType == 'M0202') {
+//         dustGlzbData[1]['val'] = el.value || '--'
+//       } else if (el.sensorType == 'M0302') {
+//         dustGlzbData[2]['val'] = el.value || '--'
+//       }
+//     })
+//   }
+// }
 
 onMounted(() => {
   getDustWarningCntByTypeList()
   getFireAreaInfoList();
   getRealDataList();
-  getGzmMaxBySensorTypeList()
+  // getGzmMaxBySensorTypeList()
   getMonitor();
 });
 onUnmounted(() => {

+ 1 - 1
src/views/vent/fire/fireHome/components/emptyJc.vue

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

+ 3 - 3
src/views/vent/fire/fireHome/components/fiberBunbleJc.vue

@@ -4,16 +4,16 @@
       <div class="jc-title">{{ item.type }}</div>
       <div class="jc-item">
         <span class="item-label">{{ `${item.label} : ` }}</span>
-        <span class="item-val">{{ `${item.val}` }}</span>
+        <span class="item-val">{{ `${item.val}` || '--' }}</span>
         <span class="item-dw">{{ item.unit }}</span>
       </div>
       <div class="jc-item1">
         <span class="item-label">{{ `${item.label1} : ` }}</span>
-        <span class="item-val">{{ item.val1 }}</span>
+        <span class="item-val">{{ item.val1 || '--' }}</span>
       </div>
       <div class="jc-item2">
         <span class="item-label">{{ `${item.label2} : ` }}</span>
-        <span class="item-val">{{ item.val2 }}</span>
+        <span class="item-val">{{ item.val2 || '--' }}</span>
       </div>
     </div>
   </div>

+ 1 - 1
src/views/vent/fire/fireHome/components/outFireJc.vue

@@ -3,7 +3,7 @@
     <div class="outFire-box" v-for="(item, index) in outFireList" :key="index">
       <div class="outFire-title">{{ item.title }}</div>
       <div class="outFire-label">{{ item.label }}</div>
-      <div class="outFire-val">{{ `${item.val}${item.dw}` }}</div>
+      <div class="outFire-val">{{ `${item.val}${item.dw}` || '--' }}</div>
     </div>
 
   </div>

+ 4 - 4
src/views/vent/fire/fireHome/components/safetyJc.vue

@@ -13,10 +13,10 @@
           :class="safetyHeadList.length == 4 ? 'safety-content-box' : safetyHeadList.length == 3 ? 'safety-content-box0' : 'safety-content-box1'"
           v-for="(ite, ind) in safetyList" :key="ind">
           <span v-if="ite.address">{{ ite.address }}</span>
-          <span v-if="ite.nd">{{ ite.nd }}</span>
-          <span v-if="ite.temp">{{ ite.temp }}</span>
-          <span v-if="ite.grade">{{ ite.grade }}</span>
-          <span v-if="ite.time">{{ ite.time }}</span>
+          <span v-if="ite.nd">{{ ite.nd || '--' }}</span>
+          <span v-if="ite.temp">{{ ite.temp || '--' }}</span>
+          <span v-if="ite.grade">{{ ite.grade || '--' }}</span>
+          <span v-if="ite.time">{{ ite.time || '--' }}</span>
         </div>
       </vue3-seamless-scroll>
     </div>

+ 1 - 1
src/views/vent/fire/fireHome/components/substationJc.vue

@@ -3,7 +3,7 @@
     <div class="substation-box" v-for="(item, index) in substationList" :key="index">
       <div class="substation-title">{{ item.title }}</div>
       <div class="substation-label">{{ item.label }}</div>
-      <div class="substation-val">{{ `${item.val}${item.dw}` }}</div>
+      <div class="substation-val">{{ `${item.val}${item.dw}` || '--' }}</div>
     </div>
 
   </div>

+ 6 - 6
src/views/vent/fire/fireHome/components/workJc.vue

@@ -6,7 +6,7 @@
       </div>
       <div class="workJc-r">
         <div class="workJc-r-level">低风险</div>
-        <div class="workJc-r-val">{{ echartDatas.value || 0 }}</div>
+        <div class="workJc-r-val">{{ echartDatas.value || '0' }}</div>
       </div>
     </div>
     <div class="card-workJc" :style="{ height: heightB }">
@@ -14,16 +14,16 @@
         class="seamless-warp">
         <div class="card-box" v-for="(ite, ind) in cardList" :key="ind">
           <div class="card-l-label">{{ ite.title }}</div>
-          <div class="card-l-val">{{ ite.val }}</div>
+          <div class="card-l-val">{{ ite.val || '0' }}</div>
           <div class="card-r-label">{{ ite.label }}</div>
           <div class="card-r-content">
             <div class="content-r-item">
-              <div class="item-label">{{ ite.temp || 0 }}</div>
-              <div class="item-val">{{ `${ite.tempVal}℃` || 0 }}</div>
+              <div class="item-label">{{ ite.temp || '--' }}</div>
+              <div class="item-val">{{ `${ite.tempVal}℃` || '0' }}</div>
             </div>
             <div class="content-r-item">
-              <div class="item-label">{{ ite.zb || 0 }}</div>
-              <div class="item-val">{{ ite.zbVal || 0 }}</div>
+              <div class="item-label">{{ ite.zb || '--' }}</div>
+              <div class="item-val">{{ ite.zbVal || '0' }}</div>
             </div>
           </div>
           <div class="card-r-des">