预警页面浏览器兼容调整

src/views/vent/monitorManager/alarmMonitor/fire/closeWall.vue

@@ -261,10 +261,10 @@ watch(() => props.listData, (val) => {
         justify-content: space-between;
         background: url('../../../../../assets/images/fire/bj1.png') no-repeat center;
         background-size: 100% 100%;
-
+        align-items: center;
         .box {
             display: flex;
-
+            margin-top: 10px !important;
             &:nth-child(1) {
                 justify-content: space-around;
                 align-items: center;

src/views/vent/monitorManager/alarmMonitor/index.vue

@@ -168,12 +168,8 @@
               <div class="icon"></div>
             </div>
             <div class="item-monitor-box">
-              <span class="title">瓦斯预警监测</span>
-              <span :class="centerData.ws == '正常' ? 'value' : 'value1'">{{ centerData.ws }}</span>
-              <div class="">
-                <span class="title">矿井瓦斯鉴定等级监测</span>
-                <span class="value">低瓦斯</span>
-              </div>
+              <span class="title">粉尘预警监测</span>
+              <span :class="centerData.fc == '正常' ? 'value' : 'value1'">{{ centerData.fc }}</span>
             </div>
           </div>
           <div class="item item4">
@@ -181,8 +177,12 @@
               <div class="icon"></div>
             </div>
             <div class="item-monitor-box">
-              <span class="title">粉尘预警监测</span>
-              <span :class="centerData.fc == '正常' ? 'value' : 'value1'">{{ centerData.fc }}</span>
+              <span class="title">瓦斯预警监测</span>
+              <span :class="centerData.ws == '正常' ? 'value' : 'value1'">{{ centerData.ws }}</span>
+              <div class="">
+                <span class="title">矿井瓦斯鉴定等级监测</span>
+                <span class="value">低瓦斯</span>
+              </div>
             </div>
           </div>
           <div class="item item5">
@@ -235,25 +235,7 @@
       </div>
     </div>
     <div class="lr right-box">
-      <ventBox1>
-        <template #title>
-          <div class="monitor-title" @click="showModal('dust')">粉尘预警监测</div>
-        </template>
-        <template #container>
-
-          <!-- <div class="dust-monitor">
-            <div v-for="(item, index) in dustMonitor" :key="index" class="item-box">
-              <div class="title">{{ item.title }}</div>
-              <div class="value">0个</div>
-            </div>
-          </div> -->
-
-          <BarSingle :xAxisData="xAxisData" :dataSource="dustData.levels" height="332px" :chartsColumns="chartsColumns"
-            :option="option" :color="colors" :fontColor="fontColor" />
-        </template>
-      </ventBox1>
-
-      <ventBox1 class="vent-margin-t-10">
+      <ventBox1 >
         <template #title>
           <div class="monitor-title" @click="showModal('gas')">瓦斯预警监测</div>
         </template>
@@ -286,6 +268,23 @@
           </div>
         </template>
       </ventBox1>
+      <ventBox1 class="vent-margin-t-10">
+        <template #title>
+          <div class="monitor-title" @click="showModal('dust')">粉尘预警监测</div>
+        </template>
+        <template #container>
+
+          <!-- <div class="dust-monitor">
+            <div v-for="(item, index) in dustMonitor" :key="index" class="item-box">
+              <div class="title">{{ item.title }}</div>
+              <div class="value">0个</div>
+            </div>
+          </div> -->
+
+          <BarSingle :xAxisData="xAxisData" :dataSource="dustData.levels" height="332px" :chartsColumns="chartsColumns"
+            :option="option" :color="colors" :fontColor="fontColor" />
+        </template>
+      </ventBox1>
     </div>
   </div>
   <DetailModal v-if="isShowDialog" v-model:visible="modalVisible" :monitor-data="dataSource" @register="register"
@@ -1226,16 +1225,10 @@ onUnmounted(() => {
           left: 420px;
 
           .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-gas.svg');
+            background-image: url('/@/assets/images/vent/alarm/icon-dust.svg');
           }
 
-          .item-monitor-box {
-            top: -155px;
-
-            &::before {
-              top: 10px;
-            }
-          }
+          
         }
 
         .item4 {
@@ -1243,9 +1236,15 @@ onUnmounted(() => {
           left: 390px;
 
           .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-dust.svg');
+            background-image: url('/@/assets/images/vent/alarm/icon-gas.svg');
           }
+          .item-monitor-box {
+            top: -155px;
 
+            &::before {
+              top: 10px;
+            }
+          }
         }
 
         .item5 {

src/views/vent/monitorManager/nitrogen/components/nitrogenHome.vue

@@ -3,7 +3,7 @@
     <div v-show="monitorDataGroupFlag == 1" id="compressorCss3D"  class="threejs-Object-CSS compressorCss3D-box"
         style="width: 100%; height: 100%; position: absolute; pointer-events: none; overflow: hidden; z-index: 2; top: 0px; left: 0px">
         <!-- <a-spin :spinning="loading" /> -->
-        <div  v-for="(groupNum, index) in monitorDataGroupNum" :key="index" class="modal-monitor">
+        <div  v-for="(groupNum, index) in monitorDataGroupNum1" :key="index" class="modal-monitor">
           <fourBorderBg :class="`kyj${groupNum}`" :id="`nitrogenMonitor${groupNum}`">
             <div class="title">{{ groupNum }}号空压机 </div>
             <div class="monitor-item">
@@ -49,11 +49,59 @@
           </fourBorderBg>
         </div>
     </div>
+    <div v-show="monitorDataGroupFlag == 2" id="compressorCss3D1" class="threejs-Object-CSS compressorCss3D-box"
+        style="width: 100%; height: 100%; position: absolute; pointer-events: none; overflow: hidden; z-index: 3; top: 0px; left: 0px">
+        <div  v-for="(groupNum, index) in monitorDataGroupNum2" :key="index" class="modal-monitor">
+            <fourBorderBg :class="`kyj${groupNum}`" :id="`nitrogenMonitor${groupNum}`">
+              <div class="title">{{ groupNum }}号空压机 </div>
+              <div class="monitor-item">
+                <span class="monitor-title">机头温度:</span>
+                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_HeadTemp`] ?
+                  monitorData[`PRE${groupNum}_CPR_HeadTemp`] : '-' }}</span><span class="unit"></span>℃</span>
+              </div>
+              <div class="monitor-item">
+                <span class="monitor-title">冷却温度:</span>
+                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_CoolantTemp`] ?
+                  monitorData[`PRE${groupNum}_CPR_CoolantTemp`] : '-' }}</span><span class="unit">℃</span></span>
+              </div>
+              <div class="monitor-item">
+                <span class="monitor-title">排气温度:</span>
+                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_ExhaustTemp`] ? monitorData[`PRE${groupNum}_CPR_ExhaustTemp`] : '-' }}</span><span class="unit">℃</span></span>
+              </div>
+              <div class="signal-item">
+                <div class="signal"><span class="monitor-title">运行信号</span><span
+                    :class="{ 'signal-round': true, 'signal-round-run': monitorData[`PRE${groupNum}_MOT_Running`] == '1', 'signal-round-gry': monitorData[`PRE${groupNum}_MOT_Running`] != '1' }"></span>
+                </div>
+                <div class="signal"><span class="monitor-title">故障信号</span><span
+                    :class="{ 'signal-round': true, 'signal-round-warning': monitorData[`PRE${groupNum}_MOT_Fault`] == '1', 'signal-round-gry': monitorData[`PRE${groupNum}_MOT_Fault`] != '1' }"></span>
+                </div>
+              </div>
+            </fourBorderBg>
+            <fourBorderBg :class="`cqg${groupNum}`" :id="`cqgMonitor${groupNum}`">
+              <div class="title">{{ groupNum }}号储气罐 </div>
+              <div class="monitor-item">
+                <span class="monitor-title">气囊温度:</span>
+                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_VLS_Temp`] ?
+                  monitorData[`PRE${groupNum}_VLS_Temp`] : '-' }}</span><span class="unit">℃</span></span>
+              </div>
+              <!-- <div class="monitor-item">
+              <span class="monitor-title">气囊压力<span class="unit"></span>:</span>
+              <span class="monitor-val"><span class="val">{{ monitorData[groupNum - 1] && monitorData[groupNum - 1]['airReceiverPress'] ?
+                monitorData[groupNum - 1]['airReceiverPress'] : '-' }}</span><span class="unit">Mpa</span></span>
+            </div>
+            <div class="monitor-item">
+              <span class="monitor-title">气囊流量<span class="unit"></span>:</span>
+              <span class="monitor-val"><span class="val">{{ monitorData[groupNum - 1] && monitorData[groupNum - 1]['airReceiverFlow'] ?
+                monitorData[groupNum - 1]['airReceiverFlow'] : '-' }}</span><span class="unit">m³/k</span></span>
+            </div> -->
+            </fourBorderBg>
+          </div>
+    </div>
     <div class="nitrogen-home">
