1. 解决gis接口访问404报错问题，接口路径多了个空格

src/api/sys/monitor.ts

@@ -15,7 +15,7 @@ import {
 } from './model/monitorModel';
 
 enum Api {
-  getMonitorSiteTree = '/gis/data/gisBaseTree ',
+  getMonitorSiteTree = '/gis/data/gisBaseTree',
   getMonitorSite = '/gis/data/getDataByIdAndSystemCode',
   saveMonitorSite = '/gis/data/save',
 }

src/api/sys/user.ts

@@ -56,6 +56,6 @@ export function testRetry() {
 }
 
 export function getCodeInfo(currdatetime) {
-  let url = Api.getInputCode + `/${currdatetime}`;
+  const url = Api.getInputCode + `/${currdatetime}`;
   return defHttp.get({ url: url });
 }

src/views/vent/dust/dustAtomizing/dustAtomizing.api.ts

@@ -1,14 +1,10 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   realData = '/fire/show/realData',
 }
 /**
- * 
+ *
  * @param params
  */
-export const realData = (params) => defHttp.post({ url: Api.realData,params });
-
-
-
-
+export const realData = (params) => defHttp.post({ url: Api.realData, params });

src/views/vent/dust/dustHome/dustHome.api.ts

@@ -1,13 +1,11 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getAreaTypeList = '/dust/dustDisasterApi/getAreaTypeList',
-  getRealSensorDataByType='/dust/dustDisasterApi/getRealSensorDataByType',
-  getDustInfos='/dust/dustDisasterApi/getDustInfos',
-  historyAndForecast='/dust/dustDisasterApi/historyAndForecast',
+  getRealSensorDataByType = '/dust/dustDisasterApi/getRealSensorDataByType',
+  getDustInfos = '/dust/dustDisasterApi/getDustInfos',
+  historyAndForecast = '/dust/dustDisasterApi/historyAndForecast',
   realData = '/fire/show/realData',
- 
-
 }
 /**
  * 粉尘菜单树
@@ -19,22 +17,23 @@ export const getAreaTypeList = () => defHttp.get({ url: Api.getAreaTypeList });
  * 粉尘选项
  * @param params
  */
-export const getRealSensorDataByType = (params) => defHttp.get({ url: Api.getRealSensorDataByType,params });
+export const getRealSensorDataByType = (params) =>
+  defHttp.get({ url: Api.getRealSensorDataByType, params });
 
 /**
  * 获取粉尘单项数据
  * @param params
  */
-export const getDustInfos = (params) => defHttp.get({ url: Api.getDustInfos,params });
+export const getDustInfos = (params) => defHttp.get({ url: Api.getDustInfos, params });
 
 /**
  * 获取粉尘图表数据
  * @param params
  */
-export const historyAndForecast = (params) => defHttp.get({ url: Api.historyAndForecast,params });
+export const historyAndForecast = (params) => defHttp.get({ url: Api.historyAndForecast, params });
 
 /**
  * 智能喷雾降尘装置数据
  * @param params
  */
-export const realData = (params) => defHttp.post({ url: Api.realData,params });
+export const realData = (params) => defHttp.post({ url: Api.realData, params });

src/views/vent/dust/dustWarnAnalysis/dustWarnAnalysis.api.ts

@@ -1,12 +1,10 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getAreaTypeList = '/dust/dustDisasterApi/getAreaTypeList',
-  getRealSensorDataByType='/dust/dustDisasterApi/getRealSensorDataByType',
-  getDustInfos='/dust/dustDisasterApi/getDustInfos',
-  historyAndForecast='/dust/dustDisasterApi/historyAndForecast'
- 
-
+  getRealSensorDataByType = '/dust/dustDisasterApi/getRealSensorDataByType',
+  getDustInfos = '/dust/dustDisasterApi/getDustInfos',
+  historyAndForecast = '/dust/dustDisasterApi/historyAndForecast',
 }
 /**
  * 粉尘菜单树
@@ -18,16 +16,17 @@ export const getAreaTypeList = () => defHttp.get({ url: Api.getAreaTypeList });
  * 粉尘选项
  * @param params
  */
