diff --git a/src/api/homePage/SoureceApi.ts b/src/api/homePage/SoureceApi.ts
index 4f0e59b..f1a55bf 100644
--- a/src/api/homePage/SoureceApi.ts
+++ b/src/api/homePage/SoureceApi.ts
@@ -2,8 +2,8 @@ import request from "@/utils/http/request";
 
 // 首页 资源总览
 // 源-网-荷-储”相关统计信息服务
-interface idInfo{
-  orgID:string;
+interface idInfo {
+  orgID: string;
 }
 export function statInfo_api(data: idInfo) {
   return request({
@@ -22,3 +22,12 @@ export function alert_api(data: idInfo) {
   });
 }
 
+
+// 获取运行监视---重过载告警统计
+export function runAlarm_api(data: idInfo) {
+  return request({
+    url: "/api/wwpm/biz/v1/max_load_rate",
+    method: "POST",
+    data,
+  });
+}
diff --git a/src/views/pages/homePage/runListenPage.vue b/src/views/pages/homePage/runListenPage.vue
index 783e156..fd1c9d7 100644
--- a/src/views/pages/homePage/runListenPage.vue
+++ b/src/views/pages/homePage/runListenPage.vue
@@ -4,19 +4,13 @@
   <div class="runLisenPage_container" :style="styleVar">
     <div class="runLisenPage">
       <div class="content_left">
-        <div
-          :class="`animated ${hideLeft ? 'fadeInLeftBig' : 'fadeOutLeftBig'}`"
-          :style="{ opacity: hideLeft ? '1' : '0' }"
-        >
+        <div :class="`animated ${hideLeft ? 'fadeInLeftBig' : 'fadeOutLeftBig'}`" :style="{ opacity: hideLeft ? '1' : '0' }">
           <div class="left_box">
             <!-- 源 -->
             <div>
               <div class="common_box source_run" v-if="run_sourceContentFlag">
                 <!-- 左收缩箭头 -->
-                <div
-                  class="icon_panel_left_on"
-                  @click="run_sourceContentFlag = false"
-                ></div>
+                <div class="icon_panel_left_on" @click="run_sourceContentFlag = false"></div>
                 <div class="title">
                   <img src="@/assets/images/mainPage/icon_title1.png" alt="" />
                   <span>源</span>
@@ -25,28 +19,20 @@
                   <div class="title_info margin1">功率曲线</div>
                   <div class="source_echart">
                     <div class="tabDate">
-                      <div
-                        :class="[
+                      <div :class="[
                           sourcetabDateFlag === item.id
                             ? 'tab_active'
                             : 'tab_default',
                           'tab',
-                        ]"
-                        v-for="item in sourceEchart"
-                        @click="sourcehandleTabDate(item)"
-                      >
+                        ]" v-for="item in sourceEchart" @click="sourcehandleTabDate(item)">
                         {{ item.name }}
                       </div>
                     </div>
                     <div class="source_echart_box">
                       <!--光伏曲线  -->
-                      <source_Photovoltaic_echart
-                        v-if="sourcetabDateFlag === 1"
-                      ></source_Photovoltaic_echart>
+                      <source_Photovoltaic_echart v-if="sourcetabDateFlag === 1"></source_Photovoltaic_echart>
                       <!-- 厂站曲线 -->
-                      <source_factoryStation_echart
-                        v-else
-                      ></source_factoryStation_echart>
+                      <source_factoryStation_echart v-else></source_factoryStation_echart>
                     </div>
                     <!-- <div class="ratebox">
                     <div class="rate">
@@ -75,10 +61,7 @@
               </div>
               <div class="sourceRunContent source_run" v-else>
                 <div class="showPanel">
-                  <div
-                    class="icon_panel_left_off"
-                    @click="run_sourceContentFlag = true"
-                  ></div>
+                  <div class="icon_panel_left_off" @click="run_sourceContentFlag = true"></div>
                 </div>
               </div>
             </div>
@@ -86,10 +69,7 @@
             <div>
               <div class="load_run common_box" v-if="run_loadContentFlag">
                 <!-- 左收缩箭头 -->
-                <div
-                  class="icon_panel_left_on"
-                  @click="run_loadContentFlag = false"
-                ></div>
+                <div class="icon_panel_left_on" @click="run_loadContentFlag = false"></div>
                 <div class="title">
                   <img src="@/assets/images/mainPage/icon_title2.png" alt="" />
                   <span>荷</span>
@@ -98,16 +78,12 @@
                   <div class="title_info margin2">功率曲线</div>
                   <div class="load_echart">
                     <div class="tabDate">
-                      <div
-                        :class="[
+                      <div :class="[
                           loadtabDateFlag === item.id
                             ? 'tab_active'
                             : 'tab_default',
                           'tab',
-                        ]"
-                        v-for="item in loadEchart"
-                        @click="handleloadTabDate(item)"
-                      >
+                        ]" v-for="item in loadEchart" @click="handleloadTabDate(item)">
                         {{ item.name }}
                       </div>
                     </div>
@@ -143,10 +119,7 @@
               </div>
               <div class="loadRunContent load_run" v-else>
                 <div class="showPanel">
-                  <div
-                    class="icon_panel_left_off"
-                    @click="run_loadContentFlag = true"
-                  ></div>
+                  <div class="icon_panel_left_off" @click="run_loadContentFlag = true"></div>
                 </div>
               </div>
             </div>
@@ -158,10 +131,8 @@
                 <div class="scroll-text box" v-for="item in alertdata.alertArr">
                   <img src="@/assets/images/homePage/gaojing2.png" alt="" />
                   <div>
-                    <span
-                      >{{ item.name
-                      }}{{ item.type === "1" ? "线路" : "台区" }}</span
-                    >出现重过载，发生时间：{{ item.datetime }}
+                    <span>{{ item.name
+                      }}{{ item.type === "1" ? "线路" : "台区" }}</span>出现重过载，发生时间：{{ item.datetime }}
                   </div>
                 </div>
               </div>
@@ -171,20 +142,14 @@
         </div>
       </div>
       <div class="content_right">
-        <div
-          :class="` animated ${
+        <div :class="` animated ${
             hideRight ? 'fadeInRightBig' : 'fadeOutRightBig'
-          }`"
-          :style="{ opacity: hideRight ? '1' : '0' }"
-        >
+          }`" :style="{ opacity: hideRight ? '1' : '0' }">
           <!-- 网 -->
           <div>
             <div class="run_network common_box" v-if="runNetworkFlag">
               <!-- 左收缩箭头 -->
-              <div
-                class="icon_panel_left_on"
-                @click="runNetworkFlag = false"
-              ></div>
+              <div class="icon_panel_left_on" @click="runNetworkFlag = false"></div>
               <div class="title">
                 <img src="@/assets/images/mainPage/icon_title3.png" alt="" />
                 <span>网</span>
@@ -216,28 +181,20 @@
                 </div>
                 <div class="network_info">
                   <div class="tabDate networktab">
-                    <div
-                      :class="[
+                    <div :class="[
                         networktabDateFlag === item.id
                           ? 'tab_active'
                           : 'tab_default',
                         'tab',
-                      ]"
-                      v-for="item in networkEchart"
-                      @click="sourcehandleTabDate(item)"
-                    >
+                      ]" v-for="item in networkEchart" @click="sourcehandleTabDate(item)">
                       {{ item.name }}
                     </div>
                   </div>
                   <div class="source_echart_box">
                     <!--光伏曲线  -->
-                    <source_Photovoltaic_echart_Line
-                      v-if="sourcetabDateFlag === 1"
-                    ></source_Photovoltaic_echart_Line>
+                    <source_Photovoltaic_echart_Line v-if="sourcetabDateFlag === 1"></source_Photovoltaic_echart_Line>
                     <!-- 厂站曲线 -->
