修改gis iframe 链接

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

@@ -49,7 +49,7 @@
             <img src="../../../../assets/images/scalc.png" alt="" />
           </div>
           <iframe
-            src="http://82.157.13.146:18224/valkyrja/"
+            src="http://172.16.253.23:91/valkyrja/"
             width="100%"
             height="100%"
             frameborder="0"

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

@@ -24,19 +24,34 @@
           <!-- 左中区域 -->
           <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" @change-select="changeSelect">
+            <DanelBd
+              :moduleName="'密闭采空区监测系统'"
+              :contentStyle="{ contentH: '170px' }"
+              commonTitle="selected"
+              :selectValue="areaCodeMb"
+              :selectList="selectListMb"
+              @change-select="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>
       </transition>
@@ -46,13 +61,24 @@
           <div class="center-scalc" @click="getScalc">
             <img src="../../../../assets/images/scalc.png" alt="" />
           </div>
-          <iframe src="http://82.157.13.146:18224/valkyrja/" width="100%" height="100%" frameborder="0"></iframe>
+          <iframe
+            src="http://172.16.253.23:91/valkyrja/"
+            width="100%"
+            height="100%"
+            frameborder="0"
+          ></iframe>
         </div>
         <transition name="fade" mode="out-in">
           <div class="center-b" v-if="isShow">
-            <DanelBd :moduleName="'工作面束管监测'" :selectValue="pointCode" :moduleSelect="moduleSelect"
-              :contentStyle="{ contentH: '289px' }" commonTitle="selected" :selectList="selectList"
-              @change-select="changeSelect">
+            <DanelBd
+              :moduleName="'工作面束管监测'"
+              :selectValue="pointCode"
+              :moduleSelect="moduleSelect"
+              :contentStyle="{ contentH: '289px' }"
+              commonTitle="selected"
+              :selectList="selectList"
+              @change-select="changeSelect"
+            >
               <fiberBunbleJc :bunbleData="bunbleData" />
             </DanelBd>
           </div>
@@ -69,22 +95,40 @@
           </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"
+              @change-select="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"
+              @change-select="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"
+              @change-select="changeSelect"
+            >
               <safetyJc :safetyHead="safetyHead" :safetyList="safetyList" />
             </DanelBd>
           </div>
@@ -95,680 +139,680 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted, onUnmounted } 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 isShow = ref(true);
-
-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[]>([]);
-
-//变电硐室
-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[]>([]);
-
-//隐藏和显示左右侧区域
-function getScalc() {
-  isShow.value = !isShow.value;
-}
-
-// https获取监测数据
-let timer: null | NodeJS.Timeout = null;
-function getMonitor() {
-  timer = setTimeout(async () => {
-    //工作面
-    await getFireAreaInfoList();
-    //密闭
-    await getFireAreaInfoListMb();
-    //带式
-    await getFireAreaInfoListDs();
-    //变电硐室
-    await getFireAreaInfoListBd();
-    //安全监控
-    await getTableList();
-    if (timer) {
-      timer = null;
+  import { ref, reactive, onMounted, onUnmounted } 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 isShow = ref(true);
+
+  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[]>([]);
+
+  //变电硐室
+  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[]>([]);
+
+  //隐藏和显示左右侧区域
+  function getScalc() {
+    isShow.value = !isShow.value;
+  }
+
+  // https获取监测数据
+  let timer: null | NodeJS.Timeout = null;
+  function getMonitor() {
+    timer = setTimeout(async () => {
+      //工作面
+      await getFireAreaInfoList();
+      //密闭
+      await getFireAreaInfoListMb();
+      //带式
+      await getFireAreaInfoListDs();
+      //变电硐室
+      await getFireAreaInfoListBd();
+      //安全监控
+      await getTableList();
+      if (timer) {
+        timer = null;
+      }
+      getMonitor();
+    }, 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;
     }
-    getMonitor();
-  }, 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;
   }
-}
-
-//获取工作面风险监测数据
-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,
+
+  //获取工作面风险监测数据
+  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();
+      areaCode.value = data[0].areaCode;
+      //工作面束管监测
+      getSgjcPointInfoList();
+    }
   }