-export const getRealSensorDataByType = (params) => defHttp.get({ url: Api.getRealSensorDataByType,params });
+export const getRealSensorDataByType = (params) =>
+  defHttp.get({ url: Api.getRealSensorDataByType, params });
 
 /**
  * 获取粉尘单项数据
  * @param params
  */
-export const getDustInfos = (params) => defHttp.get({ url: Api.getDustInfos,params });
+export const getDustInfos = (params) => defHttp.get({ url: Api.getDustInfos, params });
 
 /**
  * 获取粉尘图表数据
  * @param params
  */
-export const historyAndForecast = (params) => defHttp.get({ url: Api.historyAndForecast,params });
+export const historyAndForecast = (params) => defHttp.get({ url: Api.historyAndForecast, params });

src/views/vent/fire/compositeWarn/composite.api.ts

@@ -1,13 +1,12 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
-  getSgjcPointInfo= '/fire/fireDisasterApi/getSgjcPointInfo',
-  getSgjcRealDataByPointCode='/fire/fireDisasterApi/getSgjcRealDataByPointCode',
-  getSgjcHistoryData='/fire/fireDisasterApi/getSgjcHistoryData',
-  getInfosByAreaCode='/fire/fireDisasterApi/getInfosByAreaCode',
-  getGxcwHistoryDataByPointCode='/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
-
+  getSgjcPointInfo = '/fire/fireDisasterApi/getSgjcPointInfo',
+  getSgjcRealDataByPointCode = '/fire/fireDisasterApi/getSgjcRealDataByPointCode',
+  getSgjcHistoryData = '/fire/fireDisasterApi/getSgjcHistoryData',
+  getInfosByAreaCode = '/fire/fireDisasterApi/getInfosByAreaCode',
+  getGxcwHistoryDataByPointCode = '/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
 }
 /**
  * 菜单树接口
@@ -16,35 +15,37 @@ enum Api {
 export const getFireAreaInfo = (params) => defHttp.get({ url: Api.getFireAreaInfo, params });
 
 /**
- * 
+ *
  * 获取工作面光钎条数及测点编号
  * @param params
  */
 export const getInfosByAreaCode = (params) => defHttp.get({ url: Api.getInfosByAreaCode, params });
 
 /**
- * 
+ *
  * 获取光钎测温图表数据
  * @param params
  */
-export const getGxcwHistoryDataByPointCode = (params) => defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
+export const getGxcwHistoryDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
 
 /**
- * 
+ *
  * 获取工作面束管列表
  * @param params
  */
 export const getSgjcPointInfo = (params) => defHttp.get({ url: Api.getSgjcPointInfo, params });
 
 /**
- * 
+ *
  * 获取束管测点实时数据
  * @param params
  */
-export const getSgjcRealDataByPointCode = (params) => defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
+export const getSgjcRealDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
 
 /**
  * 获取束管曲线数据
  * @param params
  */
-export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });
+export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });

src/views/vent/fire/fireDistributionPoint/firePoint.api.ts

@@ -1,41 +1,38 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
-  getZcHfWd='/fire/fireDisasterApi/getZcHfWd',
-  getHeadingFace='/fire/fireDisasterApi/getHeadingFace',
-  getMainTrafficYw='/fire/fireDisasterApi/getMainTrafficYw',
-  getDsWd='/fire/fireDisasterApi/getDsWd',
+  getZcHfWd = '/fire/fireDisasterApi/getZcHfWd',
+  getHeadingFace = '/fire/fireDisasterApi/getHeadingFace',
+  getMainTrafficYw = '/fire/fireDisasterApi/getMainTrafficYw',
+  getDsWd = '/fire/fireDisasterApi/getDsWd',
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
- 
-
 }
 /**
  * 综采工作面
  * @param params
  */
-export const getZcHfWd = () => defHttp.get({ url: Api.getZcHfWd, });
+export const getZcHfWd = () => defHttp.get({ url: Api.getZcHfWd });
 
 /**
  * 掘进工作面
  * @param params
  */
-export const getHeadingFace = () => defHttp.get({ url: Api.getHeadingFace, });
+export const getHeadingFace = () => defHttp.get({ url: Api.getHeadingFace });
 
 /**
  * 运输系统烟雾传感器
  * @param params
  */