-                    <source_Photovoltaic_echart_Line
-                      v-else
-                    ></source_Photovoltaic_echart_Line>
+                    <source_Photovoltaic_echart_Line v-else></source_Photovoltaic_echart_Line>
                   </div>
                   <!-- <div class="line">
                     <img
@@ -282,10 +239,7 @@
             </div>
             <div class="runNetworkContent run_network" v-else>
               <div class="showPanel">
-                <div
-                  class="icon_panel_left_off"
-                  @click="runNetworkFlag = true"
-                ></div>
+                <div class="icon_panel_left_off" @click="runNetworkFlag = true"></div>
               </div>
             </div>
           </div>
@@ -293,10 +247,7 @@
           <div>
             <div class="run_storage common_box" v-if="runStorageFlag">
               <!-- 左收缩箭头 -->
-              <div
-                class="icon_panel_left_on"
-                @click="runStorageFlag = false"
-              ></div>
+              <div class="icon_panel_left_on" @click="runStorageFlag = false"></div>
               <div class="title">
                 <img src="@/assets/images/mainPage/icon_title4.png" alt="" />
                 <span>储</span>
@@ -317,10 +268,7 @@
             </div>
             <div class="runStorageContent run_storage">
               <div class="showPanel">
-                <div
-                  class="icon_panel_left_off"
-                  @click="runStorageFlag = true"
-                ></div>
+                <div class="icon_panel_left_off" @click="runStorageFlag = true"></div>
               </div>
             </div>
           </div>
@@ -339,16 +287,13 @@
           </div>
           <div class="content">
             <div class="table_box">
-              <el-table
-                :data="
+              <el-table :data="
                   tableData.tdate.slice(
                     (currentPage - 1) * pageSize,
                     currentPage * pageSize
                   )
-                "
-                style="width: 100%; height: 100%"
-              >
-                
+                " style="width: 100%; height: 100%">
+
                 <el-table-column label="名称" align="center">
                   <template #default="scope">
                     <span style="margin-left: 10px">{{
@@ -375,21 +320,12 @@
                     <span style="margin-left: 10px">{{ scope.row.datetime }}</span>
                   </template>
                 </el-table-column>
- 
+
               </el-table>
             </div>
           </div>
           <div class="bottom">
-            <el-pagination
-              small
-              background
-              layout="prev,pager,next"
-              v-model:current-page="currentPage"
-              v-model:page-size="pageSize"
-              :total="total"
-              @size-change="handleSizeChange"
-              @current-change="handleCurrentChange"
-            ></el-pagination>
+            <el-pagination small background layout="prev,pager,next" v-model:current-page="currentPage" v-model:page-size="pageSize" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
           </div>
         </div>
       </div>
@@ -398,99 +334,89 @@
 </template>
 
 <script setup lang="ts">
-import { ElCheckbox } from "element-plus";
-import {
-  ref,
-  computed,
-  watch,
-  onMounted,
-  reactive,
-  onUnmounted,
-  nextTick,
-  Ref,
-  getCurrentInstance,
-  inject,
-  defineComponent,
-} from "vue";
-import { ArrowDown } from "@element-plus/icons-vue";
-import { ElMessage } from "element-plus";
-import { getColorFun } from "@/hooks/getColorFun/index";
-import { app_load, api_send, api_register } from "@/ue4Player/app";
-import threeDPie from "@/views/commonPage/3DPie.vue";
-import { id } from "element-plus/es/locale/index.mjs";
-import { ITEM_RENDER_EVT } from "element-plus/es/components/virtual-list/src/defaults.mjs";
-import source_Photovoltaic_echart from "./threeLine.vue";
-import source_Photovoltaic_echart_Line from "./threeLine_Line.vue";
+import { ElCheckbox } from 'element-plus'
+import { ref, computed, watch, onMounted, reactive, onUnmounted, nextTick, Ref, getCurrentInstance, inject, defineComponent } from 'vue'
+import { ArrowDown } from '@element-plus/icons-vue'
+import { ElMessage } from 'element-plus'
+import { getColorFun } from '@/hooks/getColorFun/index'
+import { app_load, api_send, api_register } from '@/ue4Player/app'
+import threeDPie from '@/views/commonPage/3DPie.vue'
+import { id } from 'element-plus/es/locale/index.mjs'
+import { ITEM_RENDER_EVT } from 'element-plus/es/components/virtual-list/src/defaults.mjs'
+import source_Photovoltaic_echart from './threeLine.vue'
+import source_Photovoltaic_echart_Line from './threeLine_Line.vue'
 
-import source_factoryStation_echart from "./twoLine.vue";
+import source_factoryStation_echart from './twoLine.vue'
 
-import oneLine_load from "./oneLine_load.vue";
+import oneLine_load from './oneLine_load.vue'
 
-import load_echart from "./oneLine.vue";
-import storage_echart from "./oneLine.vue";
-import threeEchart from "./3Dechart.vue";
+import load_echart from './oneLine.vue'
+import storage_echart from './oneLine.vue'
+import threeEchart from './3Dechart.vue'
 
-import { alert_api, statInfo_api } from "@/api/homePage/SoureceApi";
+import { alert_api, statInfo_api, runAlarm_api } from '@/api/homePage/SoureceApi'
 
 onMounted(() => {
-  getStatInfo();
-  alertInfo();
+  getStatInfo()
+  alertInfo()
   // 定时获取接口数据
   // setInterval(() => {
   //   getStatInfo();
   // }, 3000);
-  handeleTable();
-});
+  handeleTable()
+  // 获取运行监视---重过载告警统计
+  getRunAlarm()
+})
 
 // 源页面标识
-let sourceFlag = ref(true);
+let sourceFlag = ref(true)
 // 荷页面标识
-let loadFlag = ref(true);
+let loadFlag = ref(true)
 // tabPage  页面默认显示资源总览
-let tabPageFlag = ref(1);
+let tabPageFlag = ref(1)
 
 const tabPage = reactive([
   {
     id: 1,
-    pageName: "资源汇聚",
+    pageName: '资源汇聚'
   },
   {
     id: 2,
-    pageName: "运行监视",
-  },
-]);
+    pageName: '运行监视'
+  }
+])
 const handleTabPage = (val: number) => {
-  tabPageFlag.value = val;
+  tabPageFlag.value = val
 
   // 当前页面为不显示的时候
   // hideLeft.value = false;
   // hideRight.value = false;
-};
+}
 
-let infolistFlag=ref(false)//告警信息详情
+let infolistFlag = ref(false) //告警信息详情
 // lengendDate
 let lengendDate = reactive([
   {
     id: 1,
-    lengendName: "源",
-    checkFlag: false,
+    lengendName: '源',
+    checkFlag: false
   },
   {
     id: 2,
-    lengendName: "网",
-    checkFlag: false,
+    lengendName: '网',
+    checkFlag: false
   },
   {
     id: 3,
-    lengendName: "荷",
-    checkFlag: false,
+    lengendName: '荷',
+    checkFlag: false
   },
   {
     id: 4,
-    lengendName: "储",
-    checkFlag: false,
-  },
-]);
+    lengendName: '储',
+    checkFlag: false
+  }
+])
 // const handleLegend = (val: number) => {
 //   lengendFlag.value = val + 1;
 //   val = 0;
