完成火灾及粉尘模块各个界面界面布局及功能调整-提交

src/locales/lang/zh-CN/routes/vent.json

@@ -8,7 +8,7 @@
    
     "fireMonitor": "变电硐室防灭火监控预警系统",
     "workFace": "工作面监测预警分析",
-    "beltConveyor": "带试运输机放灭火监测系统",
+    "beltConveyor": "带试运输机防灭火监测系统",
     "fireDistributionPoint": "安全监控系统预警分析",
     "fireZhud": "智能注氮系统监测分析",
     "fireZhuj": "智能灌浆系统监测分析"

src/views/vent/common/basicCard.vue

@@ -82,9 +82,13 @@
         }
 
         .item-vals {
+          width: 100%;
           color: #02bbe9;
-          font-family: douyuFont;
-          font-size: 16px;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
+          font-size: 18px;
+          font-weight: bold;
+          text-align: center;
         }
       }
     }

src/views/vent/common/basicCard1.vue

@@ -3,81 +3,162 @@
     <div class="card-box" v-for="(item, index) in cardContentLists1" :key="index">
       <div class="card-box-item">
         <div class="box-item-label">{{ item.label }}</div>
-        <div class="box-item-val">{{ item.val }}</div>
+        <div class="box-item-val">{{ item.value }}</div>
       </div>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-  import { ref, reactive, watch, defineProps } from 'vue';
-
-  let props = defineProps({
-    cardContentList1: {
-      type: Array,
-      default: () => {
-        return [];
-      },
+import { ref, reactive, watch, defineProps } from 'vue';
+
+let props = defineProps({
+  cardContentList1: {
+    type: Array,
+    default: () => {
+      return [];
     },
-  });
+  },
+});
 
-  let cardContentLists1 = ref<any[]>([]);
+let cardContentLists1 = ref<any[]>([]);
 
-  watch(
-    () => props.cardContentList1,
-    (newV, oldV) => {
-      console.log(newV, '粉尘卡片-----');
-      cardContentLists1.value = newV;
-    },
-    { immediate: true, deep: true },
-  );
+watch(
+  () => props.cardContentList1,
+  (newV, oldV) => {
+    console.log(newV, '粉尘卡片-----');
+    cardContentLists1.value = newV;
+  },
+  { immediate: true, deep: true },
+);
 </script>
 
 <style lang="less" scoped>
-  @font-face {
-    font-family: douyuFont;
-    src: url('../../../assets/font/douyuFont.otf');
-  }
+@font-face {
+  font-family: douyuFont;
+  src: url('../../../assets/font/douyuFont.otf');
+}
+
+.basicCard1 {
+  display: flex;
+  position: relative;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: 100%;
+  background-color: rgb(41 49 53 / 80%);
 
-  .basicCard1 {
+  .card-box {
     display: flex;
-    position: relative;
+    flex: 1;
     align-items: center;
-    justify-content: space-between;
-    width: 100%;
+    justify-content: center;
     height: 100%;
-    background-color: rgb(41 49 53 / 80%);
-
-    .card-box {
-      display: flex;
-      flex: 1;
-      align-items: center;
-      justify-content: center;
-      height: 100%;
-
-      .card-box-item {
-        position: relative;
-        width: 261px;
-        height: 102px;
-        background: url('../../../assets/images/workPlaceWarn/dust-nd.png') no-repeat center;
-        background-size: 100% 100%;
-
-        .box-item-label {
-          position: absolute;
-          top: 20px;
-          left: 115px;
-          color: #fff;
-        }
-
-        .box-item-val {
-          position: absolute;
-          top: 60px;
-          left: 150px;
-          color: #1fb3f7;
-          font-family: douyuFont;
-          font-size: 20px;
-        }
+
+    &:nth-child(1) .card-box-item {
+      position: relative;
+      // width: 261px;
+      width: 282px;
+      height: 102px;
+      background: url('../../../assets/images/workPlaceWarn/dust-nd.png') no-repeat center;
+      background-size: 100% 100%;
+
+      .box-item-label {
+        position: absolute;
+        top: 20px;
+        left: 115px;
+        color: #fff;
+        font-size: 14px;
+      }
+
+      .box-item-val {
+        position: absolute;
+        top: 60px;
+        left: 155px;
+        color: #1fb3f7;
+        font-family: "Microsoft YaHei", sans-serif;
+        font-size: 18px;
+        font-weight: bold;
+      }
+    }
+
+    &:nth-child(2) .card-box-item {
+      position: relative;
+      width: 282px;
+      height: 102px;
+      background: url('../../../assets/images/workPlaceWarn/zc-nd.png') no-repeat center;
+      background-size: 100% 100%;
+
+      .box-item-label {
+        position: absolute;
+        top: 20px;
+        left: 115px;
+        color: #fff;
+        font-size: 14px;
+      }
+
+      .box-item-val {
+        position: absolute;
+        top: 60px;
+        left: 155px;
+        color: #1fb3f7;
+        font-family: "Microsoft YaHei", sans-serif;
+        font-size: 18px;
+        font-weight: bold;
+      }
+    }
+
+    &:nth-child(3) .card-box-item {
+      position: relative;
+      width: 282px;
+      height: 102px;
+      background: url('../../../assets/images/workPlaceWarn/hc-nd.png') no-repeat center;
+      background-size: 100% 100%;
+
+      .box-item-label {
+        position: absolute;
+        top: 20px;
+        left: 115px;
+        color: #fff;
+        font-size: 14px;
+      }
+
+      .box-item-val {
+        position: absolute;
+        top: 60px;
+        left: 185px;
+        color: #1fb3f7;
+        font-family: "Microsoft YaHei", sans-serif;
+        font-size: 18px;
+        font-weight: bold;
+      }
+    }
+
+    &:nth-child(4) .card-box-item {
+      position: relative;
+      width: 282px;
+      height: 102px;
+      background: url('../../../assets/images/workPlaceWarn/bz-nd.png') no-repeat center;
+      background-size: 100% 100%;
+
+      .box-item-label {
+        position: absolute;
+        top: 20px;
+        left: 115px;
+        color: #fff;
+        font-size: 14px;
+      }
+
+      .box-item-val {
+        position: absolute;
+        top: 60px;
+        left: 155px;
+        color: #1fb3f7;
+        font-family: "Microsoft YaHei", sans-serif;
+        font-size: 18px;
+        font-weight: bold;
       }
     }
   }
+}
 </style>

src/views/vent/common/basicCard3.vue

@@ -108,7 +108,7 @@
         width: 100%;
         color: #fff;
         font-size: 16px;
-        font-weight: bolder;
+        // font-weight: bolder;
         text-align: center;
       }
 
@@ -185,7 +185,8 @@
 
       .card3-box-val {
         color: #0097db;
-        font-family: douyuFont;
+        // font-family: douyuFont;
+        font-family: "Microsoft YaHei", sans-serif;
         font-size: 14px;
       }
     }
@@ -210,7 +211,7 @@
         width: 100%;
         color: #fff;
         font-size: 16px;
-        font-weight: bolder;
+        // font-weight: bolder;
         text-align: center;
       }
 
@@ -287,7 +288,8 @@
 
       .card3-box-val {
         color: #0097db;
-        font-family: douyuFont;
+        // font-family: douyuFont;
+        font-family: "Microsoft YaHei", sans-serif;
         font-size: 14px;
       }
     }

