更新

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

@@ -2,7 +2,7 @@
   <div class="fireHome">
     <!-- 模型区域 -->
     <!-- <div class="moduleArea">
-      <iframe src="http://82.157.13.146:18224/valkyrja/" width="100%" height="100%" frameborder="0"></iframe>
+      <iframe src="http://82.157.13.146:18224/valkyrja" width="100%" height="100%" frameborder="0"></iframe>
     </div> -->
     <div class="main-container">
       <div class="left-area">
@@ -14,7 +14,7 @@
               <div>监测区域</div>
             </div>
             <div class="tcontent-c">
-              <div style="margin-bottom: 10px; color: #1fb3f7; font-size: 20px">低风险</div>
+              <div style="margin-bottom: 10px; color: #1fb3f7; font-size: 24px">低风险</div>
               <div style="color: #fff; font-size: 14px">自燃倾向性等级 : 容易自燃</div>
             </div>
             <div class="tcontent-r">火灾风险</div>
@@ -23,43 +23,28 @@
         <!-- 左中区域 -->
         <div class="left-c">
           <DanelBd :moduleName="'工作面风险监测'" :contentStyle="{ contentH: '430px' }">
-            <workJc
-              :heightT="'30%'"
-              :heightB="'70%'"
-              :echartData="echartDataWork"
-              :cardData="cardData"
-            />
+            <workJc :heightT="'30%'" :heightB="'70%'" :echartData="echartDataWork" :cardData="cardData" />
           </DanelBd>
         </div>
         <!-- 左下区域 -->
         <div class="left-b">
           <DanelBd :moduleName="'密闭采空区监测系统'" :contentStyle="{ contentH: '170px' }" commonTitle="selected"
-            :selectValue="areaCodeMb" :selectList="selectListMb" @changeSelect="changeSelect">
+           :selectValue="areaCodeMb" :selectList="selectListMb" @changeSelect="changeSelect">
             <emptyJc :emptyData="emptyData" />
           </DanelBd>
         </div>
         <!-- 左底部区域 -->
         <div class="left-f">
-          <DanelBd
-            :moduleName="'GIS重点区域风险监测'"
-            :contentStyle="{ contentH: '0px' }"
-            commonTitle="switchs"
-          />
+          <DanelBd :moduleName="'GIS重点区域风险监测'" :contentStyle="{ contentH: '0px' }" commonTitle="switchs" />
         </div>
       </div>
       <div class="center-area">
         <div class="center-t">
-          <iframe
-            src="http://82.157.13.146:18224/valkyrja/"
-            width="100%"
-            height="100%"
-            frameborder="0"
-          ></iframe>
+          <iframe src="http://82.157.13.146:18224/valkyrja/" width="100%" height="100%" frameborder="0"></iframe>
         </div>
         <div class="center-b">
-          <DanelBd :moduleName="'工作面束管监测'" :selectValue="pointCode" :moduleSelect="moduleSelect"
-            :contentStyle="{ contentH: '289px' }" commonTitle="selected" :selectList="selectList"
-            @changeSelect="changeSelect">
+          <DanelBd :moduleName="'工作面束管监测'" :selectValue="pointCode" :moduleSelect="moduleSelect" :contentStyle="{ contentH: '289px' }"
+            commonTitle="selected" :selectList="selectList" @changeSelect="changeSelect">
             <fiberBunbleJc :bunbleData="bunbleData" />
           </DanelBd>
         </div>
@@ -73,40 +58,22 @@
         </div>
         <!-- 右中区域 -->
         <div class="right-c">
-          <DanelBd
-            :moduleName="'带式输送机防灭火监控系统'"
-            :contentStyle="{ contentH: '180px' }"
-            commonTitle="selected"
-            :selectList="selectListDs"
-            :selectValue="dsCode"
-            @change-select="changeSelect"
-          >
+          <DanelBd :moduleName="'带式输送机防灭火监控系统'" :contentStyle="{ contentH: '180px' }" commonTitle="selected"
+            :selectList="selectListDs" :selectValue="dsCode" @changeSelect="changeSelect">
             <outFireJc :outFireData="outFireData" />
           </DanelBd>
         </div>
         <!-- 右下区域 -->
         <div class="right-b">