@@ -498,7 +424,7 @@ let lengendDate = reactive([
 // 右下角三维选中和取消勾选
 let handleSelectCheck = (datas: any) => {
   // 让选中的项样式发生变化
-  datas.checkFlag = !datas.checkFlag;
+  datas.checkFlag = !datas.checkFlag
   // if (data.lengendName === "中压光伏" || data.lengendName === "低压光伏" || data.lengendName === "充电站" || data.lengendName === "储能站") {
   //     // bottomconterListtest.includes(props.gettreeprovidecityname)
   //     bottomconterListtest.forEach(item => {
@@ -524,399 +450,390 @@ let handleSelectCheck = (datas: any) => {
   //         console.log("SwitchStationstatus", "Switchstationstatus");
   //     });
   // }
-};
+}
 // 左-源 -光伏
 interface lenCoutInfoItem {
-  length: number;
-  count: number;
+  length: number
+  count: number
 }
 interface lenCoutInfo {
-  [key: string]: lenCoutInfoItem;
+  [key: string]: lenCoutInfoItem
 }
-let SourcePv_unit: Ref<lenCoutInfo | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let unit10: Ref<lenCoutInfoItem | null> = ref({ length: 1010, count: 1010 }); //10kv光伏
-let unit35: Ref<lenCoutInfoItem | null> = ref({ length: 1010, count: 1010 }); //35kv光伏
-let unit380lowarr = reactive<any>([]); //380v一下光伏
-let unit380lowarrLength = ref(1010); //380v一下光伏的长度
-let unit380lowarrCount = ref(1010); //380v一下光伏的户数
+let SourcePv_unit: Ref<lenCoutInfo | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let unit10: Ref<lenCoutInfoItem | null> = ref({ length: 1010, count: 1010 }) //10kv光伏
+let unit35: Ref<lenCoutInfoItem | null> = ref({ length: 1010, count: 1010 }) //35kv光伏
+let unit380lowarr = reactive<any>([]) //380v一下光伏
+let unit380lowarrLength = ref(1010) //380v一下光伏的长度
+let unit380lowarrCount = ref(1010) //380v一下光伏的户数
 // 左-源-充电站
 interface InfoItem {
-  name?: number;
-  ratedS?: number | undefined;
-  length?: number | undefined;
-  count?: number;
+  name?: number
+  ratedS?: number | undefined
+  length?: number | undefined
+  count?: number
 }
 interface Info {
-  [key: string]: InfoItem;
+  [key: string]: InfoItem
 }
 // let SourcePvstation: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
 let SourcePvstation: Ref<Info | null> = ref([
   {
-    name: "**厂站",
-    ratedS: 1015,
+    name: '**厂站',
+    ratedS: 1015
   },
   {
-    name: "**厂站",
-    ratedS: 1015,
-  },
-]); // 使用 ref 来创建一个响应式引用
+    name: '**厂站',
+    ratedS: 1015
+  }
+]) // 使用 ref 来创建一个响应式引用
 
 // 左 -荷-充电桩
-let sumLoadrateds = ref<any>(0); //额定电压总功率
-let loadchargingPile: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let loadchargingPileratedS = ref<any>(10); //充电桩功率
-let loadchargingPilecount = ref<any>(10); //充电桩户数
+let sumLoadrateds = ref<any>(0) //额定电压总功率
+let loadchargingPile: Ref<Info | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let loadchargingPileratedS = ref<any>(10) //充电桩功率
+let loadchargingPilecount = ref<any>(10) //充电桩户数
 
 // 左-荷-空调
-let loadAirconditioner: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let loadAirconditionerratedS = ref<any>(10); //空调得功率
-let loadAirconditionercount = ref<any>(0); //空调得户数
+let loadAirconditioner: Ref<Info | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let loadAirconditionerratedS = ref<any>(10) //空调得功率
+let loadAirconditionercount = ref<any>(0) //空调得户数
 // 左-荷-微网
 // let loadMicrogrid: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let loadMicrogridrratedS = ref<any>(0); //空调得功率
-let loadMicrogridcount = ref<any>(0); //空调得户数
+let loadMicrogridrratedS = ref<any>(0) //空调得功率
+let loadMicrogridcount = ref<any>(0) //空调得户数
 
 // 右-储-用户侧
-let storedUserPart: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let storedUserPartAreaRatedS = ref<any>(10); //西小站得功率
-let storedUserPartAreaCount = ref<any>(10); //西小站得户数
+let storedUserPart: Ref<Info | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let storedUserPartAreaRatedS = ref<any>(10) //西小站得功率
+let storedUserPartAreaCount = ref<any>(10) //西小站得户数
 
-let storedUserPartuserRatedS = ref<any>(10); //用户侧得功率
-let storedUserPartuserCount = ref<any>(10); //用户侧得户数
+let storedUserPartuserRatedS = ref<any>(10) //用户侧得功率
+let storedUserPartuserCount = ref<any>(10) //用户侧得户数
 
 // 右 网 主配网
 //  主网
-let networkLine: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let networkLine110RatedS = ref<any>(0); //主网110得功率
-let networkLine110Count = ref<any>(0); //主网110得条数
-let networkLine35RatedS = ref<any>(0); //主网110功率
-let networkLine35Count = ref<any>(0); //主网110条数
+let networkLine: Ref<Info | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let networkLine110RatedS = ref<any>(0) //主网110得功率
+let networkLine110Count = ref<any>(0) //主网110得条数
+let networkLine35RatedS = ref<any>(0) //主网110功率
+let networkLine35Count = ref<any>(0) //主网110条数
 
 //  配网
-let networkFeer: Ref<Info | null> = ref(null); // 使用 ref 来创建一个响应式引用
-let networkFeer10RatedS = ref<any>(0); //配网10得功率
-let networkFeer10Count = ref<any>(0); //配网10得条数
-let networkFeer35RatedS = ref<any>(0); //配网35得功率
-let networkFeer35Count = ref<any>(0); //配网35得条数
+let networkFeer: Ref<Info | null> = ref(null) // 使用 ref 来创建一个响应式引用
+let networkFeer10RatedS = ref<any>(0) //配网10得功率
+let networkFeer10Count = ref<any>(0) //配网10得条数
+let networkFeer35RatedS = ref<any>(0) //配网35得功率
+let networkFeer35Count = ref<any>(0) //配网35得条数
 