-      <!-- <div style="position: absolute; color: #fff; top: 30px; pointer-events: auto; display: flex;">
+      <div style="position: absolute; color: #fff; top: 30px; pointer-events: auto; display: flex;">
         <span class="tab-button-box" :class="{'tab-button-box-active': monitorDataGroupFlag == 1}" @click="setMonitorGroupNum(monitorDataGroupNum1, 1)">压风系统1</span>
         <span class="tab-button-box" :class="{ 'tab-button-box-active': monitorDataGroupFlag == 2 }" @click="setMonitorGroupNum(monitorDataGroupNum2, 2)">压风系统2</span>
-      </div> -->
+      </div>
       <div class="total-data">
         <div class="item">总流量(m³/min)：<span class="val">{{ monitorData[`PreSys_TotalOutPipeFlow${monitorDataGroupFlag}`] ? monitorData[`PreSys_TotalOutPipeFlow${monitorDataGroupFlag}`] : '-' }}</span></div>
         <div class="item">总压力(bar)：<span class="val">{{ monitorData[`PreSys_TotalOutPipePre${monitorDataGroupFlag}`] ? monitorData[`PreSys_TotalOutPipePre${monitorDataGroupFlag}`] : '-' }}</span></div>
@@ -161,10 +209,10 @@ import fourBorderBg from '../../../comment/components/fourBorderBg.vue'
 import { mountedThree, destroy, setModelType, clearCssText } from '../nitrogen.threejs'
 import { list } from '../nitrogen.api'
 import ventBox1 from '/@/components/vent/ventBox1.vue'