-export const getMainTrafficYw = () => defHttp.get({ url: Api.getMainTrafficYw, });
+export const getMainTrafficYw = () => defHttp.get({ url: Api.getMainTrafficYw });
 
 /**
  * 机电硐室传感器
  * @param params
  */
-export const getDsWd = () => defHttp.get({ url: Api.getDsWd, });
+export const getDsWd = () => defHttp.get({ url: Api.getDsWd });
 
 /**
  * 菜单树接口
  * @param params
  */
 export const getFireAreaInfo = (params) => defHttp.get({ url: Api.getFireAreaInfo, params });
-

src/views/vent/fire/fireGoaf/goaf.api.ts

@@ -1,11 +1,9 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
-  getMbRealData ='/fire/fireDisasterApi/getMbRealData',
-  getMbHistoryData='/fire/fireDisasterApi/getMbHistoryData',
-
-
+  getMbRealData = '/fire/fireDisasterApi/getMbRealData',
+  getMbHistoryData = '/fire/fireDisasterApi/getMbHistoryData',
 }
 /**
  * 密闭监测实时数据
@@ -14,15 +12,15 @@ enum Api {
 export const getMbRealData = (params) => defHttp.get({ url: Api.getMbRealData, params });
 
 /**
- * 
+ *
  * 获取左侧菜单树
  * @param params
  */
 export const getFireAreaInfo = (params) => defHttp.get({ url: Api.getFireAreaInfo, params });
 
 /**
- * 
+ *
  * 获取图表数据
  * @param params
  */
-export const getMbHistoryData = (params) => defHttp.get({ url: Api.getMbHistoryData, params });
+export const getMbHistoryData = (params) => defHttp.get({ url: Api.getMbHistoryData, params });

src/views/vent/fire/fireHome/firehome.api.ts

@@ -1,18 +1,16 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
-  getMbRealData ='/fire/fireDisasterApi/getMbRealData',
-  getSgjcPointInfo= '/fire/fireDisasterApi/getSgjcPointInfo',
-  getSgjcRealDataByPointCode='/fire/fireDisasterApi/getSgjcRealDataByPointCode',
-  getInfosByAreaCode='/fire/fireDisasterApi/getInfosByAreaCode',
-  getGxcwHistoryDataByPointCode='/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
-  getZcHfWd='/fire/fireDisasterApi/getZcHfWd',
-  getHeadingFace='/fire/fireDisasterApi/getHeadingFace',
-  getMainTrafficYw='/fire/fireDisasterApi/getMainTrafficYw',
-  getDsWd='/fire/fireDisasterApi/getDsWd',
- 
-
+  getMbRealData = '/fire/fireDisasterApi/getMbRealData',
+  getSgjcPointInfo = '/fire/fireDisasterApi/getSgjcPointInfo',
+  getSgjcRealDataByPointCode = '/fire/fireDisasterApi/getSgjcRealDataByPointCode',
+  getInfosByAreaCode = '/fire/fireDisasterApi/getInfosByAreaCode',
+  getGxcwHistoryDataByPointCode = '/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
+  getZcHfWd = '/fire/fireDisasterApi/getZcHfWd',
+  getHeadingFace = '/fire/fireDisasterApi/getHeadingFace',
+  getMainTrafficYw = '/fire/fireDisasterApi/getMainTrafficYw',
+  getDsWd = '/fire/fireDisasterApi/getDsWd',
 }
 /**
  * 工作面风险监测
@@ -27,53 +25,54 @@ export const getFireAreaInfo = (params) => defHttp.get({ url: Api.getFireAreaInf
 export const getMbRealData = (params) => defHttp.get({ url: Api.getMbRealData, params });
 
 /**
- * 
+ *
  * 获取工作面束管列表
  * @param params
  */
 export const getSgjcPointInfo = (params) => defHttp.get({ url: Api.getSgjcPointInfo, params });
 
 /**
- * 
+ *
  * 获取束管测点实时数据
  * @param params
  */