-let networkFeer380RatedS = ref<any>(1010); //配网380得功率
-let networkFeer380Count = ref<any>(0); //配网380得条数
+let networkFeer380RatedS = ref<any>(1010) //配网380得功率
+let networkFeer380Count = ref<any>(0) //配网380得条数
 
 // getStatInfo接口数据
 const getStatInfo = async () => {
   try {
-    let resPonse = await statInfo_api({});
+    let resPonse = await statInfo_api({})
 
     nextTick(() => {
       if (resPonse) {
         // 成功获取到数据，进行后续处理
-        console.log("接口数据：", resPonse);
-        let statInfo: any = JSON.parse(JSON.stringify(resPonse));
+        console.log('接口数据：', resPonse)
+        let statInfo: any = JSON.parse(JSON.stringify(resPonse))
         // SourcePv_unit  分布式光伏数据
-        SourcePv_unit.value = statInfo.data.photo_voltaic_unit as any;
+        SourcePv_unit.value = statInfo.data.photo_voltaic_unit as any
         for (const key in SourcePv_unit.value) {
           if (SourcePv_unit.value.hasOwnProperty(key)) {
-            const item = SourcePv_unit.value[key];
-            if (key === "BV-AC00101") {
-              unit10.value = item; //10kv数据
+            const item = SourcePv_unit.value[key]
+            if (key === 'BV-AC00101') {
+              unit10.value = item //10kv数据
               // console.log(key,item,'10');
-            } else if (key === "BV-AC00351") {
-              unit35.value = item; //35kv数据
-            } else if (key === "BV-AC03802") {
-              unit380lowarr.push(item); //380v数据
-            } else if (key === "BV-AC02202") {
-              unit380lowarr.push(item); //220v数据
+            } else if (key === 'BV-AC00351') {
+              unit35.value = item //35kv数据
+            } else if (key === 'BV-AC03802') {
+              unit380lowarr.push(item) //380v数据
+            } else if (key === 'BV-AC02202') {
+              unit380lowarr.push(item) //220v数据
             }
-            unit380lowarrLength.value =
-              unit380lowarr[0]?.length + unit380lowarr[1]?.length; //380v及其以下长度
-            unit380lowarrCount.value =
-              unit380lowarr[0]?.count + unit380lowarr[1]?.count; //380v及其以下户数
+            unit380lowarrLength.value = unit380lowarr[0]?.length + unit380lowarr[1]?.length //380v及其以下长度
+            unit380lowarrCount.value = unit380lowarr[0]?.count + unit380lowarr[1]?.count //380v及其以下户数
           }
         }
         // SourcePvstation  光伏电站
-        SourcePvstation.value = statInfo.data.photo_voltaic_station as any;
+        SourcePvstation.value = statInfo.data.photo_voltaic_station as any
         // loadchargingPile 充电桩
 
-        loadchargingPile.value = statInfo.data.charging_pile as Info;
+        loadchargingPile.value = statInfo.data.charging_pile as Info
         //  荷 充电桩  功率
-        loadchargingPileratedS.value = Object?.values(
-          loadchargingPile.value
-        ).reduce((sum, ite) => sum + ite.ratedS, 0);
+        loadchargingPileratedS.value = Object?.values(loadchargingPile.value).reduce((sum, ite) => sum + ite.ratedS, 0)
         //  荷 充电桩  户数
-        loadchargingPilecount.value = Object.values(
-          loadchargingPile.value
-        ).reduce((sum, ite) => sum + ite.count, 0);
+        loadchargingPilecount.value = Object.values(loadchargingPile.value).reduce((sum, ite) => sum + ite.count, 0)
 
         // 功率 荷 空调 loadAirconditioner
-        loadAirconditioner.value = statInfo.data.air_conditioner as Info;
+        loadAirconditioner.value = statInfo.data.air_conditioner as Info
         for (const key in loadAirconditioner.value) {
           if (loadAirconditioner.value.hasOwnProperty(key)) {
-            const item = loadAirconditioner.value[key];
-            if (key === "BV-AC02202") {
-              console.log(item);
-              loadAirconditionerratedS.value = item.ratedS; //空调功率
-              loadAirconditionercount.value = item.count; //空调户数
-            } else if (key === "micro_grid") {
-              loadMicrogridrratedS.value = 0; //微网功率
-              loadMicrogridcount.value = item.count; //微网户数
+            const item = loadAirconditioner.value[key]
+            if (key === 'BV-AC02202') {
+              console.log(item)
+              loadAirconditionerratedS.value = item.ratedS //空调功率
+              loadAirconditionercount.value = item.count //空调户数
+            } else if (key === 'micro_grid') {
+              loadMicrogridrratedS.value = 0 //微网功率
+              loadMicrogridcount.value = item.count //微网户数
             }
           }
         }
         //  荷 空调  功率
         // loadAirconditionerratedS.value = 0
         //  荷 充电桩  户数
-        sumLoadrateds.value =
-          loadMicrogridrratedS.value +
-          loadAirconditionerratedS.value +
-          loadchargingPileratedS.value;
+        sumLoadrateds.value = loadMicrogridrratedS.value + loadAirconditionerratedS.value + loadchargingPileratedS.value
         //储 西小站
         //储  用户侧 storedUserPart
-        storedUserPart.value = statInfo.data.battery_unit as Info;
+        storedUserPart.value = statInfo.data.battery_unit as Info
         for (const key in storedUserPart.value) {
           if (storedUserPart.value.hasOwnProperty(key)) {
-            const item = storedUserPart.value[key];
-            if (key === "area_109283") {
-              storedUserPartAreaRatedS.value = item.ratedS; //西小站储能功率
-              storedUserPartAreaCount.value = item.count; //西小站储能户数
-            } else if (key === "user_part") {
-              storedUserPartuserRatedS.value = item.ratedS; //西小站储能功率
-              storedUserPartuserCount.value = item.count; //西小站储能户数
+            const item = storedUserPart.value[key]
+            if (key === 'area_109283') {
+              storedUserPartAreaRatedS.value = item.ratedS //西小站储能功率
+              storedUserPartAreaCount.value = item.count //西小站储能户数
+            } else if (key === 'user_part') {
+              storedUserPartuserRatedS.value = item.ratedS //西小站储能功率
+              storedUserPartuserCount.value = item.count //西小站储能户数
             }
           }
         }
 
         // 网 主配网信息
         // networkLine 主网
-        networkLine.value = statInfo.data.line as Info;
+        networkLine.value = statInfo.data.line as Info
         for (const key in networkLine.value) {
           if (networkLine.value.hasOwnProperty(key)) {
-            const item = networkLine.value[key];
-            if (key === "BV-AC01101") {
-              networkLine110RatedS.value = item.length; //主网110得功率
-              networkLine110Count.value = item.count; //主网110得条数
-            } else if (key === "BV-AC00351") {
-              networkLine35RatedS.value = item.length; //主网110功率
-              networkLine35Count.value = item.count; //主网110条数
+            const item = networkLine.value[key]
+            if (key === 'BV-AC01101') {
+              networkLine110RatedS.value = item.length //主网110得功率
+              networkLine110Count.value = item.count //主网110得条数
+            } else if (key === 'BV-AC00351') {
+              networkLine35RatedS.value = item.length //主网110功率
+              networkLine35Count.value = item.count //主网110条数
             }
           }
         }
         // networkFeer 配网
-        networkFeer.value = statInfo.data.feeder as Info;
+        networkFeer.value = statInfo.data.feeder as Info
         for (const key in networkFeer.value) {
           if (networkFeer.value.hasOwnProperty(key)) {
-            const item = networkFeer.value[key];
-            if (key === "BV-AC00101") {
-              networkFeer10RatedS.value = item.length; //主网110得功率
-              networkFeer10Count.value = item.count; //主网110得条数
-            } else if (key === "BV-AC00351") {
-              networkFeer35RatedS.value = item.length; //主网110功率
-              networkFeer35Count.value = item.count; //主网110条数
-            } else if (key === "BV-AC03802") {
-              networkFeer380RatedS.value = item.length; //主网110功率
-              networkFeer380Count.value = item.count; //主网110条数
+            const item = networkFeer.value[key]
+            if (key === 'BV-AC00101') {
+              networkFeer10RatedS.value = item.length //主网110得功率
+              networkFeer10Count.value = item.count //主网110得条数
+            } else if (key === 'BV-AC00351') {
+              networkFeer35RatedS.value = item.length //主网110功率
+              networkFeer35Count.value = item.count //主网110条数
+            } else if (key === 'BV-AC03802') {
+              networkFeer380RatedS.value = item.length //主网110功率
+              networkFeer380Count.value = item.count //主网110条数
             }
           }
         }
       } else {
         // 获取数据失败，进行相应处理
-        console.log("无法获取接口数据");
+        console.log('无法获取接口数据')
       }
-    });
+    })
   } catch (error) {
     // 处理错误
-    console.error("An error occurred in statInfo_api:", error);
+    console.error('An error occurred in statInfo_api:', error)
   }
-};
+}
 interface AlertArr {
-  datetime: string;
-  loadRate: string;
-  mrid: string;
-  name: string;
-  type: string;
+  datetime: string
+  loadRate: string
+  mrid: string
+  name: string
+  type: string
 }
 interface Alertdata {
-  alertArr: AlertArr[];
+  alertArr: AlertArr[]
 }
 let alertdata = reactive<Alertdata>({
-  alertArr: [],
-});
+  alertArr: []
+})
 // 告警信息
 const alertInfo = () => {
   alert_api({
-    orgID: "8af8470a47aad8e20147aad92e400335",
-  }).then((res) => {
-    console.log(res, "88888889999");
+    orgID: '8af8470a47aad8e20147aad92e400335'
+  }).then(res => {
+    console.log(res, '88888889999')
     if (res?.data.length > 0) {
-      alertdata.alertArr = res.data;
-      tableData.tdate=res.data;
-      console.log(alertdata.alertArr, "0");
+      alertdata.alertArr = res.data
+      tableData.tdate = res.data
+      console.log(alertdata.alertArr, '0')
     } else {
-      console.log("没有数据");
+      console.log('没有数据')
     }
-  });
-};
+  })
+}
 // 资源总览
 // 荷
 let leftData = reactive({
   PVGenerationData: [
     {
-      name: "总发电量：",
-      value: "10728.8",
-      unit: "kWh",
+      name: '总发电量：',
+      value: '10728.8',
+      unit: 'kWh'
     },
     {
-      name: "月发电量：",
-      value: "1629.3",
-      unit: "kWh",
+      name: '月发电量：',
+      value: '1629.3',
+      unit: 'kWh'
     },
     {
-      name: "周发电量：",
-      value: "409.2",
-      unit: "kWh",
+      name: '周发电量：',
+      value: '409.2',
+      unit: 'kWh'
     },
     {
-      name: "日发电量：",
-      value: "62.5",
-      unit: "kWh",
-    },
+      name: '日发电量：',
+      value: '62.5',
+      unit: 'kWh'
+    }
   ],
   carbonEmissionData: [
     {
-      name: "总碳排放：",
-      value: "34071.2",
-      unit: "kg",
+      name: '总碳排放：',
+      value: '34071.2',
+      unit: 'kg'
     },
     {
-      name: "月碳排放：",
-      value: "5162.3",
-      unit: "kg",
+      name: '月碳排放：',
+      value: '5162.3',
+      unit: 'kg'
     },
     {
-      name: "周碳排放：",
-      value: "1304.1",
-      unit: "kg",
+      name: '周碳排放：',
+      value: '1304.1',
+      unit: 'kg'
     },
     {
-      name: "日碳排放：",
-      value: "183.5",
-      unit: "kg",
-    },
+      name: '日碳排放：',
+      value: '183.5',
+      unit: 'kg'
+    }
   ],
   threeDPieData: {
     pieData: [
       {
-        name: "可再生能源", //名称
+        name: '可再生能源', //名称
         value: 78, //值
         itemStyle: {
-          color: "#6BFF82", //半透明
-        },
+          color: '#6BFF82' //半透明
+        }
       },
       {
-        name: "其他能源",
+        name: '其他能源',
         value: 22,
         itemStyle: {
-          color: "#00AAF3",
-        },
-      },
+          color: '#00AAF3'
+        }
+      }
     ],
     total: 100,
     center: 0,
     legend: {
-      orient: "horizontal",
-      right: "center",
-      top: "2%",
-      itemGap: 30,
+      orient: 'horizontal',
+      right: 'center',
+      top: '2%',
+      itemGap: 30
     },
     grid3D: {
       viewControl: {
         distance: 500,
-        alpha: 35,
-      },
+        alpha: 35
+      }
     },