src/views/vent/common/basicCard4.vue

@@ -91,7 +91,7 @@
         width: 100%;
         color: #fff;
         font-size: 14px;
-        font-weight: bold;
+        // font-weight: bold;
         text-align: center;
       }
 
@@ -123,7 +123,8 @@
 
             &:last-child {
               color: #01fefc;
-              font-family: douyuFont;
+              // font-family: douyuFont;
+              font-family: "Microsoft YaHei", sans-serif;
               font-size: 14px;
             }
           }
@@ -165,7 +166,7 @@
         width: 100%;
         color: #fff;
         font-size: 14px;
-        font-weight: bold;
+        // font-weight: bold;
         text-align: center;
       }
 
@@ -197,7 +198,8 @@
 
             &:last-child {
               color: #01fefc;
-              font-family: douyuFont;
+              // font-family: douyuFont;
+              font-family: "Microsoft YaHei", sans-serif;
               font-size: 14px;
             }
           }

src/views/vent/common/basicSensor.vue

@@ -89,7 +89,8 @@
       width: 100%;
       height: 40px;
       color: #fff;
-      font-family: douyuFont;
+      // font-family: douyuFont;
+      font-family: "Microsoft YaHei", sans-serif;
       font-size: 16px;
     }
 

src/views/vent/common/basicWorkBtn.vue

@@ -80,8 +80,9 @@
 
       .work-btn-text {
         color: #fff;
-        font-family: douyuFont;
-        font-size: 18px;
+        // font-family: douyuFont;
+        font-family: "Microsoft YaHei", sans-serif;
+        font-size: 16px;
       }
     }
 
@@ -104,12 +105,11 @@
 
       .work-btn-text {
         position: absolute;
-        top: 32px;
-        // left: 50%;
-        // transform: translate(-50%, 0);
+        top: 27px;
         width: 100%;
         color: #fff;
-        font-family: douyuFont;
+        // font-family: douyuFont;
+        font-family: "Microsoft YaHei", sans-serif;
         font-size: 16px;
         text-align: center;
       }