-export const getSgjcRealDataByPointCode = (params) => defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
+export const getSgjcRealDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
 
 /**
- * 
+ *
  * 获取光钎条数及测点编号
  * @param params
  */
 export const getInfosByAreaCode = (params) => defHttp.get({ url: Api.getInfosByAreaCode, params });
 
 /**
- * 
+ *
  * 获取光钎测温图表数据
  * @param params
  */
-export const getGxcwHistoryDataByPointCode = (params) => defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
+export const getGxcwHistoryDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
 /**
  * 综采工作面
  * @param params
  */
-export const getZcHfWd = () => defHttp.get({ url: Api.getZcHfWd, });
+export const getZcHfWd = () => defHttp.get({ url: Api.getZcHfWd });
 
 /**
  * 掘进工作面
  * @param params
  */
-export const getHeadingFace = () => defHttp.get({ url: Api.getHeadingFace, });
+export const getHeadingFace = () => defHttp.get({ url: Api.getHeadingFace });
 
 /**
  * 运输系统烟雾传感器
  * @param params
  */
-export const getMainTrafficYw = () => defHttp.get({ url: Api.getMainTrafficYw, });
+export const getMainTrafficYw = () => defHttp.get({ url: Api.getMainTrafficYw });
 
 /**
  * 机电硐室传感器
  * @param params
  */
-export const getDsWd = () => defHttp.get({ url: Api.getDsWd, });
-
+export const getDsWd = () => defHttp.get({ url: Api.getDsWd });

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" @changeSelect="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>
@@ -44,710 +59,760 @@
       <div :class="isShow ? 'center-area' : 'center-area1'">
         <div :class="isShow ? 'center-t' : 'center-t1'">
           <div class="center-scalc" @click="getScalc">
-            <img src="../../../../assets/images/scalc.png" alt="">
+            <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://82.157.13.146:18224/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"
-            @changeSelect="changeSelect">
-            <fiberBunbleJc :bunbleData="bunbleData" />
-          </DanelBd>
-        </div>
+            <DanelBd
+              :moduleName="'工作面束管监测'"
+              :selectValue="pointCode"
+              :moduleSelect="moduleSelect"
+              :contentStyle="{ contentH: '289px' }"
+              commonTitle="selected"
+              :selectList="selectList"
+              @change-select="changeSelect"
+            >
+              <fiberBunbleJc :bunbleData="bunbleData" />
+            </DanelBd>
+          </div>
         </transition>
-       
       </div>
 
       <transition name="fade" mode="out-in">
         <div class="right-area" v-if="isShow">
-        <!-- 右上区域 -->
-        <div class="right-t">
-          <DanelBd :moduleName="''" :contentStyle="{ contentH: '121px' }">
-            <systemJc />
-          </DanelBd>
-        </div>
-        <!-- 右中区域 -->
-        <div class="right-c">
-          <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" @changeSelect="changeSelect">
-            <substationJc :echartDatas="echartDatas" />
-          </DanelBd>
-        </div>
-        <!-- 右底部区域 -->
-        <div class="right-f">
-          <DanelBd :moduleName="'安全监控系统'" :contentStyle="{ contentH: '215px' }" commonTitle="selected"
-            :selectList="selectListAq" :selectValue="pointCodeAq" @changeSelect="changeSelect">
-            <safetyJc :safetyHead="safetyHead" :safetyList="safetyList" />
-          </DanelBd>
+          <!-- 右上区域 -->
+          <div class="right-t">
+            <DanelBd :moduleName="''" :contentStyle="{ contentH: '121px' }">
+              <systemJc />
+            </DanelBd>
+          </div>
+          <!-- 右中区域 -->
+          <div class="right-c">
+            <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"
+            >
+              <substationJc :echartDatas="echartDatas" />
+            </DanelBd>
+          </div>
+          <!-- 右底部区域 -->
+          <div class="right-f">
+            <DanelBd
+              :moduleName="'安全监控系统'"
+              :contentStyle="{ contentH: '215px' }"
+              commonTitle="selected"
+              :selectList="selectListAq"
+              :selectValue="pointCodeAq"
+              @change-select="changeSelect"
+            >
+              <safetyJc :safetyHead="safetyHead" :safetyList="safetyList" />
+            </DanelBd>
+          </div>
         </div>
-      </div>
       </transition>