-}
-
-//获取密闭下拉列表
-async function getFireAreaInfoListMb() {
-  let res = await getFireAreaInfo({ fireCauseType: 2 });
-  console.log(res, '密闭数据');
-  if (res.length != 0) {
-    selectListMb.length = 0;
-    let dataMb = res.filter((m) => m.areaType == 1);
-    dataMb.forEach((m) => {
-      selectListMb.push({ label: m.areaName, value: m.areaCode });
-    });
 
-    areaCodeMb.value = areaCodeMb.value ? areaCodeMb.value : selectListMb[0]['value'];
-    //获取密闭监测实时信息
-    getMbRealDataList();
+  //获取密闭下拉列表
+  async function getFireAreaInfoListMb() {
+    let res = await getFireAreaInfo({ fireCauseType: 2 });
+    console.log(res, '密闭数据');
+    if (res.length != 0) {
+      selectListMb.length = 0;
+      let dataMb = res.filter((m) => m.areaType == 1);
+      dataMb.forEach((m) => {
+        selectListMb.push({ label: m.areaName, value: m.areaCode });
+      });
+
+      areaCodeMb.value = areaCodeMb.value ? areaCodeMb.value : selectListMb[0]['value'];
+      //获取密闭监测实时信息
+      getMbRealDataList();
+    }
   }
-}
-//获取密闭监测实时信息
-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, unit: el.unit });
-  });
-}
-
-//工作面束管监测
-async function getSgjcPointInfoList() {
-  let res = await getSgjcPointInfo({ areaCode: areaCode.value });
-  console.log(res, '工作面束管列表---');
-  if (res.length != 0) {
-    selectList.length = 0;
+  //获取密闭监测实时信息
+  async function getMbRealDataList() {
+    let res = await getMbRealData({ areaCode: areaCodeMb.value });
+    console.log(res, '密闭监测实时信息');
+    emptyData.length = 0;
     res.forEach((el) => {
-      selectList.push({ label: el.pointName, value: el.pointCode });
+      emptyData.push({ label: el.name, val: el.currentValue, unit: el.unit });
     });
-    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.name,
-        label: '最大浓度',
-        val: el.currentValue,
-        label1: '位置',
-        val1: el.position,
-        label2: '时间',
-        val2: el.time,
-        unit: el.unit,
+
+  //工作面束管监测
+  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.name,
+          label: '最大浓度',
+          val: el.currentValue,
+          label1: '位置',
+          val1: el.position,
+          label2: '时间',
+          val2: el.time,
+          unit: el.unit,
+        });
+      });
+    }
   }
-}
-
-//带式输送机防灭火监控系统
-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 });
-    });
 
-    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.returnAirCornerCO,
-        dw: 'ppm',
-        label: '最高浓度',
-      },
-      { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
-      { title: '火焰预警', val: '--', dw: '', label: '状态' },
-      { title: '喷粉阀门', val: '--', dw: '', label: '开关量' },
-    );
+  //带式输送机防灭火监控系统
+  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 });
+      });
+
+      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.returnAirCornerCO,
+          dw: 'ppm',
+          label: '最高浓度',
+        },
+        { title: '烟雾预警', val: dataName.infoTypeTwo.hazard, dw: '', label: '状态' },
+        { title: '火焰预警', val: '--', dw: '', label: '状态' },
+        { title: '喷粉阀门', val: '--', dw: '', label: '开关量' },
+      );
+    }
   }