-    getHeight3D: 60,
-  },
-});
+    getHeight3D: 60
+  }
+})
 // 网
 // 网盒子得标识
-let networkContentFlag = ref(true);
-let networkFlag = ref("1");
+let networkContentFlag = ref(true)
+let networkFlag = ref('1')
 const changeNetWorkTab = (val: string) => {
-  networkFlag.value = val;
-};
+  networkFlag.value = val
+}
 // 运行监测
 // 源运行检测的标识
-let run_sourceContentFlag = ref(true);
+let run_sourceContentFlag = ref(true)
 // 荷运行检测标识
-let run_loadContentFlag = ref(true);
+let run_loadContentFlag = ref(true)
 // 网运行检测标识
-let runNetworkFlag = ref(true);
+let runNetworkFlag = ref(true)
 // 储能运行检测标识
-let runStorageFlag = ref(true);
+let runStorageFlag = ref(true)
 // 源
 // 切换tabDate
-let sourcetabDateFlag = ref(1);
+let sourcetabDateFlag = ref(1)
 let sourceEchart = reactive([
   {
     id: 1,
-    name: "光伏",
+    name: '光伏'
   },
   {
     id: 2,
-    name: "厂站",
-  },
-]);
+    name: '厂站'
+  }
+])
 
 // 网
-let networktabDateFlag = ref(1);
+let networktabDateFlag = ref(1)
 let networkEchart = reactive([
   {
     id: 1,
-    name: "线路",
+    name: '线路'
   },
   {
     id: 2,
-    name: "台区",
-  },
-]);
+    name: '台区'
+  }
+])
 const sourcehandleTabDate = (val: any) => {
-  sourcetabDateFlag.value = val.id;
-};
+  sourcetabDateFlag.value = val.id
+}
 // 荷
-let loadtabDateFlag = ref(1);
+let loadtabDateFlag = ref(1)
 let loadEchart = reactive([
   {
     id: 1,
-    name: "充电桩",
+    name: '充电桩'
   },
   {
     id: 2,
-    name: "空调",
-  },
-]);
+    name: '空调'
+  }
+])
 const handleloadTabDate = (val: any) => {
-  loadtabDateFlag.value = val.id;
-};
+  loadtabDateFlag.value = val.id
+}
 // 左
 // 右
 // 储
 // 储能盒子得标识
-let stroedContentFlag = ref(true);
-let storagetabDateFlag = ref(1);
+let stroedContentFlag = ref(true)
+let storagetabDateFlag = ref(1)
 let storageEchart = reactive([
   {
     id: 1,
-    name: "充电",
+    name: '充电'
   },
   {
     id: 2,
-    name: "放电",
-  },
-]);
+    name: '放电'
+  }
+])
 const handlestorageTabDate = (val: any) => {
-  storagetabDateFlag.value = val.id;
-};
+  storagetabDateFlag.value = val.id
+}
 // 充放点量时间选择器
-let selectDateObj = ref(null);
+let selectDateObj = ref(null)
 // 向线型图传参数
 
 // 中1
@@ -924,124 +841,137 @@ let selectDateObj = ref(null);
 // 表格
 // let alert_pvFlag = ref(false);
 
-
 interface TableDate {
-  name: string;
-  loadRate: string;
-  datetime: string;
-  type: string;
+  name: string
+  loadRate: string
+  datetime: string
+  type: string
 }
 interface TDATE {
-  tdate: TableDate[];
+  tdate: TableDate[]
 }
 let tableData = reactive<TDATE>({
-  tdate:[]
-});
+  tdate: []
+})
 const handeleTable = () => {
   // tableHeaderColor ({row, column, rowIndex, columnIndex}) {
   // 		return 'text-align: center;'
   // 	}
-};
+}
 
 // 分页
-let currentPage = ref<number>(1);
-let pageSize = ref<number>(6); //每页显示的个数
-let total = ref<number>(40);
+let currentPage = ref<number>(1)
+let pageSize = ref<number>(6) //每页显示的个数
+let total = ref<number>(40)
 
 const handleSizeChange = (size: number) => {
   // console.log(`${size} items per page`);
-  pageSize.value = size;
-};
+  pageSize.value = size
+}
 const handleCurrentChange = (page: number) => {
-  currentPage.value = page;
-};
+  currentPage.value = page
+}
 //选择器
 interface Infokey3 {
-  id: string;
-  label: string;
+  id: string
+  label: string
 }
-const infovalue = ref("");
+const infovalue = ref('')
 let infokeys = reactive<Infokey3[]>([
   {
-    id: "35kV",
-    label: "35kV",
+    id: '35kV',
+    label: '35kV'
   },
   {
-    id: "10kV",
-    label: "10kV",
+    id: '10kV',
+    label: '10kV'
   },
   {
-    id: "380V及以下",
-    label: "380V及以下",
-  },
-]);
+    id: '380V及以下',
+    label: '380V及以下'
+  }
+])
 