-          <DanelBd
-            :moduleName="'变电硐室防灭火监控系统'"
-            :contentStyle="{ contentH: '180px' }"
-            commonTitle="selected"
-            :selectList="selectListBd"
-            :selectValue="pointCodeBd"
-            @change-select="changeSelect"
-          >
+          <DanelBd :moduleName="'变电硐室防灭火监控系统'" :contentStyle="{ contentH: '180px' }" commonTitle="selected"
+            :selectList="selectListBd" :selectValue="pointCodeBd" @changeSelect="changeSelect">
             <substationJc :echartDatas="echartDatas" />
           </DanelBd>
         </div>
         <!-- 右底部区域 -->
         <div class="right-f">
-          <DanelBd
-            :moduleName="'安全监控系统'"
-            :contentStyle="{ contentH: '215px' }"
-            commonTitle="selected"
-            :selectList="selectListAq"
-            :selectValue="pointCodeAq"
-            @change-select="changeSelect"
-          >
+          <DanelBd :moduleName="'安全监控系统'" :contentStyle="{ contentH: '215px' }" commonTitle="selected"
+            :selectList="selectListAq" :selectValue="pointCodeAq" @changeSelect="changeSelect">
             <safetyJc :safetyHead="safetyHead" :safetyList="safetyList" />
           </DanelBd>
         </div>
@@ -116,92 +83,111 @@
 </template>
 
 <script setup lang="ts">
-  import { ref, reactive, onMounted } from 'vue';
-  import DanelBd from '../../common/danelBd.vue';
-  import workJc from './components/workJc.vue';
-  import emptyJc from './components/emptyJc.vue';
-  import fiberBunbleJc from './components/fiberBunbleJc.vue';
-  import systemJc from './components/systemJc.vue';
-  import outFireJc from './components/outFireJc.vue';
-  import substationJc from './components/substationJc.vue';
-  import safetyJc from './components/safetyJc.vue';
-  import {
-    getFireAreaInfo,
-    getMbRealData,
-    getSgjcPointInfo,
-    getSgjcRealDataByPointCode,
-    getInfosByAreaCode,
-    getGxcwHistoryDataByPointCode,
-    getZcHfWd,
-    getHeadingFace,
-    getMainTrafficYw,
-    getDsWd,
-  } from './firehome.api';
-
-  let moduleSelect = reactive([
-    { label: '工作面束管监测' },
-    // { label: '工作面光钎监测' },
-  ]);
-
-  let areaCode = ref('');
-  let pointCode = ref('');
-  let areaCodeMb = ref('');
-  let dsCode = ref('');
-  let areaCodeBd = ref('');
-  let pointCodeBd = ref('');
-  let pointCodeAq = ref('one');
-
-  //工作面风险监测数据
-  let echartDataWork = reactive<any[]>([]);
-  let cardData = reactive<any[]>([]);
-  let selectList = reactive<any[]>([]);
-  let bunbleData = reactive<any[]>([]);
-
-  //密闭采空区数据
-  let selectListMb = reactive<any[]>([]);
-  let emptyData = reactive<any>([]);
-
-  //带式输送机防灭火监控系统
-  let selectListDs = reactive<any[]>([]);
-  let outFireData = reactive<any[]>([]);
+import { ref, reactive, onMounted } from 'vue'
+import DanelBd from '../../common/danelBd.vue';
+import workJc from './components/workJc.vue';
+import emptyJc from './components/emptyJc.vue';
+import fiberBunbleJc from './components/fiberBunbleJc.vue';
+import systemJc from './components/systemJc.vue';
+import outFireJc from './components/outFireJc.vue';
+import substationJc from './components/substationJc.vue';
+import safetyJc from './components/safetyJc.vue';
+import { getFireAreaInfo, getMbRealData, getSgjcPointInfo, getSgjcRealDataByPointCode, getInfosByAreaCode, getGxcwHistoryDataByPointCode, getZcHfWd, getHeadingFace, getMainTrafficYw, getDsWd } from './firehome.api'
+
+let moduleSelect = reactive([
+  { label: '工作面束管监测' },
+  // { label: '工作面光钎监测' },
+
+])
+
+let areaCode = ref('')
+let pointCode = ref('')
+let areaCodeMb = ref('')
+let dsCode = ref('')
+let areaCodeBd = ref('')
+let pointCodeBd = ref('')
+let pointCodeAq = ref('one')
+
+//工作面风险监测数据
+let echartDataWork = reactive<any[]>([])
+let cardData = reactive<any[]>([])
+let selectList = reactive<any[]>([])
+let bunbleData = reactive<any[]>([])
+
+//密闭采空区数据
+let selectListMb = reactive<any[]>([])
+let emptyData = reactive<any>([])
 