-import { monitorDataGroupNum1, monitorDataGroupNum2, monitorDataGroupNum3, airCompressorState, showMonitorData, monitorData } from '../nitrogen.data'
+import { monitorDataGroupNum1, monitorDataGroupNum2, airCompressorState, showMonitorData, monitorData } from '../nitrogen.data'
 
 const loading = ref(true)
-const monitorDataGroupNum = ref(4)
+const monitorDataGroupNum = ref(monitorDataGroupNum1)
 const monitorDataGroupFlag = ref(1)
 const kyjs = ['1号空压机', '2号空压机', '3号空压机', '4号空压机'];
 const cqgs = ['1号储气罐', '2号储气罐', '3号储气罐', '4号储气罐'];
@@ -178,7 +226,7 @@ async function getMonitor(flag?) {
       if (timer) {
         timer = null;
       }
-      await getMonitor(false);
+      await getMonitor();
     }, flag ? 0 : 1000);
   }
 };
@@ -186,6 +234,142 @@ async function getMonitor(flag?) {
 async function getDataSource() {
   const res = await list({ devicetype: 'forcFan', pagetype: 'normal' });
   let dataSource = res.msgTxt[0].datalist[0];
+  // dataSource =  
+  //   {
+  //     "msgType": null,
+  //     "deviceID": "1705212847586627592",
+  //     "strname": "压风机系统",
+  //     "strinstallpos": "压风机系统",
+  //     "fsectarea": "null",
+  //     "stationname": "压风机系统分站",
+  //     "deviceType": "forcFan",
+  //     "typeName": null,
+  //     "netStatus": 1,
+  //     "warnFlag": 0,
+  //     "warnLevel": null,
+  //     "warnLevel_str": null,
+  //     "warnTime": null,
+  //     "readTime": "2023-10-24 08:47:27",
+  //     "warnDes": "",
+  //     "frontGateOpenCtrl": null,
+  //     "rearGateOpenCtrl": null,
+  //     "readData": {
+  //       "PRE1_MOT_PhaseATemp": "526",
+  //       "PRE3_CPR_CoolantTemp": "12",
+  //       "PRE4_CPR_HeadTemp": "13",
+  //       "PRE2_MOT_PhaseATempAlarm": "0",
+  //       "PRE5_MOT_Fault": "0",
+  //       "PRE4_MOT_PhaseATempStop": "0",
+  //       "PRE4_CPR_LoadPre": "65",
+  //       "PRE5_CPR_LoadPre": "62",
+  //       "PRE4_MOT_CtrlMode": "1",
+  //       "PRE2_CPR_LoadorUnload": "1",
+  //       "PRE3_MOT_PhaseBTemp": "133",
+  //       "PRE1_CPR_ExhaustPre": "66",
+  //       "PRE1_MOT_PhaseATempAlarm": "0",
+  //       "PRE5_CPR_UnLoadPre": "69",
+  //       "PRE4_MOT_PhaseATemp": "129",
+  //       "PRE5_MOT_PhaseCTemp": "685",
+  //       "PRE5_MOT_PhaseATemp": "681",
+  //       "PRE5_VLS_Temp": "590",
+  //       "PRE1_CPR_LoadTime": "8344",
+  //       "PRE2_CPR_LoadTime": "5553",
+  //       "PRE4_CPR_LoadorUnload": "0",
+  //       "PRE5_MOT_PhaseATempAlarm": "0",
+  //       "PRE3_CPR_LoadTime": "4511",
+  //       "PRE5_CPR_LoadTime": "6032",
+  //       "PRE1_MOT_PhaseATempStop": "0",
+  //       "PRE2_MOT_CompProtFault": "0",
+  //       "PRE5_MOT_PhaseATempStop": "0",
+  //       "PRE3_MOT_PhaseATempStop": "0",
+  //       "PRE1_VLS_Temp": "436",
+  //       "PRE2_CPR_ExhaustPre": "71",
+  //       "PRE5_MOT_CtrlMode": "1",
+  //       "PRE3_CPR_ExhaustTemp": "10",
+  //       "PRE3_MOT_TotalRunTime": "5342",
+  //       "P RE2_MOT_PhaseATemp": "541",
+  //       "PRE4_MOT_PhaseCTemp": "130",
+  //       "PRE4_MOT_PhaseATempAlarm": "0",
+  //       "timestamp": "1698108447720",
+  //       "PRE3_VLS_Temp": "219",
+  //       "PRE1_HostorLoc": "0",
+  //       "PRE2_MOT_Running": "1",
+  //       "PRE1_CPR_LoadPre": "65",
+  //       "PRE1_MOT_Running": "1",
+  //       "PRE4_MOT_Fault": "0",
+  //       "PRE2_CPR_LoadPre": "65",
+  //       "PRE3_MOT_Running": "0",
+  //       "PRE4_MOT_Running": "0",
+  //       "PRE3_CPR_LoadPre": "65",
+  //       "PRE1_MOT_CtrlMode": "1",
+  //       "PRE3_MOT_CtrlMode": "1",
+  //       "PRE3_CPR_LoadorUnload": "0",
+  //       "PRE2_MOT_PhaseCTemp": "550",
+  //       "PRE1_CPR_CoolantTemp": "71",
+  //       "PRE1_MOT_PhaseBTemp": "539",
+  //       "PRE3_MOT_PhaseATempAlarm": "0",
+  //       "PRE5_MOT_Running": "1",
+  //       "PRE1_MOT_Fault": "0",
+  //       "PRE4_CPR_ExhaustPre": "66",
+  //       "PRE4_CPR_CoolantTemp": "12",
+  //       "PRE5_CPR_ExhaustTemp": "76",
+  //       "PRE2_CPR_HeadTemp": "89",
+  //       "PRE3_MOT_PhaseCTemp": "135",
+  //       "PRE4_CPR_LoadTime": "5084",
+  //       "sign": "0",
+  //       "PRE1_CPR_UnLoadPre": "72",
+  //       "PRE4_HostorLoc": "0",
+  //       "PRE4_MOT_CompProtFault": "0",
+  //       "PRE1_CPR_LoadorUnload": "1",
+  //       "PRE3_CPR_ExhaustPre": "68",
+  //       "PRE2_CPR_ExhaustTemp": "77",
+  //       "PRE2_MOT_PhaseATempStop": "0",
+  //       "PRE5_MOT_CompProtFault": "0",
+  //       "PRE2_MOT_Fault": "0",
+  //       "PRE5_MOT_PhaseBTemp": "676",
+  //       "PRE3_MOT_PhaseATemp": "134",
+  //       "PRE4_MOT_PhaseBTemp": "130",
+  //       "PRE2_CPR_CoolantTemp": "66",
+  //       "PRE3_HostorLoc": "0",
+  //       "PRE4_MOT_TotalRunTime": "5104",
+  //       "PRE1_MOT_TotalRunTime": "8416",
+  //       "PRE3_MOT_CompProtFault": "0",
+  //       "PRE3_MOT_Fault": "0",
+  //       "PRE4_CPR_UnLoadPre": "72",
+  //       "PRE1_CPR_HeadTemp": "97",
+  //       "PRE2_HostorLoc": "0",
+  //       "PRE2_MOT_PhaseBTemp": "562",
+  //       "PRE3_CPR_HeadTemp": "13",
+  //       "PRE2_MOT_TotalRunTime": "5586",
+  //       "PRE5_CPR_HeadTemp": "95",
+  //       "PRE3_CPR_UnLoadPre": "72",
+  //       "PRE4_VLS_Temp": "166",
+  //       "PRE5_CPR_CoolantTemp": "70",
+  //       "PRE1_MOT_CompProtFault": "0",
+  //       "PRE5_MOT_TotalRunTime": "7825",
+  //       "PRE2_MOT_CtrlMode": "1",
+  //       "PRE5_CPR_ExhaustPre": "68",
+  //       "PRE1_MOT_PhaseCTemp": "544",
+  //       "PRE5_CPR_LoadorUnload": "1",
+  //       "PRE2_CPR_UnLoadPre": "72",
+  //       "PRE4_CPR_ExhaustTemp": "11",
+  //       "PRE2_VLS_Temp": "445",
+  //       "isRun": "-2",
+  //       "PRE5_HostorLoc": "0",
+  //       "PRE1_CPR_ExhaustTemp": "68"
+  //     },
+  //     "readDataDes": null,
+  //     "summaryHour": [],
+  //     "summaryDay": [],
+  //     "history": [],
+  //     "totalInfo": null,
+  //     "sign": null,
+  //     "cameras": [],
+  //     "links": [],
+  //     "other1": null,
+  //     "other2": null,
+  //     "other3": null
+  //   }
   if(dataSource){
     monitorData.value = Object.assign(dataSource, dataSource.readData);
   }
@@ -202,6 +386,12 @@ async function getDataSource() {
   loading.value = false
 };
 
+function setMonitorGroupNum(num, flag){
+  
+  monitorDataGroupNum.value = num
+  monitorDataGroupFlag.value = flag
+}
+
 function handlerDevice(data) {
   // if (data.length < 1) return
   // handleAirCompressor({ id: data.id, compressRunF1: data.compressRunSigF1 }).then(res => {
@@ -231,7 +421,7 @@ watch(monitorDataGroupFlag, (newVal) => {
 })
 
 onMounted(async () => {
-  mountedThree(monitorDataGroupNum3).then(async() => {
+  mountedThree(monitorDataGroupNum1, monitorDataGroupNum2).then(async() => {
     await getMonitor(true)
     setModelType('compressor1')
   })