-const hideLeft = ref<boolean>(true); //默认页面显示
-const hideRight = ref<boolean>(true); //默认页面显示  右边
+const hideLeft = ref<boolean>(true) //默认页面显示
+const hideRight = ref<boolean>(true) //默认页面显示  右边
 // 组件卸载调用
 onUnmounted(() => {
-  hideLeft.value = false;
-  hideRight.value = false;
-});
+  hideLeft.value = false
+  hideRight.value = false
+})
 
 // 跳转三维
-const handleThree = (val) => {
+const handleThree = val => {
   const list = {
-    location: "(X=18705617.163,Y=1826842.166,Z=4299675.505)",
-    rotation: "Pitch=-89.9,Yaw=-90.542,Roll=0",
-  };
-  api_send("CameraMove", list, () => {
-    console.log("CameraMove");
-  });
+    location: '(X=18705617.163,Y=1826842.166,Z=4299675.505)',
+    rotation: 'Pitch=-89.9,Yaw=-90.542,Roll=0'
+  }
+  api_send('CameraMove', list, () => {
+    console.log('CameraMove')
+  })
   let _list = {
     CityID: val,
-    status: "1",
-  };
-  api_send("ShowCityEdge", _list, () => {
-    console.log("ShowCityEdge");
-  });
-};
+    status: '1'
+  }
+  api_send('ShowCityEdge', _list, () => {
+    console.log('ShowCityEdge')
+  })
+}
+//
+//
+//
+// 获取运行监视---重过载告警统计
+let getRunAlarm = () => {
+  alert_api({
+    orgID: '8af8470a47aad8e20147aad92e400335'
+  }).then(res => {
+    console.log(res, '88888889999')
+  })
+}
+//
+//
+//
 
 // 根据不同的屏幕宽度换算字体大小
 const transformFontSize = (fontsize: number) => {
   // 获取屏幕宽度
-  const width = window.screen.width;
-  const height = window.screen.height;
-  let ratio: any = 0;
+  const width = window.screen.width
+  const height = window.screen.height
+  let ratio: any = 0
   if (width > 3000) {
-    ratio = width / 4240;
+    ratio = width / 4240
   } else {
-    ratio = width / 2220;
+    ratio = width / 2220
   }
   // 取下整
-  return parseInt(fontsize * ratio);
-};
+  return parseInt(fontsize * ratio)
+}
 // 动态获取宽高
-let ctwh = ref();
-let ctht = ref();
+let ctwh = ref()
+let ctht = ref()
 const updateCtw = () => {
   if (window.screen.width > 1900) {
-    ctwh.value = Number(window.screen.width);
-    ctht.value = Number(window.screen.height);
+    ctwh.value = Number(window.screen.width)
+    ctht.value = Number(window.screen.height)
   } else {
-    ctwh.value = Number(1920);
-    ctht.value = Number(1080);
+    ctwh.value = Number(1920)
+    ctht.value = Number(1080)
   }
-};
+}
 // 使用watch来监听$route的变化
 watch(
   () => window.location.pathname,
-  (newPath) => {
-    updateCtw();
+  newPath => {
+    updateCtw()
   },
   { immediate: true }
-);
+)
 const styleVar = computed(() => {
   return {
-    "--box-width": ctwh.value + "px",
-    "--box-height": ctht.value + "px",
-  };
-});
+    '--box-width': ctwh.value + 'px',
+    '--box-height': ctht.value + 'px'
+  }
+})
 </script>
 
 <style lang="scss" scoped>