-}
-
-//变电硐室防灭火监控系统
-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 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');
-  if (res.length != 0) {
-    selectListBd.length = 0;
-    res.forEach((el) => {
-      selectListBd.push({
-        label: el.pointName,
-        value: el.pointCode,
+  //获取光钎条数及测点编号
+  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);
     });
-    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);
-  });
-}
-
-//获取安全监控列表数据
-function getTableList() {
-  switch (pointCodeAq.value) {
-    case 'one':
-      getZcHfWdList();
-      break;
-    case 'two':
-      getHeadingFaceList();
-      break;
-    case 'three':
-      getMainTrafficYwList();
-      break;
-    case 'four':
-      getDsWdList();
-      break;
-    default:
-      getZcHfWdList();
-      break;
+
+  //获取安全监控列表数据
+  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 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 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 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 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 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();
-});
-
-onUnmounted(() => {
-  if (timer) {
-    clearTimeout(timer);
-    timer = null;
+    }
   }
-});
+
+  onMounted(() => {
+    //工作面
+    getFireAreaInfoList();
+    //密闭
+    getFireAreaInfoListMb();
+    //带式
+    getFireAreaInfoListDs();
+    //变电硐室
+    getFireAreaInfoListBd();
+    //安全监控
+    getTableList();
+    getMonitor();
+  });
+
+  onUnmounted(() => {
+    if (timer) {
+      clearTimeout(timer);
+      timer = null;
+    }
+  });
 </script>
 
 <style lang="less" scoped>