src/views/vent/dust/dustHome/components/dustFallDevice.vue

@@ -19,7 +19,7 @@
                 <div class="item-val">{{ unInterTotal }}</div>
             </div>
         </div>
-        <div class="fall-right-box">
+        <!-- <div class="fall-right-box">
             <div class="fall-table-head">
                 <div class="fall-head-item" v-for="(item, index) in tabHeadList" :key="index">{{ item.title }}</div>
             </div>
@@ -37,13 +37,13 @@
 
 
             </div>
-        </div>
+        </div> -->
     </div>
 </template>
 
 <script setup lang="ts">
 import { ref, reactive, defineProps, watch } from 'vue'
-import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
+// import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
 
 let props = defineProps({
     deviceTotal: {
@@ -71,31 +71,31 @@ let props = defineProps({
 })
 
 //table头
-let tabHeadList = reactive([
-    { title: '编号' },
-    { title: '名称' },
-    { title: '连接状态' },
-    { title: '喷雾状态' },
-])
+// let tabHeadList = reactive([
+//     { title: '编号' },
+//     { title: '名称' },
+//     { title: '连接状态' },
+//     { title: '喷雾状态' },
+// ])
 //table content
-let tabContentList = ref<any[]>([])
+// let tabContentList = ref<any[]>([])
 
-watch(() => props.pwData, (newP, oldP) => {
-    console.log(newP, 'newP------')
-    if (newP.length != 0) {
-        tabContentList.value = newP
-    }
-}, {
-    immediate: true,
-    deep: true
-})
+// watch(() => props.pwData, (newP, oldP) => {
+//     console.log(newP, 'newP------')
+//     if (newP.length != 0) {
+//         tabContentList.value = newP
+//     }
+// }, {
+//     immediate: true,
+//     deep: true
+// })
 
 
 </script>
 
 <style lang="less" scoped>
 .dustFallDevice {
-    display: flex;
+    // display: flex;
     position: relative;
     justify-content: space-between;
     width: 100%;
@@ -103,9 +103,10 @@ watch(() => props.pwData, (newP, oldP) => {
 
     .fall-left-box {
         position: relative;
-        width: calc(50% - 10px);
+        // width: calc(50% - 10px);
+        width: 100%;
         height: 100%;
-        margin-right: 10px;
+        // margin-right: 10px;
 
         .box-c {
             position: absolute;
@@ -120,8 +121,8 @@ watch(() => props.pwData, (newP, oldP) => {
 
         .box-left-t {
             position: absolute;
-            top: 0;
-            left: 0;
+            top: 10px;
+            left: 30px;
             align-items: center;
             width: 80px;
             height: 81px;
@@ -133,8 +134,8 @@ watch(() => props.pwData, (newP, oldP) => {
 
         .box-left-b {
             position: absolute;
-            top: 0;
-            right: 0;
+            top: 10px;
+            right: 30px;
             width: 80px;
             height: 81px;
             background: url('../../../../../assets/images/dust/dusthome/left-box3.png') no-repeat center;
@@ -143,8 +144,8 @@ watch(() => props.pwData, (newP, oldP) => {
 
         .box-right-t {
             position: absolute;
-            bottom: 0;
-            left: 0;
+            bottom: 10px;
+            left: 30px;
             width: 80px;
             height: 81px;
             background: url('../../../../../assets/images/dust/dusthome/left-box4.png') no-repeat center;
@@ -153,8 +154,8 @@ watch(() => props.pwData, (newP, oldP) => {
 
         .box-right-b {
             position: absolute;
-            right: 0;
-            bottom: 0;
+            right: 30px;
+            bottom: 10px;
             width: 80px;
             height: 81px;
             background: url('../../../../../assets/images/dust/dusthome/left-box5.png') no-repeat center;
@@ -183,107 +184,107 @@ watch(() => props.pwData, (newP, oldP) => {
 
     }
 
-    .fall-right-box {
-        width: 50%;
-        height: 100%;
-
-        .fall-table-head {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            width: 100%;
-            height: 32px;
-            border-bottom: 2px solid #1f8bb2;
-            background: linear-gradient(to bottom, rgb(12 40 55 / 30%), rgb(19 90 124 / 90%));
-
-            .fall-head-item {
-                display: flex;
-                justify-content: center;
-                height: 32px;
-                color: #1fb3f7;
-                font-size: 12px;
-                line-height: 32px;
-
-                &:nth-child(1) {
-                    width: 20%;
-
-                }
-
-                &:nth-child(2) {
-                    width: 30%;
-                }
-
-                &:nth-child(3) {
-                    width: 25%;
-                }
-
-                &:nth-child(4) {
-                    width: 25%;
-                }
-            }
-        }
-
-        .fall-table-content {
-            position: relative;
-            width: 100%;
-            height: calc(100% - 32px);
-            overflow: hidden;
-
-            .seamless-warp {
-                width: 100%;
-                height: 100%;
-
-                .fall-content-item {
-                    display: flex;
-                    align-items: center;
-                    justify-content: space-between;
-                    height: 34px;
-
-                    &:nth-child(odd) {
-                        background-color: #0b202e;
-                    }
-
-                    &:nth-child(even) {
-                        background-color: #0d3144;
-                    }
-
-                    .content-item-val {
-                        display: inline-block;
-                        height: 34px;
-                        overflow: hidden;
-                        color: #fff;
-                        font-size: 12px;
-                        line-height: 34px;
-                        text-align: center;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-
-                        &:nth-child(1) {
-                            width: 20%;
-                        }
-
-                        &:nth-child(2) {
-                            width: 30%;
-
-                        }
-
-                        &:nth-child(3) {
-                            width: 25%;
-                            color: #00ff91;
-                        }
-
-                        &:nth-child(4) {
-                            width: 25%;
-                        }
-
-                    }
-
-                }
-            }
-
-
-
-        }
-    }
+    // .fall-right-box {
+    //     width: 50%;
+    //     height: 100%;
+
+    //     .fall-table-head {
+    //         display: flex;
+    //         align-items: center;
+    //         justify-content: space-between;
+    //         width: 100%;
+    //         height: 32px;
+    //         border-bottom: 2px solid #1f8bb2;
+    //         background: linear-gradient(to bottom, rgb(12 40 55 / 30%), rgb(19 90 124 / 90%));
+
+    //         .fall-head-item {
+    //             display: flex;
+    //             justify-content: center;
+    //             height: 32px;
+    //             color: #1fb3f7;
+    //             font-size: 12px;
+    //             line-height: 32px;
+
+    //             &:nth-child(1) {
+    //                 width: 20%;
+
+    //             }
+
+    //             &:nth-child(2) {
+    //                 width: 30%;
+    //             }
+
+    //             &:nth-child(3) {
+    //                 width: 25%;
+    //             }
+
+    //             &:nth-child(4) {
+    //                 width: 25%;
+    //             }
+    //         }
+    //     }
+
+    //     .fall-table-content {
+    //         position: relative;
+    //         width: 100%;
+    //         height: calc(100% - 32px);
+    //         overflow: hidden;
+
+    //         .seamless-warp {
+    //             width: 100%;
+    //             height: 100%;
+
+    //             .fall-content-item {
+    //                 display: flex;
+    //                 align-items: center;
+    //                 justify-content: space-between;
+    //                 height: 34px;
+
+    //                 &:nth-child(odd) {
+    //                     background-color: #0b202e;
+    //                 }
+
+    //                 &:nth-child(even) {
+    //                     background-color: #0d3144;
+    //                 }
+
+    //                 .content-item-val {
+    //                     display: inline-block;
+    //                     height: 34px;
+    //                     overflow: hidden;
+    //                     color: #fff;
+    //                     font-size: 12px;
+    //                     line-height: 34px;
+    //                     text-align: center;
+    //                     text-overflow: ellipsis;
+    //                     white-space: nowrap;
+
+    //                     &:nth-child(1) {
+    //                         width: 20%;
+    //                     }
+
+    //                     &:nth-child(2) {
+    //                         width: 30%;
+
+    //                     }
+
+    //                     &:nth-child(3) {
+    //                         width: 25%;
+    //                         color: #00ff91;
+    //                     }
+
+    //                     &:nth-child(4) {
+    //                         width: 25%;
+    //                     }
+
+    //                 }
+
+    //             }
+    //         }
+
+
+
+    //     }
+    // }
 }
 </style>

src/views/vent/dust/dustWarnAnalysis/index.vue

@@ -4,30 +4,38 @@
       <basicTree :treeData="treeData" @selectChange="selectChange"></basicTree>
     </div>
     <div class="dustWarn-right-box">
-      <div class="warn-top-box">
-        <basicCard4 :cardData4="cardData4" :warningLevel="warningLevel" @toggleDustCards="toggleDustCards"></basicCard4>
-      </div>
-      <div class="warn-top-box1">
-        <basicCard5 :cardData5="cardData5"></basicCard5>
-      </div>
-      <div class="warn-bot-box">
-        <div class="search-area">
-          <div class="area-title">粉尘监测预警</div>
+      <div style="width:100%;height:100%"
+        v-if="cardData4.length != 0 || echartData.xData.length != 0 || echartData.yData.length != 0 || echartData.yData1.length != 0">
+        <div class="warn-top-box">
+          <basicCard4 :cardData4="cardData4" :warningLevel="warningLevel" @toggleDustCards="toggleDustCards"></basicCard4>
+        </div>
+        <div class="warn-top-box1">
+          <!-- <basicCard5 :cardData5="cardData5"></basicCard5> -->
+          <basicCard1 :cardContentList1="cardData5"></basicCard1>
         </div>
-        <div class="content-area">
-          <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+        <div class="warn-bot-box">
+          <div class="search-area">
+            <div class="area-title">粉尘监测预警</div>
+          </div>
+          <div class="content-area">
+            <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+          </div>
         </div>
       </div>
+      <div style="display: flex;align-items: center;justify-content: center;width:100%;height:100%;" v-else>
+        <img style="width:252px; height:172px" src="../../../../assets/images/nodata.png" alt="">
+      </div>
     </div>
 
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted,onUnmounted } from 'vue';
+import { ref, reactive, onMounted, onUnmounted } from 'vue';
 import basicTree from '../../common/basicTree.vue'
 import basicCard4 from '../../common/basicCard4.vue';
-import basicCard5 from '../../common/basicCard5.vue';
+// import basicCard5 from '../../common/basicCard5.vue';
+import basicCard1 from '../../common/basicCard1.vue'
 import basicEchartLine from '../../common/basicEchartLine.vue';
 import { getAreaTypeList, getRealSensorDataByType, getDustInfos, historyAndForecast } from './dustWarnAnalysis.api'
 
@@ -39,10 +47,10 @@ let warningLevel = ref('')//风险等级
 
 let cardData4 = reactive<any[]>([])
 let cardData5 = reactive<any[]>([
-  { id: 0, val: 0 },
-  { id: 1, val: 0 },
-  { id: 2, val: 0 },
-  { id: 3, val: 0 },
+  { id: 0, label:'粉尘浓度(mg/m³)',value:'' },
+  { id: 1, label:'总尘浓度(mg/m³)',value:''},
+  { id: 2, label:'呼尘加权容许浓度(mg/m³)',value:''},
+  { id: 3, label:'爆炸浓度(mg/m³)',value:''},
 ])
 
 
@@ -118,7 +126,7 @@ async function getRealSensorDataByTypeList() {
         ]
       })
     })
-    sensorCode.value =sensorCode.value ? sensorCode.value : cardData4[0]['sensorCode']
+    sensorCode.value = sensorCode.value ? sensorCode.value : cardData4[0]['sensorCode']
     //获取单项数据
     getDustInfosList()
   }
@@ -134,10 +142,10 @@ function toggleDustCards(data) {
 async function getDustInfosList() {
   let res = await getDustInfos({ sensorCode: sensorCode.value })
   console.log(res, '单项数据------')
-  cardData5[0].val = res.dustDensity
-  cardData5[1].val = res.dustDensityAverage
-  cardData5[2].val = res.dustDensityAverage40
-  cardData5[3].val = res.explodeDensity
+  cardData5[0].value = res.dustDensity
+  cardData5[1].value = res.dustDensityAverage
+  cardData5[2].value = res.dustDensityAverage40
+  cardData5[3].value = res.explodeDensity
 
   //获取粉尘图表数据
   historyAndForecastList(res.areaCode)
@@ -165,11 +173,11 @@ onMounted(() => {
   getMonitor()
 })
 onUnmounted(() => {
-    if (timer) {
-      clearTimeout(timer);
-      timer = null;
-    }
-  });
+  if (timer) {
+    clearTimeout(timer);
+    timer = null;
+  }
+});
 </script>
 
 <style lang="less" scoped>
@@ -226,7 +234,8 @@ onUnmounted(() => {
 
         .area-title {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }

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

@@ -5,34 +5,39 @@
     </div>
     <!-- 光钎，束管 -->
     <div class="composite-right-box">
-      <div class="gx-top-box" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <basicCard :cardContentList="cardContentList" />
-      </div>
-      <div :class="flagShow == 'gx' ? 'gx-center-box1' : 'gx-center-box'" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <div class="gx-center-item-title">
-          <div class="item-left">光钎测温系统温度实时监测</div>
-          <Select style="width: 180px" :options="gxSelectList" size="small" placeholder="请选择" v-model:value="gxSelect"
-            allowClear @change="pointChange" />
-
-        </div>
-        <div class="gx-center-item-content">
-          <basicEchartLine :gridV="gridV" :echartData="echartDataGx"></basicEchartLine>
+      <div style="width:100%;height:100%" v-if="echartDataGx.xData.length!=0 || echartDataGx.yData.length!=0 || echartDataGx.yData1.length!=0 || card3List.length!=0 || echartData.xData.length!=0 || echartData.yData.length!=0 || echartData.yData1.length!=0">
+        <div class="gx-top-box" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <basicCard :cardContentList="cardContentList" />
         </div>
+        <div :class="flagShow == 'gx' ? 'gx-center-box1' : 'gx-center-box'" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <div class="gx-center-item-title">
+            <div class="item-left">光钎测温系统温度实时监测</div>
+            <Select style="width: 180px" :options="gxSelectList" size="small" placeholder="请选择" v-model:value="gxSelect"
+              allowClear @change="pointChange" />
+
+          </div>
+          <div class="gx-center-item-content">
+            <basicEchartLine :gridV="gridV" :echartData="echartDataGx"></basicEchartLine>
+          </div>
 
-      </div>
-      <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
-      </div>
-      <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <div class="search-area">
-          <div class="area-title">束管系统监测</div>
-          <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
-            format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
         </div>
-        <div class="content-area">
-          <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+        <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
         </div>
+        <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <div class="search-area">
+            <div class="area-title">束管系统监测</div>
+            <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
+              format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
+          </div>
+          <div class="content-area">
+            <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+          </div>
 
+        </div>
+      </div>
+      <div style="display: flex;align-items: center;justify-content: center;width:100%;height:100%;" v-else>
+        <img style="width:252px; height:172px" src="../../../../assets/images/nodata.png" alt="">
       </div>
     </div>
 
@@ -303,7 +308,7 @@ onUnmounted(() => {
   width: calc(100% - 20px);
   // height: calc(100vh - 82px);
   height: 880px;
-  margin: 0 10px ;
+  margin: 0 10px;
   background: #282828;
 
   .composite-left-box {
@@ -344,7 +349,8 @@ onUnmounted(() => {
 
         .area-title {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }
@@ -377,7 +383,8 @@ onUnmounted(() => {
 
         .item-left {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }
@@ -402,7 +409,8 @@ onUnmounted(() => {
 
         .item-left {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }

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

@@ -1,6 +1,5 @@
 <template>
   <div class="fireDistributionPoint">
-   
     <div class="fireDis-right-box">
       <div class="woke-item-box">
         <basicSensor :sensorTitle="sensorTitle" :sensorList="sensorList" :headList="headList" />
@@ -15,7 +14,6 @@
         <basicSensor :sensorTitle="sensorTitleJD" :sensorList="sensorList3" :headList="headList" />
       </div>
     </div>
-
   </div>
 </template>
 <script lang="ts" setup>
@@ -30,7 +28,7 @@ let sensorTitleJD = ref('机电硐室及配电点传感器监测');
 
 let headList = reactive([
   { id: 0, title: '测点位置' },
-  { id: 1, title: '温度' },
+  { id: 1, title: '监测值' },
   { id: 2, title: '预警级别' },
   { id: 3, title: '时间' },
 ]);
@@ -91,7 +89,7 @@ async function getZcHfWdList() {
   if (res.length != 0) {
     sensorList.length=0
     res.forEach(el => {
-      sensorList.push({ name: el.nodePlacement, status: el.detectValue + '', warn: el.warningMsg, times: el.dateTime })
+      sensorList.push({ name: el.nodePlacement, status: el.detectValue + ' ('+ el.unit + ')', warn: el.warningMsg, times: el.dateTime })
     })
   }
 }
@@ -115,7 +113,7 @@ async function getMainTrafficYwList() {
   if (res.length != 0) {
     sensorList2.length=0
     res.forEach(el => {
-      sensorList2.push({ name: el.nodePlacement, status: el.detectValue + '', warn: el.warningMsg, times: el.dateTime })
+      sensorList2.push({ name: el.nodePlacement, status:el.detectValue + ' ('+ el.unit + ')', warn: el.warningMsg, times: el.dateTime })
     })
   }
 }
@@ -127,7 +125,7 @@ async function getDsWdList() {
   if (res.length != 0) {
     sensorList3.length=0
     res.forEach(el => {
-      sensorList3.push({ name: el.nodePlacement, status: el.detectValue + '', warn: el.warningMsg, times: el.dateTime })
+      sensorList3.push({ name: el.nodePlacement, status: el.detectValue + ' ('+ el.unit + ')', warn: el.warningMsg, times: el.dateTime })
     })
   }
 }

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

@@ -4,28 +4,34 @@
       <basicTree :treeData="treeData" @selectChange="selectChange"></basicTree>
     </div>
     <div class="composite-right-box">
-      <div class="composite-top-box">
-        <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
-      </div>
-      <div class="composite-bot-box">
-
-        <div class="search-area">
-          <div class="area-title">束管系统监测</div>
-          <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
-            format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
+      <div style="width:100%;height:100%"
+        v-if="card3List.length != 0 || echartData.xData.length != 0 || echartData.yData.length != 0 || echartData.yData1.length != 0">
+        <div class="composite-top-box">
+          <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
         </div>
+        <div class="composite-bot-box">
 
-        <div class="content-area">
-          <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
-        </div>
+          <div class="search-area">
+            <div class="area-title">束管系统监测</div>
+            <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
+              format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
+          </div>
+
+          <div class="content-area">
+            <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+          </div>
 
+        </div>
+      </div>
+      <div style="display: flex;align-items: center;justify-content: center;width:100%;height:100%;" v-else>
+        <img style="width:252px; height:172px" src="../../../../assets/images/nodata.png" alt="">
       </div>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted,onUnmounted } from 'vue'
+import { ref, reactive, onMounted, onUnmounted } from 'vue'
 import basicCard3 from '../../common/basicCard3.vue';
 import basicEchartLine from '../../common/basicEchartLine.vue';
 import basicTree from '../../common/basicTree.vue'
@@ -128,7 +134,7 @@ function toggleChange(title) {
 }
 //获取密闭图表数据
 async function getMbHistoryDataList() {
- 
+
   let res = await getMbHistoryData({ areaCode: areaCode.value, type: type.value, startTime: TimeRange.value[0], endTime: TimeRange.value[1] })
   console.log(res, '密闭图表数据------')
   echartData.xData.length = 0
@@ -206,7 +212,8 @@ onUnmounted(() => {
 
         .area-title {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }

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

@@ -19,7 +19,8 @@
       </div>
     </div>
     <div class="card-workJc" :style="{ height: heightB }">
-      <vue3-seamless-scroll hover-stop="true" :list="cardList" :hover="true" :step="0.15" :copy-num="3" class="seamless-warp">
+      <vue3-seamless-scroll hover-stop="true" :list="cardList" :hover="true" :step="0.15" :copy-num="3"
+        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>
@@ -27,7 +28,7 @@
           <div class="card-r-label">{{ ite.label }}</div>
           <div class="card-r-content">
             <span>{{ `${ite.title1} : ` }}</span>
-            <span>{{ `${ite.val1}°C` }}</span>
+            <span>{{ `${ite.val1} 摄氏度` }}</span>
           </div>
           <!-- <div class="card-r-content1">
             <span>{{ `${ite.title2} : ` }}</span>

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

@@ -326,7 +326,7 @@ async function getFireAreaInfoListDs() {
     dsCode.value = dsCode.value ? dsCode.value : selectListDs[0].value;
     let dataName = dataDs.filter((v) => v.areaName == dsCode.value)[0];
     outFireData.push(
-      { title: '光钎预警', val: dataName.infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
+      { title: '光纤预警', val: dataName.infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
       {
         title: '一氧化碳预警',
         val: dataName.infoTypeTwo.returnAirCornerCO,

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

@@ -4,39 +4,42 @@
       <basicTree :treeData="treeData" @selectChange="selectChange"></basicTree>
     </div>
     <div class="fireMon-right-box">
-      <!-- 光钎 -->
-      <div class="fire-top-box" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <basicCard2 :cardContentList2="cardContentList2"></basicCard2>
-      </div>
-      <div :class="flagShow == 'gx' ? 'fire-bot-box' : 'fire-bot-box1'" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <div class="gx-center-item-title">
-          <div class="item-left">光钎测温系统温度实时监测</div>
-          <Select style="width: 180px" :options="gxSelectList" size="small" placeholder="请选择" v-model:value="gxSelect"
-            allowClear @change="pointChange" />
-
-        </div>
-        <div class="gx-center-item-content">
-          <basicEchartLine :gridV="gridV" :echartData="echartDataGx"></basicEchartLine>
+      <div style="width:100%;height:100%" v-if="echartDataGx.xData.length!=0||echartDataGx.yData.length!=0 || echartDataGx.yData1.length!=0 || card3List.length!=0 || echartData.xData.length!=0 || echartData.yData.length!=0 || echartData.yData1.length!=0 ">
+        <!-- 光钎 -->
+        <div class="fire-top-box" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <basicCard2 :cardContentList2="cardContentList2"></basicCard2>
         </div>
+        <div :class="flagShow == 'gx' ? 'fire-bot-box' : 'fire-bot-box1'" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <div class="gx-center-item-title">
+            <div class="item-left">光钎测温系统温度实时监测</div>
+            <Select style="width: 180px" :options="gxSelectList" size="small" placeholder="请选择" v-model:value="gxSelect"
+              allowClear @change="pointChange" />
+          </div>
+          <div class="gx-center-item-content">
+            <basicEchartLine :gridV="gridV" :echartData="echartDataGx"></basicEchartLine>
+          </div>
 
-      </div>
-      <!-- 束管 -->
-      <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
-      </div>
-      <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <div class="search-area">
-          <div class="area-title">束管系统监测</div>
-          <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
-            format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
         </div>
-        <div class="content-area">
-          <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+        <!-- 束管 -->
+        <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
         </div>
+        <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <div class="search-area">
+            <div class="area-title">束管系统监测</div>
+            <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
+              format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
+          </div>
+          <div class="content-area">
+            <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+          </div>
 
+        </div>
+      </div>
+      <div style="display: flex;align-items: center;justify-content: center;width:100%;height:100%;" v-else>
+        <img style="width:252px; height:172px" src="../../../../assets/images/nodata.png" alt="">
       </div>
     </div>
-
   </div>
 </template>
 
@@ -264,7 +267,6 @@ async function getSgjcRealDataByPointCodeList() {
 }
 //获取束管曲线数据
 async function getSgjcHistoryDataList() {
-
   let res = await getSgjcHistoryData({ pointCode: pointCode.value, type: gasType.value, startTime: TimeRange.value[0], endTime: TimeRange.value[1] })
   console.log(res, '束管曲线数据-------')
   echartData.xData.length = 0
@@ -342,7 +344,8 @@ onMounted(() => {
 
         .item-left {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }
@@ -368,7 +371,8 @@ onMounted(() => {
 
         .item-left {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }
@@ -401,7 +405,8 @@ onMounted(() => {
 
         .area-title {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }

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

@@ -4,38 +4,44 @@
       <basicTree :treeData="treeData" @selectChange="selectChange"></basicTree>
     </div>
     <div class="workPlace-right-box">
-      <!-- 光钎 -->
-      <div class="top-box-card" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <basicCard :cardContentList="cardContentList" />
-      </div>
-      <div class="top-box-btn" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <basicWorkBtn :workBtnList="workBtnList" @btnToggle="btnToggle" />
-      </div>
-      <div class="center-box" v-if="flagShow == 'gx' || flagShow == 'all'">
-        <basicEchartLine :gridV="gridV" :echartData="echartDataGx" />
-      </div>
+      <div style="width:100%;height:100%"
+        v-if="workBtnList.length != 0 || echartDataGx.xData.length != 0 || echartDataGx.yData.length != 0 || echartDataGx.yData1.length != 0 || card3List.length != 0 || echartData.xData.length != 0 || echartData.yData.length != 0 || echartData.yData1.length != 0">
+        <!-- 光钎 -->
+        <div class="top-box-card" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <basicCard :cardContentList="cardContentList" />
+        </div>
+        <div class="top-box-btn" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <basicWorkBtn :workBtnList="workBtnList" @btnToggle="btnToggle" />
+        </div>
+        <div class="center-box" v-if="flagShow == 'gx' || flagShow == 'all'">
+          <basicEchartLine :gridV="gridV" :echartData="echartDataGx" />
+        </div>
 
 
-      <!-- 束管 -->
-      <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
-      </div>
-      <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
-        <div class="search-area">
-          <div class="area-title">束管系统监测</div>
-          <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
-            format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
-        </div>
-        <div class="content-area">
-          <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+        <!-- 束管 -->
+        <div class="composite-top-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <basicCard3 :card3List="card3List" :warningLevel="warningLevel" @toggleChange="toggleChange"></basicCard3>
         </div>
+        <div class="composite-bot-box" v-if="flagShow == 'sg' || flagShow == 'all'">
+          <div class="search-area">
+            <div class="area-title">束管系统监测</div>
+            <RangePicker v-model="TimeRange" size="small" style="width: 260px" :show-time="{ format: 'HH:mm:ss' }"
+              format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" @change="onDataChange" />
+          </div>
+          <div class="content-area">
+            <basicEchartLine :gridV="gridV" :echartData="echartData"></basicEchartLine>
+          </div>
 
-      </div>
-      <!-- 通用 -->
-      <div :class="flagShow == 'sg' ? 'bot-box1' : 'bot-box'">
-        <div class="bot-box-card" v-for="(item, index) in botCardList" :key="index">
-          <basicSensor :sensorTitle="item.title" :sensorList="item.sensorList" :headList="headList" />
         </div>
+        <!-- 通用 -->
+        <div :class="flagShow == 'sg' ? 'bot-box1' : 'bot-box'">
+          <div class="bot-box-card" v-for="(item, index) in botCardList" :key="index">
+            <basicSensor :sensorTitle="item.title" :sensorList="item.sensorList" :headList="headList" />
+          </div>
+        </div>
+      </div>
+      <div style="display: flex;align-items: center;justify-content: center;width:100%;height:100%;" v-else>
+        <img style="width:252px; height:172px" src="../../../../assets/images/nodata.png" alt="">
       </div>
     </div>
 
@@ -463,7 +469,8 @@ onMounted(() => {
 
         .area-title {
           color: #fff;
-          font-family: douyuFont;
+          // font-family: douyuFont;
+          font-family: "Microsoft YaHei", sans-serif;
           font-size: 16px;
         }
       }