@@ -1095,7 +1025,7 @@ const styleVar = computed(() => {
   top: changeHeight(25);
   width: changeHeight(46.51);
   height: changeHeight(46.51);
-  background-image: url("@/assets/images/common/closebtn.png");
+  background-image: url('@/assets/images/common/closebtn.png');
   background-repeat: no-repeat;
   background-size: 100% 100%;
   z-index: 6;
@@ -1140,7 +1070,7 @@ const styleVar = computed(() => {
     height: changeHeight(38);
     width: changeHeight(45);
     height: changeHeight(45);
-    background: url("@/assets/images/common/title_yuanicon.png") no-repeat;
+    background: url('@/assets/images/common/title_yuanicon.png') no-repeat;
     background-size: 100% 100%;
   }
   // background: url("@/assets/images/common/common_title.png") no-repeat;
@@ -1154,7 +1084,7 @@ const styleVar = computed(() => {
     margin-top: changeHeight(5);
     width: changeHeight(580);
     height: changeHeight(20);
-    background: url("@/assets/images/common/title_lineicon.png") no-repeat;
+    background: url('@/assets/images/common/title_lineicon.png') no-repeat;
     background-size: 100% 100%;
   }
 }
@@ -1165,7 +1095,7 @@ const styleVar = computed(() => {
   flex-direction: column;
   .title {
     height: changeHeight(112.72);
-    background: url("@/assets/images/mainPage/common_titlebg.png") no-repeat;
+    background: url('@/assets/images/mainPage/common_titlebg.png') no-repeat;
     background-size: 100% 100%;
     margin-bottom: changeHeight(21);
     display: flex;
@@ -1186,7 +1116,7 @@ const styleVar = computed(() => {
   }
   .content {
     flex: 1;
-    background: url("@/assets/images/mainPage/common_contentbg.png") no-repeat;
+    background: url('@/assets/images/mainPage/common_contentbg.png') no-repeat;
     background-size: 100% 100%;
     display: flex;
     flex-direction: column;
@@ -1201,7 +1131,7 @@ const styleVar = computed(() => {
       height: changeHeight(50.11);
       font-size: changeHeight(40);
       padding-left: changeWidth(77);
-      background: url("@/assets/images/mainPage/bg_title.png") no-repeat;
+      background: url('@/assets/images/mainPage/bg_title.png') no-repeat;
       background-size: 100% 100%;
     }
     .title_info1 {
@@ -1233,7 +1163,7 @@ const styleVar = computed(() => {
   height: 100%;
   display: flex;
   //   margin-top: changeHeight(17);
-  font-family: "PingFang SC";
+  font-family: 'PingFang SC';
   font-style: normal;
   font-weight: 400;
   color: #ffffff;
@@ -1266,7 +1196,8 @@ const styleVar = computed(() => {
         align-items: center;
 
         .b {
-          width: changeHeight(200);cursor: pointer;
+          width: changeHeight(200);
+          cursor: pointer;
         }
         .box {
           display: flex;
@@ -1318,7 +1249,7 @@ const styleVar = computed(() => {
 
   // 运行检测
   .runLisenPage {
-    font-family: "PingFang SC";
+    font-family: 'PingFang SC';
     font-style: normal;
     // 切换
     .tabDate {
@@ -1436,7 +1367,7 @@ const styleVar = computed(() => {
       position: relative;
       .icon_panel_left_on {
         position: absolute;
-        background: url("@/assets/images/btnType/icon_panel_left.png") no-repeat;
+        background: url('@/assets/images/btnType/icon_panel_left.png') no-repeat;
         background-size: 100% 100%;
         width: changeHeight(42.28);
         height: changeHeight(52.02);
@@ -1462,7 +1393,7 @@ const styleVar = computed(() => {
       height: changeHeight(1014.74);
       .icon_panel_left_on {
         position: absolute;
-        background: url("@/assets/images/btnType/icon_panel_left.png") no-repeat;
+        background: url('@/assets/images/btnType/icon_panel_left.png') no-repeat;
         background-size: 100% 100%;
         width: changeHeight(42.28);
         height: changeHeight(52.02);
@@ -1491,8 +1422,7 @@ const styleVar = computed(() => {
       position: relative;
       .icon_panel_left_on {
         position: absolute;
-        background: url("@/assets/images/btnType/icon_panel_right.png")
-          no-repeat;
+        background: url('@/assets/images/btnType/icon_panel_right.png') no-repeat;
         background-size: 100% 100%;
         width: changeHeight(42.28);
         height: changeHeight(52.02);
@@ -1559,8 +1489,7 @@ const styleVar = computed(() => {
                     // position: absolute;
                     // box-sizing: content-box;
                     // display: flex;
-                    background: url("@/assets/images/btnType/fontbg.png")
-                      no-repeat;
+                    background: url('@/assets/images/btnType/fontbg.png') no-repeat;
                     background-size: 100% 100%;
                     padding-left: changeWidth(82);
                     padding-right: changeWidth(82);
@@ -1581,8 +1510,7 @@ const styleVar = computed(() => {
               line-height: changeHeight(80.31);
               display: flex;
               justify-content: space-between;
-              background: url("@/assets/images/mainPage/runlisten/network_bg.png")
-                no-repeat;
+              background: url('@/assets/images/mainPage/runlisten/network_bg.png') no-repeat;
 
               background-size: 100% 110%;
               .val {
@@ -1615,8 +1543,7 @@ const styleVar = computed(() => {
       position: relative;
       .icon_panel_left_on {
         position: absolute;
-        background: url("@/assets/images/btnType/icon_panel_right.png")
-          no-repeat;
+        background: url('@/assets/images/btnType/icon_panel_right.png') no-repeat;
         background-size: 100% 100%;
         width: changeHeight(42.28);
         height: changeHeight(52.02);
@@ -1682,8 +1609,7 @@ const styleVar = computed(() => {
         top: 50%;
         .icon_panel_left_off {
           position: absolute;
-          background: url("@/assets/images/btnType/icon_panel_right.png")
-            no-repeat;
+          background: url('@/assets/images/btnType/icon_panel_right.png') no-repeat;
           background-size: 100% 100%;
           width: changeHeight(42.28);
           height: changeHeight(52.02);
@@ -1703,8 +1629,7 @@ const styleVar = computed(() => {
         top: 50%;
         .icon_panel_left_off {
           position: absolute;
-          background: url("@/assets/images/btnType/icon_panel_left.png")
-            no-repeat;
+          background: url('@/assets/images/btnType/icon_panel_left.png') no-repeat;
           background-size: 100% 100%;
           width: changeHeight(42.28);
           height: changeHeight(52.02);
@@ -1724,263 +1649,258 @@ const styleVar = computed(() => {
   transform: translate(-50%, -50%);
 
   .run_detail {
-      box-sizing: border-box;
-      width: changeHeight(1338.06);
-      height: changeHeight(1218.37);
-      background: url("@/assets/images/osPage/run_detail_bg.png") no-repeat;
-      background-size: 100% 100%;
-      padding-top: 1%;
-      padding-left: changeHeight(27);
+    box-sizing: border-box;
+    width: changeHeight(1338.06);
+    height: changeHeight(1218.37);
+    background: url('@/assets/images/osPage/run_detail_bg.png') no-repeat;
+    background-size: 100% 100%;
+    padding-top: 1%;
+    padding-left: changeHeight(27);
 
-      .tip {
-        height: 7%;
-        display: flex;
-        align-items: center;
+    .tip {
+      height: 7%;
+      display: flex;
+      align-items: center;
 
-        img {
-          height: changeHeight(49);
-          margin-right: changeHeight(14);
-        }
-
-        /* 精品可视化素材店 */
-
-        font-weight: 600;
-        font-size: changeHeight(45);
+      img {
+        height: changeHeight(49);
+        margin-right: changeHeight(14);
       }
 
-      .title {
-        height: changeHeight(152);
+      /* 精品可视化素材店 */
+
+      font-weight: 600;
+      font-size: changeHeight(45);
+    }
+
+    .title {
+      height: changeHeight(152);
+      display: flex;
+      align-items: center;
+
+      .titlebg {
+        width: 100%;
+        height: changeHeight(82.15);
+        background: url('@/assets/images/osPage/run_detail_titlebg.png') no-repeat;
+        background-size: 100% 100%;
         display: flex;
         align-items: center;
 
-        .titlebg {
-          width: 100%;
-          height: changeHeight(82.15);
-          background: url("@/assets/images/osPage/run_detail_titlebg.png")
-            no-repeat;
-          background-size: 100% 100%;
-          display: flex;
-          align-items: center;
+        span {
+          margin-left: changeHeight(35);
+          font-weight: 400;
+          font-size: changeHeight(35);
+        }
+      }
+    }
 
-          span {
-            margin-left: changeHeight(35);
+    .content {
+      height: 68%;
+      margin-top: 1%;
+
+      :deep(.table_box) {
+        width: 100%;
+        height: 100%;
+        font-size: changeHeight(40) !important;
+
+        // 表格样式
+        .el-table,
+        tr,
+        th,
+        td {
+          background-color: transparent !important;
+        }
+
+        .el-table__body-wrapper {
+          color: #ffffff;
+        }
+
+        // 设置header的字体和高度
+        .el-table__header-wrapper {
+          .cell {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: changeHeight(40);
             font-weight: 400;
-            font-size: changeHeight(35);
+            height: changeHeight(93);
+            line-height: changeHeight(93);
           }
         }
-      }
 
-      .content {
-        height: 68%;
-        margin-top: 1%;
-
-        :deep(.table_box) {
-          width: 100%;
-          height: 100%;
-          font-size: changeHeight(40) !important;
-
-          // 表格样式
-          .el-table,
-          tr,
-          th,
+        // 设置行的字体和高度
+        .el-table__body-wrapper {
           td {
-            background-color: transparent !important;
+            // border-top: 1px solid rgba(255, 255, 255, 0.5);
+            // border-bottom: none;
           }
 
-          .el-table__body-wrapper {
-            color: #ffffff;
-          }
-
-          // 设置header的字体和高度
-          .el-table__header-wrapper {
-            .cell {
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              font-size: changeHeight(40);
-              font-weight: 400;
-              height: changeHeight(93);
-              line-height: changeHeight(93);
-            }
-          }
-
-          // 设置行的字体和高度
-          .el-table__body-wrapper {
-            td {
-              // border-top: 1px solid rgba(255, 255, 255, 0.5);
-              // border-bottom: none;
-            }
-
-            //  控制每行的高度
-            .cell {
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              height: changeHeight(100);
-              line-height: changeHeight(40);
-              font-size: changeHeight(38);
-              // font-weight: 400;
-            }
-          }
-
-          // el-table出现小白线 伪类
-          .el-table__inner-wrapper:before {
-            height: 0;
-          }
-
-          // 设置第一列单独样式
-          .el-table td:nth-child(1) {
-            color: #6ffbf7;
-            font-size: changeHeight(45) !important;
-          }
-
-          // 设置第一列单独样式
-          .el-table td:nth-child(2) {
-            font-size: changeHeight(50) !important;
-          }
-
-          // 设置第一列单独样式
-          .el-table td:nth-child(3) {
-            font-size: changeHeight(35) !important;
-          }
-
-          // 设置第一列单独样式
-          .el-table td:nth-child(4) {
-            color: #43fb55;
-            font-size: changeHeight(45) !important;
-          }
-
-          // 去除表格得所有边框
-          .el-table thead tr > th {
-            width: 90% !important;
-            background-color: rgba(0, 100, 156, 0.8) !important;
-            border: 0px 0px 10px #50ffff !important;
-            color: #fff;
-          }
-
-          // 更改表格每行背景颜色
-          .el-table tbody tr > td {
-            // background-color: rgb(26,28,119);
-            color: #fff;
-            border: transparent !important;
-          }
-
-          // 鼠标滑过每行的颜色
-          .el-table--enable-row-hover .el-table__body tr:hover > td {
-            background-color: rgba(145, 245, 255, 0.1) !important;
-          }
-
-          // 去除表格上边框
-          .el-table th.el-table__cell.is-leaf {
-            border: transparent !important;
-          }
-
-          //  去除表格下边框
-          .el-table::before,
-          .el-table--group::after,
-          .el-table--border::after {
-            background-color: unset !important;
-            border: transparent !important;
-          }
-
-          .el-table {
-            border: transparent !important;
-
-            background: linear-gradient(
-              180deg,
-              #01233c 0%,
-              rgba(8, 150, 255, 0.42) 100%
-            );
+          //  控制每行的高度
+          .cell {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: changeHeight(100);
+            line-height: changeHeight(40);
+            font-size: changeHeight(38);
+            // font-weight: 400;
           }
         }
+
+        // el-table出现小白线 伪类
+        .el-table__inner-wrapper:before {
+          height: 0;
+        }
+
+        // 设置第一列单独样式
+        .el-table td:nth-child(1) {
+          color: #6ffbf7;
+          font-size: changeHeight(45) !important;
+        }
+
+        // 设置第一列单独样式
+        .el-table td:nth-child(2) {
+          font-size: changeHeight(50) !important;
+        }
+
+        // 设置第一列单独样式
+        .el-table td:nth-child(3) {
+          font-size: changeHeight(35) !important;
+        }
+
+        // 设置第一列单独样式
+        .el-table td:nth-child(4) {
+          color: #43fb55;
+          font-size: changeHeight(45) !important;
+        }
+
+        // 去除表格得所有边框
+        .el-table thead tr > th {
+          width: 90% !important;
+          background-color: rgba(0, 100, 156, 0.8) !important;
+          border: 0px 0px 10px #50ffff !important;
+          color: #fff;
+        }
+
+        // 更改表格每行背景颜色
+        .el-table tbody tr > td {
+          // background-color: rgb(26,28,119);
+          color: #fff;
+          border: transparent !important;
+        }
+
+        // 鼠标滑过每行的颜色
+        .el-table--enable-row-hover .el-table__body tr:hover > td {
+          background-color: rgba(145, 245, 255, 0.1) !important;
+        }
+
+        // 去除表格上边框
+        .el-table th.el-table__cell.is-leaf {
+          border: transparent !important;
+        }
+
+        //  去除表格下边框
+        .el-table::before,
+        .el-table--group::after,
+        .el-table--border::after {
+          background-color: unset !important;
+          border: transparent !important;
+        }
+
+        .el-table {
+          border: transparent !important;
+
+          background: linear-gradient(180deg, #01233c 0%, rgba(8, 150, 255, 0.42) 100%);
+        }
       }
+    }
 
-      // 分页样式
-      :deep(.bottom) {
-        //
-        margin-right: changeHeight(27);
-        height: 8%;
-        display: flex;
-        justify-content: center;
+    // 分页样式
+    :deep(.bottom) {
+      //
+      margin-right: changeHeight(27);
+      height: 8%;
+      display: flex;
+      justify-content: center;
 
-        // align-items: flex-start;
-        // 分页
-        .el-pagination {
-          .el-pagination__total {
+      // align-items: flex-start;
+      // 分页
+      .el-pagination {
+        .el-pagination__total {
+          border: 1px solid #fff;
+          border-radius: changeHeight(4);
+          padding: changeHeight(5) changeHeight(10);
+          color: rgba(255, 255, 255, 0.6);
+        }
+
+        .btn-prev,
+        .btn-next,
+        .el-pager li {
+          background-color: transparent;
+          color: rgba(87, 223, 242, 0.6);
+          border: 1px solid #57dff2;
+          border-radius: changeHeight(4);
+          margin: 0 changeHeight(5);
+          font-size: changeHeight(30);
+          padding: changeHeight(25) changeHeight(23); //图标大小
+        }
+
+        .el-icon {
+          font-size: changeHeight(25); //》 《箭头大小
+        }
+
+        .el-pager {
+          .is-active {
+            color: #6ffbf7;
+          }
+        }
+
+        .el-pagination__sizes {
+          margin-left: changeHeight(15);
+
+          .el-input {
+            width: changeHeight(100);
             border: 1px solid #fff;
             border-radius: changeHeight(4);
-            padding: changeHeight(5) changeHeight(10);
-            color: rgba(255, 255, 255, 0.6);
-          }
 
-          .btn-prev,
-          .btn-next,
-          .el-pager li {
-            background-color: transparent;
-            color: rgba(87, 223, 242, 0.6);
-            border: 1px solid #57dff2;
+            .el-input__wrapper {
+              background-color: transparent;
+              box-shadow: none !important;
+
+              .el-input__inner {
+                color: rgba(255, 255, 255, 0.6);
+              }
+            }
+          }
+        }
+
+        .el-pagination__jump {
+          .el-input {
+            border: 1px solid #fff;
             border-radius: changeHeight(4);
-            margin: 0 changeHeight(5);
-            font-size: changeHeight(30);
-            padding: changeHeight(25) changeHeight(23); //图标大小
-          }
 
-          .el-icon {
-            font-size: changeHeight(25); //》 《箭头大小
-          }
+            .el-input__wrapper {
+              box-shadow: none;
+              background-color: transparent;
 
-          .el-pager {
-            .is-active {
-              color: #6ffbf7;
-            }
-          }
-
-          .el-pagination__sizes {
-            margin-left: changeHeight(15);
-
-            .el-input {
-              width: changeHeight(100);
-              border: 1px solid #fff;
-              border-radius: changeHeight(4);
-
-              .el-input__wrapper {
-                background-color: transparent;
-                box-shadow: none !important;
-
-                .el-input__inner {
-                  color: rgba(255, 255, 255, 0.6);
-                }
+              .el-input__inner {
+                color: rgba(255, 255, 255, 0.6);
               }
             }
           }
 
-          .el-pagination__jump {
-            .el-input {
-              border: 1px solid #fff;
-              border-radius: changeHeight(4);
-
-              .el-input__wrapper {
-                box-shadow: none;
-                background-color: transparent;
-
-                .el-input__inner {
-                  color: rgba(255, 255, 255, 0.6);
-                }
-              }
-            }
-
-            span {
-              color: rgba(255, 255, 255, 0.6);
-            }
+          span {
+            color: rgba(255, 255, 255, 0.6);
           }
         }
       }
     }
+  }
   .area_load {
     width: changeHeight(1156.86);
     height: changeHeight(620.62);
     box-sizing: border-box;
-    background: url("@/assets/images/osPage/area_load_bg.png") no-repeat;
+    background: url('@/assets/images/osPage/area_load_bg.png') no-repeat;
     background-size: 100% 100%;
     padding-top: 1%;
     padding-left: changeHeight(27);
@@ -2006,8 +1926,7 @@ const styleVar = computed(() => {
       .titlebg {
         width: changeHeight(842.04);
         height: changeHeight(57.23);
-        background: url("@/assets/images/osPage/run_detail_titlebg.png")
-          no-repeat;
+        background: url('@/assets/images/osPage/run_detail_titlebg.png') no-repeat;
         background-size: 100% 100%;
         display: flex;
         align-items: center;
@@ -2087,11 +2006,11 @@ const styleVar = computed(() => {
             width: changeHeight(100.8);
           }
           .bg1 {
-            background: url("@/assets/images/btnType/btnblue.png") no-repeat;
+            background: url('@/assets/images/btnType/btnblue.png') no-repeat;
             background-size: 100% 100%;
           }
           .bg2 {
-            background: url("@/assets/images/btnType/btngreen.png") no-repeat;
+            background: url('@/assets/images/btnType/btngreen.png') no-repeat;
             background-size: 100% 100%;
           }
           .beforeEchart {