-@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;
-
-  .moduleArea {
-    width: 100%;
-    height: 100%;
+  @font-face {
+    font-family: douyuFont;
+    src: url('../../../../assets/font/douyuFont.otf');
   }
 
-  .main-container {
-    display: flex;
-    position: absolute;
-    top: 0;
-    left: 0;
-    box-sizing: border-box;
-    justify-content: space-between;
+  .fireHome {
+    position: relative;
+    // width: calc(100% - 20px);
+    // height: calc(100vh - 82px);
     width: 100%;
-    height: 100%;
-    padding: 15px 10px;
+    // height: calc(100vh - 70px);
+    height: 875px;
+    // margin-top: 50px;
 
-    .left-area {
+    .moduleArea {
+      width: 100%;
+      height: 100%;
+    }
+
+    .main-container {
       display: flex;
-      flex-direction: column;
-      align-items: center;
+      position: absolute;
+      top: 0;
+      left: 0;
+      box-sizing: border-box;
       justify-content: space-between;
-      // width: 30%;
-      width: 392px;
+      width: 100%;
       height: 100%;
-      margin-right: 15px;
+      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;
-        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;
+        .left-t {
+          position: relative;
           width: 100%;
-          height: 90px;
-          padding: 0 15px;
-          transform: translate(0, -50%);
+          // height: 121px;
+          height: 100px;
+          background: url('../../../../assets/images/fire/firehome/qkjaq.png') no-repeat center;
+          background-size: 100% 100%;
 
-          .tcontent-l {
+          .tcontent-area {
             display: flex;
-            flex: 1;
-            flex-direction: column;
+            position: absolute;
+            top: 50%;
+            left: 0;
+            box-sizing: border-box;
             align-items: center;
-            justify-content: center;
-            height: 100%;
-            color: #9da5aa;
-            font-size: 14px;
-            letter-spacing: 2px;
-          }
+            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-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;
+            .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-c {
-        width: 100%;
-      }
+        .left-c {
+          width: 100%;
+        }
 
-      .left-b {
-        width: 100%;
-      }
+        .left-b {
+          width: 100%;
+        }
 
-      .left-f {
-        width: 100%;
+        .left-f {
+          width: 100%;
+        }
       }
-    }
 
-    .center-area {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: space-between;
-      width: calc(100% - 814px);
+      .center-area {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: space-between;
+        width: calc(100% - 814px);
 
-      .center-t {
-        position: relative;
-        width: 100%;
-        height: 60%;
-        margin-bottom: 15px;
-        overflow: hidden;
-
-        .center-scalc {
-          position: absolute;
-          top: 10px;
-          left: 10px;
-          width: 50px;
-          height: 50px;
-          background-color: rgb(30 58 117 / 41.8%);
-
-          img {
+        .center-t {
+          position: relative;
+          width: 100%;
+          height: 60%;
+          margin-bottom: 15px;
+          overflow: hidden;
+
+          .center-scalc {
             position: absolute;
-            top: 50%;
-            left: 50%;
-            width: 37px;
-            height: 41px;
-            transform: translate(-50%, -50%);
-            cursor: pointer;
-
-            &:hover {
-              width: 43px;
-              height: 47px;
-              background-color: rgb(100 228 185 / 6.27%);
+            top: 10px;
+            left: 10px;
+            width: 50px;
+            height: 50px;
+            background-color: rgb(30 58 117 / 41.8%);
+
+            img {
+              position: absolute;
+              top: 50%;
+              left: 50%;
+              width: 37px;
+              height: 41px;
+              transform: translate(-50%, -50%);
+              cursor: pointer;
+
+              &:hover {
+                width: 43px;
+                height: 47px;
+                background-color: rgb(100 228 185 / 6.27%);
+              }
             }
           }
         }
+
+        .center-b {
+          width: 100%;
+          height: calc(40% - 15px);
+        }
       }
 
-      .center-b {
+      .center-area1 {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: space-between;
         width: 100%;
-        height: calc(40% - 15px);
-      }
-    }
 
-    .center-area1 {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: space-between;
-      width: 100%;
+        .center-t1 {
+          position: relative;
+          width: 100%;
+          height: 100%;
+          margin-bottom: 15px;
+          overflow: hidden;
 
-      .center-t1 {
-        position: relative;
-        width: 100%;
-        height: 100%;
-        margin-bottom: 15px;
-        overflow: hidden;
-
-        .center-scalc {
-          position: absolute;
-          top: 10px;
-          left: 10px;
-          width: 50px;
-          height: 50px;
-          background-color: rgb(30 58 117 / 41.8%);
-
-          img {
+          .center-scalc {
             position: absolute;
-            top: 50%;
-            left: 50%;
-            width: 37px;
-            height: 41px;
-            transform: translate(-50%, -50%);
-            cursor: pointer;
-
-            &:hover {
-              width: 43px;
-              height: 47px;
-              background-color: rgb(100 228 185 / 6.27%);
+            top: 10px;
+            left: 10px;
+            width: 50px;
+            height: 50px;
+            background-color: rgb(30 58 117 / 41.8%);
+
+            img {
+              position: absolute;
+              top: 50%;
+              left: 50%;
+              width: 37px;
+              height: 41px;
+              transform: translate(-50%, -50%);
+              cursor: pointer;
+
+              &:hover {
+                width: 43px;
+                height: 47px;
+                background-color: rgb(100 228 185 / 6.27%);
+              }
             }
           }
         }
       }
-    }
 
-    .right-area {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: space-between;
-      // width: 30%;
-      width: 392px;
-      height: 100%;
-      margin-left: 15px;
+      .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%;
-      }
+        .right-t {
+          width: 100%;
+        }
 
-      .right-c {
-        width: 100%;
-      }
+        .right-c {
+          width: 100%;
+        }
 
-      .right-b {
-        width: 100%;
-      }
+        .right-b {
+          width: 100%;
+        }
 
-      .right-f {
-        width: 100%;
+        .right-f {
+          width: 100%;
+        }
       }
     }
-  }
 
-  /* fade.css */
-  .fade-enter-active {
-    transition: opacity 2.5s ease;
+    /* fade.css */
+    .fade-enter-active {
+      transition: opacity 2.5s ease;
 
-    /* 设置过渡时间为1秒 */
-  }
+      /* 设置过渡时间为1秒 */
+    }
 
-  .fade-leave-active {
-    transition: opacity 0.5s ease;
+    .fade-leave-active {
+      transition: opacity 0.5s ease;
 
-    /* 设置过渡时间为1秒 */
-  }
+      /* 设置过渡时间为1秒 */
+    }
 
-  .fade-enter,
-  .fade-leave-to {
-    opacity: 0;
+    .fade-enter,
+    .fade-leave-to {
+      opacity: 0;
 
-    /* 初始状态为不可见 */
+      /* 初始状态为不可见 */
+    }
   }
-}
 </style>