-     
     </div>
   </div>
 </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 () => {
+  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 getFireAreaInfoList();
       //密闭
-      await getFireAreaInfoListMb()
+      await getFireAreaInfoListMb();
       //带式
-      await getFireAreaInfoListDs()
+      await getFireAreaInfoListDs();
       //变电硐室
-      await getFireAreaInfoListBd()
+      await getFireAreaInfoListBd();
       //安全监控
-      await getTableList()
+      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;
+    }, 5000);
   }
 
-}
-
-//获取工作面风险监测数据
-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()
+  //下拉选项切换
+  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 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 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 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
-    res.forEach(el => {
-      selectList.push({ label: el.pointName, value: el.pointCode })
-    })
-    pointCode.value = pointCode.value ? pointCode.value : selectList[0]['value']
-    //获取工作面束管测点实时数据  
-    getSgjcRealDataByPointCodeList()
+
+  //获取密闭下拉列表
+  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 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 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 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 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 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 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 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 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 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
+
+  //变电硐室防灭火监控系统
+  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 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 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 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 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 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 })
-    })
+
+  //获取安全监控列表数据
+  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 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 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,
+        });
+      });
+    }
   }
-}
-
-
-onMounted(() => {
-  //工作面
-  getFireAreaInfoList()
-  //密闭
-  getFireAreaInfoListMb()
-  //带式
-  getFireAreaInfoListDs()
-  //变电硐室
-  getFireAreaInfoListBd()
-  //安全监控
-  getTableList()
-  getMonitor()
 
-})
+  //获取掘进工作面传感器监测数据
+  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,
+        });
+      });
+    }
+  }
 
-onUnmounted(() => {
-  if (timer) {
-    clearTimeout(timer);
-    timer = null;
+  //获取机电硐室传感器数据
+  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;
+    }
+  });
 </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;
+
+    .moduleArea {
+      width: 100%;
+      height: 100%;
+    }
 
-    .left-area {
+    .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>

src/views/vent/fire/fireMonitor/fireMonitor.api.ts

@@ -1,16 +1,14 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
-  getMbRealData ='/fire/fireDisasterApi/getMbRealData',
-  getMbHistoryData='/fire/fireDisasterApi/getMbHistoryData',
-  getInfosByAreaCode='/fire/fireDisasterApi/getInfosByAreaCode',
-  getGxcwHistoryDataByPointCode='/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
-  getSgjcPointInfo= '/fire/fireDisasterApi/getSgjcPointInfo',
-  getSgjcRealDataByPointCode='/fire/fireDisasterApi/getSgjcRealDataByPointCode',
-  getSgjcHistoryData='/fire/fireDisasterApi/getSgjcHistoryData',
-
-
+  getMbRealData = '/fire/fireDisasterApi/getMbRealData',
+  getMbHistoryData = '/fire/fireDisasterApi/getMbHistoryData',
+  getInfosByAreaCode = '/fire/fireDisasterApi/getInfosByAreaCode',
+  getGxcwHistoryDataByPointCode = '/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
+  getSgjcPointInfo = '/fire/fireDisasterApi/getSgjcPointInfo',
+  getSgjcRealDataByPointCode = '/fire/fireDisasterApi/getSgjcRealDataByPointCode',
+  getSgjcHistoryData = '/fire/fireDisasterApi/getSgjcHistoryData',
 }
 /**
  * 密闭监测实时数据
@@ -19,49 +17,51 @@ enum Api {
 export const getMbRealData = (params) => defHttp.get({ url: Api.getMbRealData, params });
 
 /**
- * 
+ *
  * 获取左侧菜单树
  * @param params
  */
 export const getFireAreaInfo = (params) => defHttp.get({ url: Api.getFireAreaInfo, params });
 
 /**
- * 
+ *
  * 获取图表数据
  * @param params
  */
 export const getMbHistoryData = (params) => defHttp.get({ url: Api.getMbHistoryData, params });
 
 /**
- * 
+ *
  * 获取光钎条数及测点编号
  * @param params
  */
 export const getInfosByAreaCode = (params) => defHttp.get({ url: Api.getInfosByAreaCode, params });
 
 /**
- * 
+ *
  * 获取光钎测温图表数据
  * @param params
  */