-  //变电硐室
-  let selectListBd = reactive<any[]>([]);
-  let echartDatas = reactive({
-    xData: [],
-    yData: [],
-    yData1: [],
-  });
-
-  //安全监控
-  let selectListAq = reactive<any[]>([
-    { label: '综放工作面传感器监测', value: 'one' },
-    { label: '掘进工作面传感器监测', value: 'two' },
-    { label: '主运输系统传感器监测', value: 'three' },
-    { label: '机电硐室及配电点传感器监测', value: 'four' },
-  ]);
-  let safetyHead = reactive<any[]>([]);
-  let safetyList = reactive<any[]>([]);
-
-  // https获取监测数据
-  let timer: null | NodeJS.Timeout = null;
-  function getMonitor() {
-    timer = setTimeout(async () => {
+//带式输送机防灭火监控系统
+let selectListDs = reactive<any[]>([])
+let outFireData = reactive<any[]>([])
+
+//变电硐室
+let selectListBd = reactive<any[]>([])
+let echartDatas = reactive({
+  xData: [],
+  yData: [],
+  yData1: []
+})
+
+//安全监控
+let selectListAq = reactive<any[]>([
+  { label: "综放工作面传感器监测", value: 'one' },
+  { label: "掘进工作面传感器监测", value: 'two' },
+  { label: "主运输系统传感器监测", value: 'three' },
+  { label: '机电硐室及配电点传感器监测', value: 'four' }
+])
+let safetyHead = reactive<any[]>([])
+let safetyList = reactive<any[]>([])
+
+// https获取监测数据
+let timer: null | NodeJS.Timeout = null;
+function getMonitor() {
+  timer = setTimeout(
+    async () => {
       //工作面
-      await getFireAreaInfoList();
+      await getFireAreaInfoList()
       //密闭
-      await getFireAreaInfoListMb();
+      await getFireAreaInfoListMb()
       //带式
-      await getFireAreaInfoListDs();
+      await getFireAreaInfoListDs()
       //变电硐室
-      await getFireAreaInfoListBd();
+      await getFireAreaInfoListBd()
       //安全监控
-      await getTableList();
+      await getTableList()
       if (timer) {
         timer = null;
       }
       getMonitor();
-    }, 5000);
+    },
+    5000
+  );
+}
+
+//下拉选项切换
+function changeSelect(data) {
+  console.log(data, '下拉------')
+  switch (data.label) {
+    case '密闭采空区监测系统':
+      areaCodeMb.value = data.value
+      getMbRealDataList()
+      break;
+    case '工作面束管监测':
+      pointCode.value = data.value
+      getSgjcRealDataByPointCodeList()
+      break;
+    case '带式输送机防灭火监控系统':
+      dsCode.value = data.value
+      getFireAreaInfoListDs()
+      break;
+    case '变电硐室防灭火监控系统':
+      pointCodeBd.value = data.value
+      getGxcwHistoryDataByPointCodeList()
+      break;
+    case '安全监控系统':
+      pointCodeAq.value = data.value
+      getTableList()
+      break;
   }
 
 }
@@ -241,8 +227,8 @@ async function getFireAreaInfoListMb() {
     dataMb.forEach(m => {
       selectListMb.push({ label: m.areaName, value: m.areaCode })
     })
-
-    areaCodeMb.value = areaCodeMb.value ? areaCodeMb.value : selectListMb[0]['value']
+   
+    areaCodeMb.value =areaCodeMb.value ?  areaCodeMb.value : selectListMb[0]['value']
     //获取密闭监测实时信息
     getMbRealDataList()
   }
@@ -306,63 +292,37 @@ async function getFireAreaInfoListDs() {
     dataDs.forEach(el => {
       selectListDs.push({ label: el.areaName, value: el.areaName })
     })
-    dsCode.value = dsCode.value ? dsCode.value : selectListDs[0]['value']
-    let dataName = dataDs.filter(v => v.areaName == dsCode.value)[0]
-    console.log(dataName, '0000000=======')
-    outFireData.push(
-      { title: '光钎预警', val: dataName.infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
-      { title: '一氧化碳预警', val: dataName.infoTypeTwo.returnAirCornerCO, dw: 'ppm', label: '最高浓度' },
-      { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
-    )
-
-    // if (dsCode.value) {
-    //   let dataName = dataDs.filter(v => v.areaName == dsCode.value)[0]
-    //   console.log(dataName, '0000000=======')
-    //   outFireData.push(
-    //     { title: '光钎预警', val: dataName.infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
-    //     { title: '一氧化碳预警', val: dataName.infoTypeTwo.returnAirCornerCO, dw: 'ppm', label: '最高浓度' },
-    //     { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
-    //   )
-    // } else {
-    //   outFireData.push(
-    //     { title: '光钎预警', val: dataDs[0].infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
-    //     { title: '一氧化碳预警', val: dataDs[0].infoTypeTwo.returnAirCornerCO, dw: 'ppm', label: '最高浓度' },
-    //     { title: '烟雾预警', val: dataDs[0].infoTypeTwo.hazard, dw: '', label: '状态' },
-    //   )
-    // }
+    if (dsCode.value) {
+      let dataName = dataDs.filter(v => v.areaName == dsCode.value)[0]
+      console.log(dataName, '0000000=======')
+      outFireData.push(
+        { title: '光钎预警', val: dataName.infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
+        { title: '一氧化碳预警', val: dataName.infoTypeTwo.returnAirCornerCO, dw: 'ppm', label: '最高浓度' },
+        { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
+      )
+    } else {
+      outFireData.push(
+        { title: '光钎预警', val: dataDs[0].infoTypeTwo.maxTemperature, dw: '℃', label: '最高温度' },
+        { title: '一氧化碳预警', val: dataDs[0].infoTypeTwo.returnAirCornerCO, dw: 'ppm', label: '最高浓度' },
+        { title: '烟雾预警', val: dataDs[0].infoTypeTwo.hazard, dw: '', label: '状态' },
+      )
+    }
   }
+}
 
-  //获取工作面风险监测数据
-  async function getFireAreaInfoList() {
-    let res = await getFireAreaInfo({ fireCauseType: 2 });
-
-    if (res.length != 0) {
-      echartDataWork.length = 0;
-      cardData.length = 0;
-      let data = res.filter((v) => v.areaType == 2);
-      data.forEach((el) => {
-        cardData.push({
-          title: '风险',
-          val:
-            el.warningLevel == 1
-              ? '低'
-              : el.warningLevel == 2
-                ? '中'
-                : el.warningLevel == 3
-                  ? '较大'
-                  : el.warningLevel == 4
-                    ? '重大'
-                    : '--',
-          label: el.areaName,
-          title1: '温度最大值',
-          val1: el.infoTypeTwo.maxTemperature,
-        });
-      });
-      areaCode.value = data[0].areaCode;
-      //工作面束管监测
-      getSgjcPointInfoList();
-    }
+//变电硐室防灭火监控系统
+async function getFireAreaInfoListBd() {
+  const res = await getFireAreaInfo({})
+  if (res.length != 0) {
+    let dataBd = res.filter(m => m.areaType == 5)
+    console.log(dataBd, '变电硐室-----')
+    areaCodeBd.value = dataBd[0].areaCode
+    //获取光钎条数及测点编号
+    getInfosByAreaCodeList()
   }
+}
+//获取光钎条数及测点编号
+async function getInfosByAreaCodeList() {
 
   let res = await getInfosByAreaCode({ areaCode: areaCodeBd.value })
   console.log(res, 'res000999')
@@ -374,438 +334,304 @@ async function getFireAreaInfoListDs() {
         value: el.pointCode
       })
     })
-    pointCodeBd.value = pointCodeBd.value ? pointCodeBd.value : selectListBd[0].value
+    pointCodeBd.value =pointCodeBd.value ? pointCodeBd.value : selectListBd[0].value
     //获取光钎测温图表数据
     getGxcwHistoryDataByPointCodeList()
   }
-  //获取密闭监测实时信息
-  async function getMbRealDataList() {
-    let res = await getMbRealData({ areaCode: areaCodeMb.value });
-    console.log(res, '密闭监测实时信息');
-    emptyData.length = 0;
-    res.forEach((el) => {
-      emptyData.push({ label: el.name, val: el.currentValue });
-    });
-  }
+}
 
-  //工作面束管监测
-  async function getSgjcPointInfoList() {
-    let res = await getSgjcPointInfo({ areaCode: areaCode.value });
-    console.log(res, '工作面束管列表---');
-    if (res.length != 0) {
-      selectList.length = 0;
-      res.forEach((el) => {
-        selectList.push({ label: el.pointName, value: el.pointCode });
-      });
-      pointCode.value = pointCode.value ? pointCode.value : selectList[0]['value'];
-      //获取工作面束管测点实时数据
-      getSgjcRealDataByPointCodeList();
-    }
-  }
-  //获取工作面束管测点实时数据
-  async function getSgjcRealDataByPointCodeList() {
-    let res = await getSgjcRealDataByPointCode({ pointCode: pointCode.value });
-    console.log(res, '束管测点实时数据---');
-    if (res.length != 0) {
-      bunbleData.length = 0;
-      res.forEach((el) => {
-        bunbleData.push({
-          type: el.type,
-          label: '最大浓度',
-          val: el.currentValue,
-          label1: '位置',
-          val1: el.position,
-          label2: '时间',
-          val2: el.time,
-        });
-      });
-    }
-  }
+//获取光钎测温图表数据
+async function getGxcwHistoryDataByPointCodeList() {
 
-  //带式输送机防灭火监控系统
-  async function getFireAreaInfoListDs() {
-    const res = await getFireAreaInfo({});
-    if (res.length != 0) {
-      selectListDs.length = 0;
-      outFireData.length = 0;
-      let dataDs = res.filter((m) => m.areaType == 4);
-      console.log(dataDs, '带式输送机防灭火');
-      dataDs.forEach((el) => {
-        selectListDs.push({ label: el.areaName, value: el.areaName });
-      });
-      if (dsCode.value) {
-        let dataName = dataDs.filter((v) => v.areaName == dsCode.value)[0];
-        console.log(dataName, '0000000=======');
-        outFireData.push(
-          {
-            title: '光钎预警',
-            val: dataName.infoTypeTwo.maxTemperature,
-            dw: '℃',
-            label: '最高温度',
-          },
-          {
-            title: '一氧化碳预警',
-            val: dataName.infoTypeTwo.returnAirCornerCO,
-            dw: 'ppm',
-            label: '最高浓度',
-          },
-          { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
-        );
-      } else {
-        outFireData.push(
-          {
-            title: '光钎预警',
-            val: dataDs[0].infoTypeTwo.maxTemperature,
-            dw: '℃',
-            label: '最高温度',
-          },
-          {
-            title: '一氧化碳预警',
-            val: dataDs[0].infoTypeTwo.returnAirCornerCO,
-            dw: 'ppm',
-            label: '最高浓度',
-          },
-          { title: '烟雾预警', val: dataDs[0].infoTypeTwo.hazard, dw: '', label: '状态' },
-        );
-      }
-    }
-  }
+  let res = await getGxcwHistoryDataByPointCode({ pointCode: pointCodeBd.value })
+  console.log(res, '光钎测温图表数据-------')
+  echartDatas.xData.length = 0
+  echartDatas.yData.length = 0
+  echartDatas.yData1.length = 0
+  res.time.forEach(el => {
+    echartDatas.xData.push(el)
+  })
+  res.maxValue.forEach(el => {
+    echartDatas.yData.push(el)
+  })
+  res.minValue.forEach(el => {
+    echartDatas.yData1.push(el)
+  })
+}
 
-  //变电硐室防灭火监控系统
-  async function getFireAreaInfoListBd() {
-    const res = await getFireAreaInfo({});
-    if (res.length != 0) {
-      let dataBd = res.filter((m) => m.areaType == 5);
-      console.log(dataBd, '变电硐室-----');
-      areaCodeBd.value = dataBd[0].areaCode;
-      //获取光钎条数及测点编号
-      getInfosByAreaCodeList();
-    }
+//获取安全监控列表数据
+function getTableList() {
+  switch (pointCodeAq.value) {
+    case 'one':
+      getZcHfWdList()
+      break;
+    case 'two':
+      getHeadingFaceList()
+      break;
+    case 'three':
+      getMainTrafficYwList()
+      break;
+    case 'four':
+      getDsWdList()
+      break;
+    default:
+      getZcHfWdList()
+      break
   }
-  //获取光钎条数及测点编号
-  async function getInfosByAreaCodeList() {
-    let res = await getInfosByAreaCode({ areaCode: areaCodeBd.value });
-    console.log(res, 'res000999');
-    if (res.length != 0) {
-      selectListBd.length = 0;
-      res.forEach((el) => {
-        selectListBd.push({
-          label: el.pointName,
-          value: el.pointCode,
-        });
-      });
-      pointCodeBd.value = pointCodeBd.value ? pointCodeBd.value : selectListBd[0].value;
-      //获取光钎测温图表数据
-      getGxcwHistoryDataByPointCodeList();
-    }
-  }
-
-  //获取光钎测温图表数据
-  async function getGxcwHistoryDataByPointCodeList() {
-    let res = await getGxcwHistoryDataByPointCode({ pointCode: pointCodeBd.value });
-    console.log(res, '光钎测温图表数据-------');
-    echartDatas.xData.length = 0;
-    echartDatas.yData.length = 0;
-    echartDatas.yData1.length = 0;
-    res.time.forEach((el) => {
-      echartDatas.xData.push(el);
-    });
-    res.maxValue.forEach((el) => {
-      echartDatas.yData.push(el);
-    });
-    res.minValue.forEach((el) => {
-      echartDatas.yData1.push(el);
-    });
+}
+//获取综放工作面传感器监测数据
+async function getZcHfWdList() {
+
+  let res = await getZcHfWd()
+  console.log(res, '综放工作面传感器监测数据')
+  safetyHead.length = 0
+  safetyList.length = 0
+  safetyHead.push(
+    { label: '测点位置' },
+    { label: '温度(°C)' },
+    { label: '预警级别' },
+    { label: '时间' }
+  )
+  if (res.length != 0) {
+    res.forEach(el => {
+      safetyList.push({ address: el.nodePlacement, temp: el.detectValue + '', grade: el.warningMsg, time: el.dateTime })
+    })
   }
+}
 
-  //获取安全监控列表数据
-  function getTableList() {
-    switch (pointCodeAq.value) {
-      case 'one':
-        getZcHfWdList();
-        break;
-      case 'two':
-        getHeadingFaceList();
-        break;
-      case 'three':
-        getMainTrafficYwList();
-        break;
-      case 'four':
-        getDsWdList();
-        break;
-      default:
-        getZcHfWdList();
-        break;
-    }
+//获取掘进工作面传感器监测数据
+async function getHeadingFaceList() {
+
+  let res = await getHeadingFace()
+  safetyHead.length = 0
+  safetyList.length = 0
+  safetyHead.push(
+    { label: '测点位置' },
+    { label: 'CO浓度(%)' },
+    { label: '温度' },
+    { label: '预警级别' },
+    { label: '时间' },
+  )
+  console.log(res, '掘进工作面传感器监测数据')
+  if (res.length != 0) {
+    res.forEach(el => {
+      safetyList.push({ address: el.name, nd: el.co + '', temp: el.wd + '', grade: el.warningMsg, time: el.dateTime })
+    })
   }
-  //获取综放工作面传感器监测数据
-  async function getZcHfWdList() {
-    let res = await getZcHfWd();
-    console.log(res, '综放工作面传感器监测数据');
-    safetyHead.length = 0;
-    safetyList.length = 0;
-    safetyHead.push(
-      { label: '测点位置' },
-      { label: '温度(°C)' },
-      { label: '预警级别' },
-      { label: '时间' },
-    );
-    if (res.length != 0) {
-      res.forEach((el) => {
-        safetyList.push({
-          address: el.nodePlacement,
-          temp: el.detectValue + '',
-          grade: el.warningMsg,
-          time: el.dateTime,
-        });
-      });
-    }
+}
+//获取运输系统烟雾传感器数据
+async function getMainTrafficYwList() {
+
+  let res = await getMainTrafficYw()
+  safetyHead.length = 0
+  safetyList.length = 0
+  safetyHead.push(
+    { label: '测点位置' },
+    { label: '温度(°C)' },
+    { label: '预警级别' },
+    { label: '时间' }
+  )
+  console.log(res, '运输系统烟雾传感器数据')
+  if (res.length != 0) {
+    res.forEach(el => {
+      safetyList.push({ address: el.nodePlacement, temp: el.detectValue + '', grade: el.warningMsg, time: el.dateTime })
+    })
   }
+}
 
-  //获取掘进工作面传感器监测数据
-  async function getHeadingFaceList() {
-    let res = await getHeadingFace();
-    safetyHead.length = 0;
-    safetyList.length = 0;
-    safetyHead.push(
-      { label: '测点位置' },
-      { label: 'CO浓度(%)' },
-      { label: '温度' },
-      { label: '预警级别' },
-      { label: '时间' },
-    );
-    console.log(res, '掘进工作面传感器监测数据');
-    if (res.length != 0) {
-      res.forEach((el) => {
-        safetyList.push({
-          address: el.name,
-          nd: el.co + '',
-          temp: el.wd + '',
-          grade: el.warningMsg,
-          time: el.dateTime,
-        });
-      });
-    }
-  }
-  //获取运输系统烟雾传感器数据
-  async function getMainTrafficYwList() {
-    let res = await getMainTrafficYw();
-    safetyHead.length = 0;
-    safetyList.length = 0;
-    safetyHead.push(
-      { label: '测点位置' },
-      { label: '温度(°C)' },
-      { label: '预警级别' },
-      { label: '时间' },
-    );
-    console.log(res, '运输系统烟雾传感器数据');
-    if (res.length != 0) {
-      res.forEach((el) => {
-        safetyList.push({
-          address: el.nodePlacement,
-          temp: el.detectValue + '',
-          grade: el.warningMsg,
-          time: el.dateTime,
-        });
-      });
-    }
+//获取机电硐室传感器数据
+async function getDsWdList() {
+
+  let res = await getDsWd()
+  console.log(res, '机电硐室传感器数据')
+  safetyHead.length = 0
+  safetyList.length = 0
+  safetyHead.push(
+    { label: '测点位置' },
+    { label: '温度(°C)' },
+    { label: '预警级别' },
+    { label: '时间' }
+  )
+  if (res.length != 0) {
+    res.forEach(el => {
+      safetyList.push({ address: el.nodePlacement, temp: el.detectValue + '', grade: el.warningMsg, time: el.dateTime })
+    })
   }
+}
 
-  //获取机电硐室传感器数据
-  async function getDsWdList() {
-    let res = await getDsWd();
-    console.log(res, '机电硐室传感器数据');
-    safetyHead.length = 0;
-    safetyList.length = 0;
-    safetyHead.push(
-      { label: '测点位置' },
-      { label: '温度(°C)' },
-      { label: '预警级别' },
-      { label: '时间' },
-    );
-    if (res.length != 0) {
-      res.forEach((el) => {
-        safetyList.push({
-          address: el.nodePlacement,
-          temp: el.detectValue + '',
-          grade: el.warningMsg,
-          time: el.dateTime,
-        });
-      });
-    }
-  }
 
-  onMounted(() => {
-    //工作面
-    getFireAreaInfoList();
-    //密闭
-    getFireAreaInfoListMb();
-    //带式
-    getFireAreaInfoListDs();
-    //变电硐室
-    getFireAreaInfoListBd();
-    //安全监控
-    getTableList();
-    getMonitor();
-  });
+onMounted(() => {
+  //工作面
+  getFireAreaInfoList()
+  //密闭
+  getFireAreaInfoListMb()
+  //带式
+  getFireAreaInfoListDs()
+  //变电硐室
+  getFireAreaInfoListBd()
+  //安全监控
+  getTableList()
+  getMonitor()
+
+})
 </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');
+}
+
+.fireHome {
+  position: relative;
+  // width: calc(100% - 20px);
+  // height: calc(100vh - 82px);
+  width: 100%;
+  // height: calc(100vh - 70px);
+  height: 875px;
+  margin-top: 50px;
 
-  .fireHome {
-    position: relative;
-    // width: calc(100% - 20px);
-    // height: calc(100vh - 82px);
+  .moduleArea {
     width: 100%;
-    // height: calc(100vh - 70px);
-    height: 875px;
-    margin-top: 50px;
+    height: 100%;
+  }
 
-    .moduleArea {
-      width: 100%;
-      height: 100%;
-    }
+  .main-container {
+    display: flex;
+    position: absolute;
+    top: 0;
+    left: 0;
+    box-sizing: border-box;
+    justify-content: space-between;
+    width: 100%;
+    height: 100%;
+    padding: 15px 10px;
 
-    .main-container {
+    .left-area {
       display: flex;
-      position: absolute;
-      top: 0;
-      left: 0;
-      box-sizing: border-box;
+      flex-direction: column;
+      align-items: center;
       justify-content: space-between;
-      width: 100%;
+      // width: 30%;
+      width: 392px;
       height: 100%;
-      padding: 15px 10px;
-
-      .left-area {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: space-between;
-        // width: 30%;
-        width: 392px;
-        height: 100%;
-        margin-right: 15px;
-
-        .left-t {
-          position: relative;
+      margin-right: 15px;
+
+      .left-t {
+        position: relative;
+        width: 100%;
+        // height: 121px;
+        height: 100px;
+        background: url('../../../../assets/images/fire/firehome/qkjaq.png') no-repeat center;
+        background-size: 100% 100%;
+
+        .tcontent-area {
+          display: flex;
+          position: absolute;
+          top: 50%;
+          left: 0;
+          box-sizing: border-box;
+          align-items: center;
+          justify-content: space-around;
           width: 100%;
-          // height: 121px;
-          height: 100px;
-          background: url('../../../../assets/images/fire/firehome/qkjaq.png') no-repeat center;
-          background-size: 100% 100%;
+          height: 90px;
+          padding: 0 15px;
+          transform: translate(0, -50%);
 
-          .tcontent-area {
+          .tcontent-l {
             display: flex;
-            position: absolute;
-            top: 50%;
-            left: 0;
-            box-sizing: border-box;
+            flex: 1;
+            flex-direction: column;
             align-items: center;
-            justify-content: space-around;
-            width: 100%;
-            height: 90px;
-            padding: 0 15px;
-            transform: translate(0, -50%);
-
-            .tcontent-l {
-              display: flex;
-              flex: 1;
-              flex-direction: column;
-              align-items: center;
-              justify-content: center;
-              height: 100%;
-              color: #9da5aa;
-              font-size: 14px;
-              letter-spacing: 2px;
-            }
-
-            .tcontent-c {
-              display: flex;
-              flex: 3;
-              flex-direction: column;
-              align-items: center;
-              justify-content: center;
-              height: 100%;
-            }
-
-            .tcontent-r {
-              display: flex;
-              flex: 1;
-              flex-direction: column;
-              align-items: center;
-              justify-content: center;
-              height: 100%;
-              color: #9da5aa;
-              font-size: 14px;
-              letter-spacing: 2px;
-            }
+            justify-content: center;
+            height: 100%;
+            color: #9da5aa;
+            font-size: 14px;
+            letter-spacing: 2px;
           }
-        }
 
-        .left-c {
-          width: 100%;
-        }
+          .tcontent-c {
+            display: flex;
+            flex: 3;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            height: 100%;
+          }
 
-        .left-b {
-          width: 100%;
+          .tcontent-r {
+            display: flex;
+            flex: 1;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            height: 100%;
+            color: #9da5aa;
+            font-size: 14px;
+            letter-spacing: 2px;
+          }
         }
+      }
 
-        .left-f {
-          width: 100%;
-        }
+      .left-c {
+        width: 100%;
       }
 
-      .center-area {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: space-between;
-        width: calc(100% - 814px);
+      .left-b {
+        width: 100%;
+      }
 
-        .center-t {
-          width: 100%;
-          height: 60%;
-          margin-bottom: 15px;
-          overflow: hidden;
-        }
+      .left-f {
+        width: 100%;
+      }
+    }
 
-        .center-b {
-          width: 100%;
-          height: calc(40% - 15px);
-        }
+    .center-area {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: space-between;
+      width: calc(100% - 814px);
+
+      .center-t {
+        width: 100%;
+        height: 60%;
+        margin-bottom: 15px;
+        overflow: hidden;
       }
 
-      .right-area {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: space-between;
-        // width: 30%;
-        width: 392px;
-        height: 100%;
-        margin-left: 15px;
-
-        .right-t {
-          width: 100%;
-        }
+      .center-b {
+        width: 100%;
+        height: calc(40% - 15px);
+      }
+    }
 
-        .right-c {
-          width: 100%;
-        }
+    .right-area {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: space-between;
+      // width: 30%;
+      width: 392px;
+      height: 100%;
+      margin-left: 15px;
 
-        .right-b {
-          width: 100%;
-        }
+      .right-t {
+        width: 100%;
+      }
 
-        .right-f {
-          width: 100%;
-        }
+      .right-c {
+        width: 100%;
+      }
+
+      .right-b {
+        width: 100%;
+      }
+
+      .right-f {
+        width: 100%;
       }
     }
   }
+}
 </style>