-export const getGxcwHistoryDataByPointCode = (params) => defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
+export const getGxcwHistoryDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
 
 /**
- * 
+ *
  * 获取束管列表
  * @param params
  */
 export const getSgjcPointInfo = (params) => defHttp.get({ url: Api.getSgjcPointInfo, params });
 
 /**
- * 
+ *
  * 获取束管测点实时数据
  * @param params
  */
-export const getSgjcRealDataByPointCode = (params) => defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
+export const getSgjcRealDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
 
 /**
  * 获取束管曲线数据
  * @param params
  */
-export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });
+export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });

src/views/vent/fire/fireZhud/fireZhud.api.ts

@@ -1,12 +1,10 @@
-
 import { defHttp } from '@/utils/http/axios';
-enum Api {
-  getRealData= '/fire/show/realData',
 
+enum Api {
+  getRealData = '/fire/show/realData',
 }
 /**
  * 智能注氮数据
  * @param params
  */
 export const getRealData = (params) => defHttp.post({ url: Api.getRealData, params });
-

src/views/vent/fire/wokeFace/workeFace.api.ts

@@ -1,16 +1,15 @@
-
 import { defHttp } from '@/utils/http/axios';
+
 enum Api {
   getFireAreaInfo = '/fire/fireDisasterApi/getFireAreaInfo',
-  getInfosByAreaCode='/fire/fireDisasterApi/getInfosByAreaCode',
-  getGxcwHistoryDataByPointCode='/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
-  getYwRealData='/fire/fireDisasterApi/getYwRealData',
-  getHyRealData='/fire/fireDisasterApi/getHyRealData',
-  getPlzzRealData='/fire/fireDisasterApi/getPlzzRealData',
-  getSgjcPointInfo= '/fire/fireDisasterApi/getSgjcPointInfo',
-  getSgjcRealDataByPointCode='/fire/fireDisasterApi/getSgjcRealDataByPointCode',
-  getSgjcHistoryData='/fire/fireDisasterApi/getSgjcHistoryData',
-
+  getInfosByAreaCode = '/fire/fireDisasterApi/getInfosByAreaCode',
+  getGxcwHistoryDataByPointCode = '/fire/fireDisasterApi/getGxcwHistoryDataByPointCode',
+  getYwRealData = '/fire/fireDisasterApi/getYwRealData',
+  getHyRealData = '/fire/fireDisasterApi/getHyRealData',
+  getPlzzRealData = '/fire/fireDisasterApi/getPlzzRealData',
+  getSgjcPointInfo = '/fire/fireDisasterApi/getSgjcPointInfo',
+  getSgjcRealDataByPointCode = '/fire/fireDisasterApi/getSgjcRealDataByPointCode',
+  getSgjcHistoryData = '/fire/fireDisasterApi/getSgjcHistoryData',
 }
 /**
  * 菜单树接口
@@ -28,7 +27,8 @@ export const getInfosByAreaCode = (params) => defHttp.get({ url: Api.getInfosByA
  * 获取光钎图表数据
  * @param params
  */
-export const getGxcwHistoryDataByPointCode = (params) => defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
+export const getGxcwHistoryDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getGxcwHistoryDataByPointCode, params });
 
 /**
  * 获取烟雾传感器数据
@@ -49,14 +49,15 @@ export const getHyRealData = (params) => defHttp.get({ url: Api.getHyRealData, p
 export const getPlzzRealData = (params) => defHttp.get({ url: Api.getPlzzRealData, params });
 
 /**
- * 
+ *
  * 获取束管测点实时数据
  * @param params
  */
-export const getSgjcRealDataByPointCode = (params) => defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
+export const getSgjcRealDataByPointCode = (params) =>
+  defHttp.get({ url: Api.getSgjcRealDataByPointCode, params });
 
 /**
- * 
+ *
  * 获取束管列表
  * @param params
  */
@@ -66,4 +67,4 @@ export const getSgjcPointInfo = (params) => defHttp.get({ url: Api.getSgjcPointI
  * 获取束管曲线数据
  * @param params
  */
-export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });
+export const getSgjcHistoryData = (params) => defHttp.get({ url: Api.getSgjcHistoryData, params });