页面优化

src/pages/all/components/cdf/cdfCurve.vue

 <template>
-  <!-- PDF曲线图 -->
+  <!-- CDF曲线图 -->
   <div class="container">
     <div class="main">
       <div :id="idName" class="cdfCurve"></div>
@@ -57,7 +57,7 @@ const props = defineProps({
   },
   legendName: {
     type: String,
-    default: 'PDF曲线图'
+    default: 'CDF曲线图'
   },
   data: {
     type: Array,
@@ -315,7 +315,7 @@ function initChart() {
         symbol: 'none',
         lineStyle: {
           color: lineColor,
-          width: 5
+          width: 3
         },
         areaStyle: {
           color: {

src/pages/all/components/hotMapComponents/hotMap.vue

@@ -16,10 +16,11 @@ import * as echarts from 'echarts';
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 import worldJson from '@/assets/json/world.json';
 import chineseWorldName from '@/assets/json/chineseWorldName.json';
-import testJson from '@/assets/json/test.json'
-
-// let data = null
+import useAppStore from '@/store/module/app'
 
+const appStore = useAppStore && useAppStore()
+const maxValue = ref(0)
+let myChart = null;
 const props = defineProps({
     title: {
         type: String,
@@ -28,16 +29,47 @@ const props = defineProps({
     data: {
         type: Array,
         default: () => []
+    },
+    mapCenter: {
+        type: Array,
+        default: () => []
     }
 })
 
 watch(() => props.data, (newVal) => {
-    updateChart();
+    // // updateChart();
+    setTimeout(() => {
+
+        initChart();
+    }, 0)
+
+}, { deep: true, immediate: true })
+
+const obj = {
+    '中国': [104, 35],
+    '巴西': [-51.9253, -14.2350],
+    '马来西亚': [109.5, 3.5]
+}
+
+watch(() => appStore.currentHotMapCountry, (newVal, oldVal) => {
+    initChart()
+})
 
+watch(() => maxValue.value, (newVal) => {
+    if (myChart && newVal > 0) {
+        myChart.setOption({
+            visualMap: {
+                text: [newVal, 0],
+                range: [0, newVal],
+                min: 0,
+                max: newVal,
+            }
+        }, { notMerge: false, lazyUpdate: false })
+    }
 })
 
 const data = computed(() => {
-    const result = []
+    let result = []
     // console.log('y--props.data', props.data)
     props.data.forEach(el => {
         let y = el.y
@@ -48,10 +80,12 @@ const data = computed(() => {
         // console.log('y', y)
         y.forEach(y => {
 
-            const { longitude: item, value } = y
+            const { longitude: item, value, GridCode } = y
             if (item.vertex1Lat !== null) {
                 result.push({
                     name: item.gridName,
+                    code: GridCode,
+                    count: value,
                     value: [
                         item.vertex1Lon,
                         item.vertex1Lat,
@@ -72,35 +106,65 @@ const data = computed(() => {
             // console.log('item', item)
         })
     })
+    result = result.sort((pre, next) => pre.count - next.count)
+    maxValue.value = result[result.length - 1]?.count || 0
+    // console.log('maxValue', maxValue)
+    result = mergeData(result, appStore.gridInfoList)
+    // if (myChart) {
+
+    //     myChart.setOption({
+    //         visualMap: {
+    //             text: [maxValue, 0],
+    //             range: [0, maxValue],
+    //             min: 0,
+    //             max: maxValue,
+
+    //         },
+    //     }, {
+    //         notMerge: true   // 👈 关键
+    //     })
+    // }
+    // console.log('result', result)
     return result
+
 })
-// const transformData = () => {
-//     data = testJson.data.map((item) => ({
-//         name: item.gridName,
-//         value: [
-//             item.vertex1Lon,
-//             item.vertex1Lat,
-//             item.vertex2Lon,
-//             item.vertex2Lat,
-//             item.vertex3Lon,
-//             item.vertex3Lat,
-//             item.vertex4Lon,
-//             item.vertex4Lat,
-//             item.vertex5Lon,
-//             item.vertex5Lat,
-//             item.vertex6Lon,
-//             item.vertex6Lat,
-//             Math.random() * 100,
-//         ],
-//     }));
-//     console.log('data', data)
-// }
-
-// transformData()
+
+const mergeData = (data, baseData = []) => {
+    // if(data)
+    let _baseData = baseData.map(item => ({
+        name: item.gridName,
+        code: item.gridCode,
+        value: [
+            item.vertex1Lon,
+            item.vertex1Lat,
+            item.vertex2Lon,
+            item.vertex2Lat,
+            item.vertex3Lon,
+            item.vertex3Lat,
+            item.vertex4Lon,
+            item.vertex4Lat,
+            item.vertex5Lon,
+            item.vertex5Lat,
+            item.vertex6Lon,
+            item.vertex6Lat,
+            null
+        ],
+    }))
+
+    _baseData.forEach(item => {
+        data.forEach(el => {
+            if (item.code == el.code) {
+                item.value = el.value
+            }
+
+        })
+    })
+    return _baseData
+}
 
 // 生成唯一的图表ID
 const chartId = ref('hexagonHeatMap_' + Math.random().toString(36).substr(2, 9));
-let myChart = null;
+
 
 // 初始化图表
 function initChart() {
@@ -138,9 +202,12 @@ function initChart() {
             formatter: function (params) {
                 const val = params.value
                 const color = params.color
-
-                // console.log('params', params)
-                return `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color};"></span> ${params.name}  ${val[12]}`
+                // console.log('tooltip', val)
+                if (val[12] == null) {
+                    return `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color};"></span> ${params.name}`
+                } else {
+                    return `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color};"></span> ${params.name}  ${val[12]}`
+                }
             }
         },
 
@@ -158,7 +225,8 @@ function initChart() {
         geo: {
             map: "world",
             roam: true,
-            center: [104, 35], // 中国中心
+            center: obj[appStore.currentHotMapCountry] || [104, 35], // 中国中心
+            // center: [-51.9253, -14.2350], // 巴西
             zoom: 10, // 放大倍数
             // aspectScale: Math.cos((chRoughLatitude * Math.PI) / 180),
             // nameProperty: 'name_en', // If using en name.
@@ -180,7 +248,10 @@ function initChart() {
             nameMap: chineseWorldName
         },
         visualMap: {
-            text: ["100", "10"],
+            text: (() => {
+                // console.log('maxValue', maxValue.value)
+                return [maxValue.value, 0]
+            })(),
             textStyle: {
                 color: "#fff"
             },
@@ -189,9 +260,9 @@ function initChart() {
             itemHeight: 68,
             left: "center", // 水平居中
             bottom: 1, // 距离底部 20px
-            range: [1, 100],
-            min: 1,
-            max: 100,
+            range: [0, maxValue.value],
+            min: 0,
+            max: maxValue.value,
             orient: "horizontal",
             inRange: {
                 color: [
@@ -215,8 +286,7 @@ function initChart() {
                     focus: "self",
                 },
                 renderItem(params, api) {
-                    // console.log("params", api.value(0));
-                    if (!api.value(0) == null) {
+                    if (api.value(0) == null) {
                         return null
                     }
                     const point1 = api.coord([api.value(0), api.value(1)]);
@@ -228,6 +298,24 @@ function initChart() {
 
                     const hex = [point1, point2, point3, point4, point5, point6];
 
+                    const val = api.value(12)
+                    // console.log('val', val)
+
+                    if (val == null || isNaN(val)) {
+                        return {
+                            type: "polygon",
+                            shape: {
+                                points: hex,
+                            },
+                            style: {
+                                fill: 'rgba(255,255,255,.6)',   // 👈 不填充
+                                // stroke: '#00ffff',     // 👈 描边颜色
+                                lineWidth: 1           // 👈 描边宽度
+
+                            },
+                        }
+                    }
+
                     return {
                         type: "polygon",
                         shape: {
@@ -261,6 +349,8 @@ function updateChart() {
     });
 }
 
+
+
 // 响应式调整图表大小
 function resizeChart() {
     if (myChart) {
@@ -270,10 +360,10 @@ function resizeChart() {
 
 onMounted(async () => {
     // 确保DOM渲染完成后初始化图表
-    nextTick(() => {
-        initChart();
-        window.addEventListener('resize', resizeChart);
-    });
+    // nextTick(() => {
+    //     initChart();
+    //     window.addEventListener('resize', resizeChart);
+    // });
 });
 
 onUnmounted(() => {

src/pages/all/components/instant/instantCurve.vue

@@ -233,7 +233,7 @@ function initChart() {
         }
       }
     },
-    dataZoom: dataX.value.length <= 5 ? [] : [
+    dataZoom: dataX.value.length <= 7 ? [] : [
       // {
       //   type: 'slider',
       //   xAxisIndex: 0,
@@ -294,7 +294,7 @@ function initChart() {
         symbol: 'none',
         lineStyle: {
           color: lineColor,
-          width: 5
+          width: 3
         },
         areaStyle: {
           color: {

src/pages/all/components/loadingComponent/index.js

@@ -12,7 +12,7 @@ const Loading = (function() {
 
   function createLoading(options = {}) {
     const {
-      text = 'Loading...',
+      text = '正在加载中...',
       background = 'rgba(0, 0, 0, 0.57)',
       color = '#fff',
       zIndex = 9999999,

src/pages/all/index.vue

 <template>
   <div class="common-layout" :style="{ '--headerHeight': headerHeight, '--asideWidth': asideWidth }">
-    
+
     <!-- 悬浮控制窗口 -->
-    <div class="control-panel" id="control_panel1" v-if="useAppStoreInstance.iscontrolPanelShow">   
+    <div class="control-panel" id="control_panel1" v-if="useAppStoreInstance.iscontrolPanelShow">
       <div class="panel-content">
         <div class="controls-list">
           <div class="control-item" v-for="item in controls" :key="item.label">
-            <el-switch 
-              v-model="item.enabled" 
-              class="control-switch"
-              active-color="#165DFF"
-              inactive-color="#4E5969"
-              :disabled="item.disabled"
-              @change="handleSwitchChange(item)"
-            />
+            <el-switch v-model="item.enabled" class="control-switch" active-color="#165DFF" inactive-color="#4E5969"
+              :disabled="item.disabled" @change="handleSwitchChange(item)" />
             <span class="control-label">{{ item.label }}</span>
           </div>
         </div>
       </div>
     </div>
-    <div class="control-panel" style="top: 22.8%;" id="control_panel1" v-else="useAppStoreInstance.iscontrolPanelShow">   
+    <div class="control-panel" style="top: 22.8%;" id="control_panel1" v-else>
       <div class="panel-content">
         <div class="controls-list">
           <div class="control-item" v-for="item in subControls" :key="item.label">
-            <el-switch 
-              v-model="item.enabled" 
-              class="control-switch"
-              active-color="#165DFF"
-              inactive-color="#4E5969"
-              :disabled="item.disabled"
-              @change="handleSwitchChange(item)"
-            />
+            <el-switch v-model="item.enabled" class="control-switch" active-color="#165DFF" inactive-color="#4E5969"
+              @change="handleSwitchChange(item)" />
             <span class="control-label">{{ item.label }}</span>
           </div>
         </div>
@@ -49,12 +37,12 @@
       </div>
     </div> -->
     <el-container class="layout-container">
-      <el-container class="main-content-wrapper" >
+      <el-container class="main-content-wrapper">
         <!-- 左侧边栏 -->
         <el-aside class="fixed-aside left-aside" v-show="useAppStoreInstance.isdataPanelShow">
           <div class="aside-content">
             <keep-alive>
-              <router-view name="left"></router-view> 
+              <router-view name="left"></router-view>
             </keep-alive>
           </div>
         </el-aside>
@@ -63,14 +51,15 @@
         <el-main class="main-container">
           <!-- 底部Footer区域 -->
           <el-footer class="main-footer" id="all_footer">
-            <div class="footer-content footer-content-up" id="footer-content-up" v-show="useAppStoreInstance.isTimeLineShow">
+            <div class="footer-content footer-content-up" id="footer-content-up"
+              v-show="useAppStoreInstance.isTimeLineShow">
               <keep-alive>
-                <router-view name="foot_one"></router-view> 
+                <router-view name="foot_one"></router-view>
               </keep-alive>
             </div>
             <div class="footer-content footer-content-down" id="two_footer" v-show="useAppStoreInstance.islegendShow">
               <keep-alive>
-                <router-view name="foot_two"></router-view>    
+                <router-view name="foot_two"></router-view>
               </keep-alive>
             </div>
           </el-footer>
@@ -80,7 +69,7 @@
         <el-aside class="fixed-aside right-aside" v-if="useAppStoreInstance.isdataPanelShow">
           <div class="aside-content">
             <keep-alive>
-              <router-view name="right"></router-view> 
+              <router-view name="right"></router-view>
             </keep-alive>
           </div>
         </el-aside>
@@ -94,7 +83,7 @@
 <script setup>
 
 import { ref, onMounted, onUnmounted, watch, onActivated } from 'vue'
-import  useAppStore  from '@/store/module/app'
+import useAppStore from '@/store/module/app'
 
 
 const useAppStoreInstance = useAppStore();
@@ -119,8 +108,8 @@ const controls = ref([
 // let siteExpand2 = ref(false)
 
 const subControls = ref([
-  { label: '卫星展开一级', enabled: false, disabled: false },
-  { label: '卫星展开二级', enabled: false, disabled: false },
+  { label: '展开一级', enabled: false },
+  { label: '展开二级', enabled: false },
 ])
 
 const handleControlChange = (item, value) => {
@@ -139,10 +128,10 @@ const searchSatelliteRef = ref(null)
 
 
 const handleSwitchChange = (item) => {
-  
+
 
   //console.log("初始化调用11111",item.enabled,item);
-  
+
   switch (item.label) {
     case '时间轴':
       useAppStoreInstance.setisTimeLineShow(item.enabled)
@@ -150,7 +139,8 @@ const handleSwitchChange = (item) => {
         window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
           type: "TimeLineShow",
           status: item.enabled ? "open" : "close"
-      })));}
+        })));
+      }
       break;
     case '图例':
       useAppStoreInstance.setislegendShow(item.enabled)
@@ -159,7 +149,8 @@ const handleSwitchChange = (item) => {
         window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
           type: "LegendShow",
           status: item.enabled ? "open" : "close"
-      })));}
+        })));
+      }
       break;
     case '数据面板':
       useAppStoreInstance.setisdataPanelShow(item.enabled)
@@ -167,7 +158,8 @@ const handleSwitchChange = (item) => {
         window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
           type: "DataPanelShow",
           status: item.enabled ? "open" : "close"
-      })));}
+        })));
+      }
       break;
     case '卫星轨道':
       useAppStoreInstance.setissatelliteOrbitShow(item.enabled)
@@ -175,7 +167,8 @@ const handleSwitchChange = (item) => {
         window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
           type: "SatelliteOrbitShow",
           status: item.enabled ? "open" : "close"
-      })));}
+        })));
+      }
       break;
     case '卫星波束':
       useAppStoreInstance.setissatelliteBeamShow(item.enabled)
@@ -183,20 +176,36 @@ const handleSwitchChange = (item) => {
         window.ue5("callBackControlSwitchShowFn", String(JSON.stringify({
           type: "SatelliteBeamShow",
           status: item.enabled ? "open" : "close"
-      })));}
-      
+        })));
+      }
+
       break;
 
-    case '卫星展开一级':
-      console.log(11)
+    case '展开一级':
+      if (window.ue5) {
+        window.ue5("callBackControlExpendFn", String(JSON.stringify({
+          type: "SatelliteExpend1",
+          status: item.enabled ? "open" : "close"
+        })));
+      }
+      // console.log('item.enabled', item.enabled, String(JSON.stringify({
+      //   type: "SatelliteExpend1",
+      //   status: item.enabled ? "open" : "close"
+      // })))
       break;
 
-    case '卫星展开二级':
-      console.log(22)
+    case '展开二级':
+      if (window.ue5) {
+        window.ue5("callBackControlExpendFn", String(JSON.stringify({
+          type: "SatelliteExpend2",
+          status: item.enabled ? "open" : "close"
+        })));
+      }
+
       break;
     default:
-     
-       ElMessage({
+
+      ElMessage({
         type: 'error',
         message: `界面显示实例类型错误！`,
       })
@@ -205,39 +214,40 @@ const handleSwitchChange = (item) => {
 }
 
 
-watch(useAppStoreInstance, () => { 
+watch(useAppStoreInstance, () => {
 
   if (useAppStoreInstance.isTimeLineShow && !useAppStoreInstance.islegendShow && useAppStoreInstance.isdataPanelShow) {
     // document.getElementsByClassName('footer-content-up').style.position = 'absolute'
     // document.getElementById('all_footer').style.width = '100%'
-     document.getElementById('footer-content-up').style.bottom = '300px'
-  }
- if (useAppStoreInstance.isdataPanelShow) { 
-  // //console.log(window.innerWidth);
-  document.getElementById('footer-content-up').style.bottom = '0px'
-  document.getElementById('all_footer').style.width = `calc(100% - ${asideWidth.value} - ${asideWidth.value})`
-  // document.getElementById('all_footer').style.bottom = '10px'
-  if (document.getElementById('control_panel1')) {
-    document.getElementById('control_panel1').style.right = '335px'
+    // document.getElementById('footer-content-up').style.bottom = '300px'
   }
-  // document.getElementById('search_panel').style.left = '395px'
-  
-  document.getElementById('two_footer').style.bottom = '100px'
-  
-}else { 
-
-  document.getElementById('all_footer').style.position = 'absolute'
-  document.getElementById('all_footer').style.width = '100%'
-  // document.getElementById('all_footer').style.bottom = '10px'
-  // if (!useAppStoreInstance.islegendShow) {document.getElementById('all_footer').style.bottom = '20px'}
-  // document.getElementById('search_panel').style.left = '30px'
-  if (document.getElementById('control_panel1')) {
-  document.getElementById('control_panel1').style.right = '-30px'
+  if (useAppStoreInstance.isdataPanelShow) {
+    // //console.log(window.innerWidth);
+    document.getElementById('footer-content-up').style.bottom = '0px'
+    // document.getElementById('all_footer').style.width = `calc(100% - ${asideWidth.value} - ${asideWidth.value})`
+    // document.getElementById('all_footer').style.bottom = '10px'
+    if (document.getElementById('control_panel1')) {
+      // document.getElementById('control_panel1').style.right = '335px'
+      document.getElementById('control_panel1').style.right = '18%'
+    }
+    // document.getElementById('search_panel').style.left = '395px'
+
+    document.getElementById('two_footer').style.bottom = '100px'
+
+  } else {
+
+    document.getElementById('all_footer').style.position = 'absolute'
+    document.getElementById('all_footer').style.width = '100%'
+    // document.getElementById('all_footer').style.bottom = '10px'
+    // if (!useAppStoreInstance.islegendShow) {document.getElementById('all_footer').style.bottom = '20px'}
+    // document.getElementById('search_panel').style.left = '30px'
+    if (document.getElementById('control_panel1')) {
+      document.getElementById('control_panel1').style.right = '-30px'
+    }
+
   }
-  
-}
-  
-}, {deep: true,immediately: true})
+
+}, { deep: true, immediately: true })
 
 
 
@@ -250,41 +260,41 @@ const checkScreenSize = () => {
   controls.value.forEach(item => {
     if (item.label === '数据面板') {
       item.enabled = !isMobile.value,
-      item.disabled = isMobile.value
+        item.disabled = isMobile.value
     }
-    
+
   })
- 
+
 }
 const currSeriveSize = () => {
   const width = window.innerWidth;
   const height = window.innerHeight;
   //console.log("当前设备的尺寸:",width,height);
-  
+
 }
 
 onActivated(() => {
   controls.value = [
-  { label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
-  // { label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
-  { label: '数据面板', enabled: useAppStoreInstance.isdataPanelShow, disabled: false },
-  { label: '时间轴', enabled: useAppStoreInstance.isTimeLineShow, disabled: false },
-  { label: '图例', enabled: useAppStoreInstance.islegendShow, disabled: false }
-]
+    { label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
+    // { label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
+    { label: '数据面板', enabled: useAppStoreInstance.isdataPanelShow, disabled: false },
+    { label: '时间轴', enabled: useAppStoreInstance.isTimeLineShow, disabled: false },
+    { label: '图例', enabled: useAppStoreInstance.islegendShow, disabled: false }
+  ]
 
 });
 onMounted(() => {
   checkScreenSize();
-  handleSwitchChange({disabled: false,enabled: useAppStoreInstance.islegendShow,label: "图例"})
+  handleSwitchChange({ disabled: false, enabled: useAppStoreInstance.islegendShow, label: "图例" })
   window.addEventListener('resize', checkScreenSize);
   //  //console.log("111111111111114ononMounted",useAppStoreInstance.islegendShow,useAppStoreInstance.isTimeLineShow);
   controls.value = [
-  { label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
-  { label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
-  { label: '数据面板', enabled: useAppStoreInstance.isdataPanelShow, disabled: false },
-  { label: '时间轴', enabled: useAppStoreInstance.isTimeLineShow, disabled: false },
-  { label: '图例', enabled: useAppStoreInstance.islegendShow, disabled: false }
-]
+    { label: '卫星轨道', enabled: useAppStoreInstance.issatelliteOrbitShow, disabled: false },
+    { label: '卫星波束', enabled: useAppStoreInstance.issatelliteBeamShow, disabled: false },
+    { label: '数据面板', enabled: useAppStoreInstance.isdataPanelShow, disabled: false },
+    { label: '时间轴', enabled: useAppStoreInstance.isTimeLineShow, disabled: false },
+    { label: '图例', enabled: useAppStoreInstance.islegendShow, disabled: false }
+  ]
 });
 
 onUnmounted(() => {
@@ -323,7 +333,8 @@ onUnmounted(() => {
   overflow: hidden;
   transition: width var(--transition-time) ease;
   width: var(--control-panel-width);
-  background-color: #000; /* 添加黑色背景 */
+  background-color: #000;
+  /* 添加黑色背景 */
   /* border: 1px solid rgba(59, 130, 246, 0.3); 添加与control-panel一致的边框 */
   /* border-radius: 80px; */
 }
@@ -341,8 +352,8 @@ onUnmounted(() => {
 
 /* 修改 el-input 聚焦时的样式 */
 .search-panel .search-panel-wrapper :deep(.el-input__wrapper.is-focus) {
- 
-  box-shadow:inset  0 0 0 1px  rgba(0, 0, 0, 1) !important; 
+
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 1) !important;
 }
 
 /* .search-panel .search-panel-wrapper :deep(.el-input__wrapper:focus) {
@@ -379,7 +390,8 @@ onUnmounted(() => {
   display: flex;
   overflow: hidden;
   transition: width var(--transition-time) ease;
-  width: var(--control-panel-width);
+  /* width: var(--control-panel-width); */
+  width: fit-content;
   border: 1px solid rgba(59, 130, 246, 0.3);
 }
 
@@ -425,6 +437,7 @@ onUnmounted(() => {
 
 .layout-container {
   height: 100%;
+  width: 100%;
   display: flex;
   flex-direction: column;
 }
@@ -437,45 +450,55 @@ onUnmounted(() => {
 }
 
 .fixed-aside {
-  width: var(--asideWidth);
+  /* width: var(--asideWidth);  */
   background-color: var(--aside-bg-color);
   transition: all var(--transition-time) ease;
-  position: relative;
+  /* position: relative; */
   /* z-index: 1; */
   display: flex;
+  /* flex: 1; */
+  width: 20%;
   flex-direction: column;
+  min-width: 400px;
 }
 
 .fixed-aside .aside-content {
-  flex: 1;
+  /* flex: 1; */
   padding: 12px;
   overflow-y: auto;
+  /* background-color: red; */
   height: 100%;
 }
 
 .left-aside {
-  order: 1;
+  /* order: 1; */
   /* border-right: 1px solid var(--border-color); */
 }
 
 .right-aside {
-  order: 4;
+  /* order: 4; */
   /* border-left: 1px solid var(--border-color); */
 }
 
 .main-container {
-  flex: 1;
-  order: 2;
+  /* flex: 1; */
+  /* order: 2; */
   display: flex;
   flex-direction: column;
   padding: 0;
   overflow: hidden;
+  /* width: 100%; */
+  margin: 0 auto;
+  max-width: 1600px;
+  position: relative;
 }
-.el-footer{
+
+.el-footer {
   padding: 0;
 }
+
 .main-container .content-wrapper {
-  flex: 1;
+  /* flex: 1; */
   padding: 0px;
   overflow-y: auto;
   display: none;
@@ -486,12 +509,18 @@ onUnmounted(() => {
   color: #fff;
   display: flex;
   flex-direction: column;
-  min-width: 590px;
-  width: calc(100% - 800px);
+  /* min-width: 590px; */
+  width: 100%;
+  /* width: 1120px; */
+  /* max-width: 1600px; */
+  margin: 0 auto;
+  /* width: calc(100% - 800px); */
   gap: 10px;
   border-top: 1px solid var(--border-color);
   transition: all var(--transition-time) ease;
   position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
   bottom: 20px;
 
 }
@@ -500,13 +529,16 @@ onUnmounted(() => {
   min-height: 100px;
   border-bottom: 1px solid var(--border-color);
 }
-.footer-content-up{
+
+.footer-content-up {
   position: relative;
   /* bottom: 10px; */
 }
-.footer-content-down{
+
+.footer-content-down {
   /* height: 50px; */
 }
+
 .main-footer .footer-content:last-child {
   border-bottom: none;
   padding-bottom: 0;
@@ -539,41 +571,43 @@ onUnmounted(() => {
     border-radius: 0;
   }
 }
+
 /* max-width: 1540px */
 @media (max-width: 940px) {
   .common-layout {
     --control-panel-width: 160px;
   }
-  
+
   .fixed-aside {
     position: absolute;
     height: 100%;
     z-index: 100;
     transform: translateX(-100%);
   }
-  
+
   .control-panel {
     right: -60px;
+    /* right: -20%; */
     /* top: 30px; */
   }
-  
+
   .search-panel {
     left: 30px;
   }
-  
+
   .fixed-aside.left-aside {
     left: 0;
   }
-  
+
   .fixed-aside.right-aside {
     right: 0;
     transform: translateX(100%);
   }
-  
+
   .fixed-aside.active {
     transform: translateX(0);
   }
-  
+
   .main-footer {
     margin-left: 0;
     margin-right: 10px;

src/pages/header/component/screenConfigCase.vue

@@ -80,7 +80,7 @@ const settingConfig = ref([
           },
           {
             value: '2',
-            label: 'PDF曲线',
+            label: 'CDF曲线',
 
           },
           {
@@ -141,7 +141,7 @@ const settingConfig = ref([
         options: [
           {
             value: '2',
-            label: 'PDF曲线',
+            label: 'CDF曲线',
           },
           {
             value: '3',
@@ -205,7 +205,7 @@ const settingConfig = ref([
           },
           {
             value: '2',
-            label: 'PDF曲线',
+            label: 'CDF曲线',
           },
           {
             value: '3',
@@ -376,7 +376,7 @@ const titleFn = (el) => {
   const templateSelector = el.templateSelector
   const curveType = {
     '1': '瞬时值曲线',
-    '2': 'PDF曲线',
+    '2': 'CDF曲线',
     '3': '热力图'
   }
 

src/pages/header/component/screenConfigeDialog.vue

 <template>
 
-  <div class="dashboard-container" v-loading="loading" element-loading-text="加载中..."
-    element-loading-background="rgba(0, 0, 0, 0.4)">
+  <div class="dashboard-container">
     <!-- 顶部导航栏 -->
     <header class="dashboard-header">
       <div class="logo">
@@ -61,7 +60,8 @@
               <div class="selector-item" v-if="!isGlobal">
                 <label class="selector-label" style="visibility: hidden;">占位符</label>
                 <div class="custom-select">
-                  <el-select v-model="childrenSelector.value" placeholder="" style="width: 100%;" :disabled="isGlobal">
+                  <el-select v-model="childrenSelector.value" placeholder="" style="width: 100%;" :disabled="isGlobal"
+                    @change="childrenOnChange">
                     <el-option v-for="item in childrenSelector.options" :key="item.value" :label="item.label"
                       :value="item.value" />
                   </el-select>
@@ -152,10 +152,11 @@ import hotMapComponent from '@/pages/all/components/hotMapComponents/index.vue';
 import cdf from '@/pages/all/components/cdf/index.vue';
 import instant from '@/pages/all/components/instant/index.vue';
 import screenConfigCase from './screenConfigCase.vue';
+import Loading from '@/pages/all/components/loadingComponent/index.js'
 import {
   getAvailability, getTemplateList, templateAdd, templateDel,
   templateDetail, templateuUpdate, templateConfigAdd, templateConfigQuery, getCapacity, getTraffic,
-  getDelay, getLossRate, getPanelCurve
+  getDelay, getLossRate, getPanelCurve, getGridInfoList
 } from '@/api/Zodiac';
 import useAppStore from '@/store/module/app'
 import { ElMessage, ElMessageBox } from 'element-plus'
@@ -163,7 +164,7 @@ import { component } from 'vxe-pc-ui';
 
 
 let currentComponent1 = ref(markRaw(hotMapComponent))   //容量流量  热力图
-let currentComponent2 = ref(markRaw(cdf))  //可用性 PDF曲线  
+let currentComponent2 = ref(markRaw(cdf))  //可用性 CDF曲线  
 let currentComponent3 = ref(markRaw(instant))  //let  瞬时值曲线组件   //前面那个人写的好乱更屎一样，我服了，在这里偷偷吐槽一下嘿嘿
 
 let capacityData = ref([])
@@ -185,8 +186,6 @@ const screenConfigCaseRef = ref()
 const currentSettingConfig = ref()
 const templateCaseList = ref([])
 
-const loading = ref(true)
-
 
 const appStore = useAppStore();
 
@@ -198,6 +197,7 @@ watch(activeTab, (newVal) => {
   templateSelector.value = '' // 切换标签页时重置模板选择
 });
 const titles = ref(['', '', '']);
+let currentHotMapCountry = null
 
 const keliSelector = ref(
   {
@@ -315,14 +315,6 @@ const toggleDropdown = (index) => {
   dropdownVisible.value = dropdownVisible.value.map((val, i) => i === index ? !val : false);
 };
 
-const transformHotMapData = (data) => {
-  return data.map(item => ({
-    name: item.name,
-    x_value: item.x,
-    y_value: item.y
-  }))
-}
-
 // 容量
 const getCapacityData = async (data) => {
   const obj = {
@@ -415,7 +407,9 @@ const keliOnChange = () => {
   childrenSelector.value.value = ''
   switch (keliSelector.value.value) {
     case 'region':
-      childrenSelector.value.options = appStore.regionPanelData
+      console.log('appStore.regionPanelData', appStore.regionPanelData)
+      childrenSelector.value.options = appStore.regionPanelData;
+
       break;
     case 'grid':
       childrenSelector.value.options = appStore.gridPanelData
@@ -424,12 +418,22 @@ const keliOnChange = () => {
       childrenSelector.value.options = appStore.signalSitePanelData
       break;
   }
+  console.log('childrenSelector.value', childrenSelector.value)
 }
+
+const childrenOnChange = (item) => {
+  // console.log(item)
+  if (keliSelector.value.value == 'region') {
+    currentHotMapCountry = item
+  }
+
+}
+
 watch(() => keliSelector.value.value, keliOnChange)
 
 const handleApply = async () => {
   let ret = null
-  loading.value = true
+  Loading.show()
   if (currentSettingConfig.value.templateAdd) { // 如果是新增的模板，先调用新增接口，再调用修改接口
     ret = await templateAdd({
       // templateName: currentSettingConfig.value.templateName, // 模板名
@@ -444,7 +448,7 @@ const handleApply = async () => {
 
   if (ret.code == 200) {
     await handleList() // 刷新列表获取最新数据
-    loading.value = false
+    Loading.hide();
     ElMessage({
       message: '模板设置成功',
       type: 'success',
@@ -461,7 +465,7 @@ const handleConfigApplay = async () => {
     })
     return
   }
-  loading.value = true
+  Loading.show()
   const ret = await templateConfigAdd({
     granularity: keliSelector.value.value,
     granularityValue: childrenSelector.value.value,
@@ -478,7 +482,7 @@ const handleConfigApplay = async () => {
 
     }
     await getPanelCurveData(data);
-    loading.value = false
+    Loading.hide()
     appStore.chartConfig = {
       _capacityData: capacityData.value,
       _trafficData: trafficData.value,
@@ -490,6 +494,7 @@ const handleConfigApplay = async () => {
       component3: currentComponent3.value,
       _titles: titles.value
     }
+    appStore.currentHotMapCountry = currentHotMapCountry
     // console.log('appStore.chartConfig 传递的时候', appStore.chartConfig)
 
     // Promise.all([
@@ -517,7 +522,7 @@ const handleConfigApplay = async () => {
 
 const handleConfigData = async () => {
   const ret = await templateConfigQuery()
-  if (ret.code == 200 && ret.data.templateConfigResponse !== null) {
+  if (ret.code == 200 && ret.data !== null && ret.data?.templateConfigResponse !== null) {
     keliSelector.value.value = ret.data.granularity
     setTimeout(() => {
       childrenSelector.value.value = ret.data.granularityValue
@@ -547,7 +552,7 @@ const handleList = async () => {
   if (ret.code == 200) {
     templateCaseList.value = ret.data;
     currentSettingConfig.value = ret.data[activeTemplateIndex.value]
-    loading.value = false
+    Loading.hide()
   }
 }
 
@@ -576,7 +581,7 @@ const calculateConfig = (selectedTemplate = currentSettingConfig.value) => {
 
   const curveType = {
     '1': '瞬时值曲线',
-    '2': 'PDF曲线',
+    '2': 'CDF曲线',
     '3': '热力图'
   }
 
@@ -591,10 +596,14 @@ const calculateConfig = (selectedTemplate = currentSettingConfig.value) => {
   titles.value[1] = curveType[selectedTemplate.availabilityCurveType] + '-' + geoTimeStandard[selectedTemplate.availabilityGeoStandard] + '-' + geoTimeStandard[selectedTemplate.availabilityTimeStandard]
   titles.value[2] = curveType[selectedTemplate.latencyCurveType] + '-' + geoTimeStandard[selectedTemplate.latencyGeoStandard] + '-' + geoTimeStandard[selectedTemplate.latencyTimeStandard]
 
-
 }
 
-const initChartData = () => {
+const getGridInfoListData = async () => {
+  const ret = await getGridInfoList()
+  if (ret.code == 200) {
+    appStore.gridInfoList = ret.data
+  }
+
 
 }
 
@@ -729,7 +738,7 @@ const initChartData = () => {
 .dashboard-main {
   flex: 1;
   padding: 1rem;
-  overflow-y: auto;
+  overflow-y: hidden;
 }
 
 /* 标签页样式 */

src/pages/header/index.vue

@@ -59,7 +59,7 @@
 
     <el-dialog v-model="screenConfigeDialogVisible" :destroy-on-close="false" :modal="false" width="100"
       :show-close="false" :before-close="handleScreenConfigeClose"
-      style=" background-color: rgba(0, 0, 0,0);padding: 0;margin: 0;">
+      style="background-color: rgba(0, 0, 0,0);padding: 0;margin: 0;z-index: 999;">
       <screenConfige @handleScreenConfigeClose="handleScreenConfigeClose"></screenConfige>
       <!-- <div style="width: 100px;height: 100px;background-color: blueviolet;"></div> -->
     </el-dialog>
@@ -94,7 +94,7 @@ import local from '@/utils/local.js'
 import screenConfige from './component/screenConfigeDialog.vue'
 import { useRouter } from 'vue-router';
 import useAppStore from '@/store/module/app'
-import { getRegionPanel, getSignalSitePanel, getGridPanel } from "@/api/Zodiac";
+import { getRegionPanel, getSignalSitePanel, getGridPanel, getGridInfoList } from "@/api/Zodiac";
 
 
 import errorDialog from '@/pages/lefts/component/errorDialog.vue'
@@ -149,6 +149,7 @@ const formatDateTime = () => {
 const handleImageError = (e) => {
   imageError.value = true;
   e.target.style.display = 'none';
+  // console.log('穿透')
 };
 
 
@@ -214,10 +215,18 @@ onBeforeMount(() => {
   }, 1000);
 });
 
+const getGridInfoListData = async () => {
+  const ret = await getGridInfoList()
+  if (ret.code == 200) {
+    useAppStoreInstance.gridInfoList = ret.data
+  }
+}
+
 
 onMounted(async () => {
   // window.addEventListener('message', handleUEMessage);
   // window.addEventListener('emitUIInteraction', handleUEMessage1);
+  await getGridInfoListData()
   window.ue.interface.emitUIInteraction = (res) => {
     //    if (window.ue5) {
     //     window.ue5("callBackTimeFn", `ue传递给vue的数据111111111111111111:${JSON.stringify(res)},${JSON.stringify(res.locationReplace)}`)
@@ -276,7 +285,7 @@ onMounted(async () => {
 
 
 
- await initChartData();
+  await initChartData();
 
 
 
@@ -320,12 +329,12 @@ const stopDrag = () => {
 };
 
 
-const initChartData = async () => { 
-// console.log("初始化数据",useAppStoreInstance);
-  const [res1,res2,res3] = await Promise.all([getRegionPanel(), getSignalSitePanel(), getGridPanel()])
-  useAppStoreInstance.regionPanelData =  res1.code==200?res1.data.map(item=>({value:item,label:item})):[]
-  useAppStoreInstance.signalSitePanelData =  res2.code==200?res2.data.map((item)=>({value:item.siteId,label:item.siteName})):[]
-  useAppStoreInstance.gridPanelData = res3.code==200?res3.data.map(item=>({value:item.gridCode,label:item.gridName})):[]
+const initChartData = async () => {
+  // console.log("初始化数据",useAppStoreInstance);
+  const [res1, res2, res3] = await Promise.all([getRegionPanel(), getSignalSitePanel(), getGridPanel()])
+  useAppStoreInstance.regionPanelData = res1.code == 200 ? res1.data.map(item => ({ value: item, label: item })) : []
+  useAppStoreInstance.signalSitePanelData = res2.code == 200 ? res2.data.map((item) => ({ value: item.siteId, label: item.siteName })) : []
+  useAppStoreInstance.gridPanelData = res3.code == 200 ? res3.data.map(item => ({ value: item.gridCode, label: item.gridName })) : []
 };
 
 

src/pages/rights/index.vue

 <template>
-  <div class="constellation-panel" v-loading="loading">
+  <div class="constellation-panel">
     <!-- 顶部区域：标题与核心指标 -->
     <div class="header-container">
       <!-- <allHotMap></allHotMap> -->
-      <component :is="component1" :key="component1" :data="[capacityData, trafficData]" zoomHeight="2"
-        :title="titles[0]" slogan="容量/流量" :legendName="['链路层容量', '用户实际流量']"></component>
+      <component :is="component1" :data="[capacityData, trafficData]" zoomHeight="2" :title="titles[0]" slogan="容量/流量"
+        :legendName="['链路层容量', '用户实际流量']"></component>
     </div>
     <!-- 卫星列表 -->
     <div class="satellite-section">
       <!-- <cdf></cdf> -->
-      <component :is="component2" :key="component2" :data="[availabilityData]" zoomHeight="14" :title="titles[1]"
-        slogan="可用性" :legendName="['规划可用性', '实际可用性']"></component>
+      <component :is="component2" :data="[availabilityData]" zoomHeight="14" :title="titles[1]" slogan="可用性"
+        :legendName="['规划可用性', '实际可用性']"></component>
 
     </div>
 
     <!-- 地面系统 -->
     <div class="ground-system-section">
       <!-- <instant></instant> -->
-      <component :is="component3" :key="component3" :data="[delayData, lossRateData]" zoomHeight="14" :title="titles[2]"
-        slogan="网络时延/丢包" :legendName="['搜星时延', '丢包率']"></component>
+      <component :is="component3" :data="[delayData, lossRateData]" zoomHeight="14" :title="titles[2]" slogan="网络时延/丢包"
+        :legendName="['搜星时延', '丢包率']"></component>
     </div>
   </div>
 </template>
@@ -31,6 +31,7 @@ import cdf from '@/pages/all/components/cdf/index.vue'
 import instant from '@/pages/all/components/instant/index.vue'
 import useAppStore from '@/store/module/app'
 import { getPanelCurve, templateConfigQuery } from '@/api/Zodiac'
+import Loading from '@/pages/all/components/loadingComponent/index.js'
 
 
 const component1 = ref(markRaw(allHotMap))
@@ -45,7 +46,7 @@ let availabilityData = ref([])
 const titles = ref(['', '', '']);
 
 const appStore = useAppStore();
-const loading = ref(false)
+// const loading = ref(false)
 
 let granularity = null
 let granularityValue = null
@@ -91,19 +92,22 @@ const getPanelCurveData = async (data) => {
 
 const hanleTemplateConfigQuery = async () => {
   const ret = await templateConfigQuery()
-  if (ret.code == 200 && ret.data.templateConfigResponse !== null) {
+  if (ret.code == 200 && ret.data !== null && ret.data.templateConfigResponse !== null) {
     granularity = ret.data.granularity
     granularityValue = ret.data.granularityValue
     calculateConfig(ret.data.templateConfigResponse)
+    if (granularity == "region") {
+      appStore.currentHotMapCountry = granularityValue
+    }
   }
-  console.log('templateConfigQuery', ret)
 }
 
 
 onMounted(async () => {
+  Loading.show()
   await hanleTemplateConfigQuery()
   await getPanelCurveData()
-  loading.value = false
+  Loading.hide()
 })
 
 const calculateConfig = (selectedTemplate) => {
@@ -117,9 +121,13 @@ const calculateConfig = (selectedTemplate) => {
   component2.value = obj[selectedTemplate.availabilityCurveType]
   component3.value = obj[selectedTemplate.latencyCurveType]
 
+  console.log('component1', component1.value)
+  console.log('component2', component2.value)
+  console.log('component3', component3.value)
+
   const curveType = {
     '1': '瞬时值曲线',
-    '2': 'PDF曲线',
+    '2': 'CDF曲线',
     '3': '热力图'
   }
 
@@ -134,6 +142,7 @@ const calculateConfig = (selectedTemplate) => {
   titles.value[1] = curveType[selectedTemplate.availabilityCurveType] + '-' + geoTimeStandard[selectedTemplate.availabilityGeoStandard] + '-' + geoTimeStandard[selectedTemplate.availabilityTimeStandard]
   titles.value[2] = curveType[selectedTemplate.latencyCurveType] + '-' + geoTimeStandard[selectedTemplate.latencyGeoStandard] + '-' + geoTimeStandard[selectedTemplate.latencyTimeStandard]
 
+
 }
 
 // 激活的标签页

src/store/module/app.js

@@ -6,156 +6,159 @@
  * @FilePath: \yuanxinPro\src\store\module\app.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
-import Cookies from 'js-cookie'
-import { ElMessage } from 'element-plus';
-import { tr } from 'element-plus/es/locales.mjs';
+import Cookies from "js-cookie";
+import { ElMessage } from "element-plus";
+import { tr } from "element-plus/es/locales.mjs";
 
-const useAppStore = defineStore(
-  'app',
-  {
-    state: () => ({
-      // 记录时间轴走的时间
-      globalTimeLineEndSelectTime: "2025-11-02 00:00:00",
-      globalTimeLineStartTime: "2025-11-02 00:00:00",
-      globalTimeLineEndTime: "2025-11-02 00:00:00",
-      globalisFromTosub: false,
-      footerTimeHasedSelectTimeToSub: false,
-      globalSubsystemSelectedTimeRange: ['Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) ','Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) '],
+const useAppStore = defineStore("app", {
+  state: () => ({
+    // 记录时间轴走的时间
+    globalTimeLineEndSelectTime: "2025-11-02 00:00:00",
+    globalTimeLineStartTime: "2025-11-02 00:00:00",
+    globalTimeLineEndTime: "2025-11-02 00:00:00",
+    globalisFromTosub: false,
+    footerTimeHasedSelectTimeToSub: false,
+    globalSubsystemSelectedTimeRange: [
+      "Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) ",
+      "Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) ",
+    ],
 
-      globalLeftWssCONTINE: false,
-      
-      globalRecordMainSysTaskCode: 0,
+    globalLeftWssCONTINE: false,
 
+    globalRecordMainSysTaskCode: 0,
 
+    subSystemTimeLineEndSelectTime: "-",
+    subsystemSocket: null,
+    subsystemSocketContent: "",
+    HeartbeatInterval: null,
+    isTimeLineShow: true,
+    islegendShow: true,
+    isSourceLegendShow: true,
+    isdataPanelShow: true,
+    issatelliteOrbitShow: true,
+    issatelliteBeamShow: true,
+    iscontrolPanelShow: true,
 
-      subSystemTimeLineEndSelectTime: "-",
-      subsystemSocket: null,
-      subsystemSocketContent: '',
-      HeartbeatInterval: null,
-      isTimeLineShow: true,
-      islegendShow: true,
-      isSourceLegendShow: true,
-      isdataPanelShow: true,
-      issatelliteOrbitShow: true,
-      issatelliteBeamShow: true,
-      iscontrolPanelShow: true,
+    globaleAutoPlay: true,
+    globalIntervalTime: 3000,
+    globalStartWss: false,
+    globalSatelliteSearchID: "4097",
+    globalSubsystemActiveIndex: "0",
+    globalSubsystemIsFastForward: false,
+    globalSubsystemSpeed: 1,
+    globalSubsystemTaskCode: 0,
+    globalSubsystemSelectedStartTime: [
+      "Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) ",
+      "Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) ",
+    ],
+    globalSubsystemSelectedEndTime: "2025-11-04 00:00:00", //暂未使用
+    globalDisableTimeLine: true,
 
-      globaleAutoPlay: true,
-      globalIntervalTime: 3000,
-      globalStartWss: false,
-      globalSatelliteSearchID: "4097",
-      globalSubsystemActiveIndex: "0",
-      globalSubsystemIsFastForward: false,
-      globalSubsystemSpeed: 1,
-      globalSubsystemTaskCode: 0,
-      globalSubsystemSelectedStartTime: ['Sun Nov 02 2025 00:00:00 GMT+0800 (中国标准时间) ','Tue Nov 04 2025 00:00:00 GMT+0800 (中国标准时间) '],
-      globalSubsystemSelectedEndTime: '2025-11-04 00:00:00',//暂未使用
-      globalDisableTimeLine: true,
+    gridPanelData: [], //格网面板
+    regionPanelData: [], //区域面板
+    signalSitePanelData: [], //信关站面板
 
-      gridPanelData:[], //格网面板
-      regionPanelData:[], //区域面板
-      signalSitePanelData:[], //信关站面板
+    chartConfig: {}, //图表配置项,
 
-   
-    }),
-    actions: {
-      setGlobalRecordMainSysTaskCode(status) {
-        this.globalRecordMainSysTaskCode = status
-      },
-      setGlobalLeftWssCONTINE(status) {
-        this.globalLeftWssCONTINE = status
-      },
-      setSubSystemTimeLineEndSelectTime(status) {
-        this.subSystemTimeLineEndSelectTime = status
-      },
-      setFooterTimeHasedSelectTimeToSub(status) {
-        this.footerTimeHasedSelectTimeToSub = status
-      },
-      setGlobalSubsystemSelectedTimeRange(range) {
-        this.globalSubsystemSelectedTimeRange = range;
-      },
-      setGlobalisFromTosub(status) {
-        this.globalisFromTosub = status
-      },
-      setGlobalTimeLineEndSelectTime(time) {
-        this.globalTimeLineEndSelectTime = time;
-      },
-      setGlobalTimeLineStartTime(time) {
-        this.globalTimeLineStartTime = time;
-      },
-      setGlobalTimeLineEndTime(time) {
-        this.globalTimeLineEndTime = time;
-      },
-      setSubsystemSocket(socket) {
-        this.subsystemSocket = socket;
-      },
-      setSubsystemSocketContent(content) {
-        this.subsystemSocketContent = content;
-      },
-      setHeartbeatInterval(interval) {
-        this.HeartbeatInterval = interval;
-      },
-      setisTimeLineShow(status) {
-         this.isTimeLineShow = status
-      },
-      setislegendShow(status) {
-         this.islegendShow = status
-         
-      },
-      setisSourceLegendShow(status) {
-         this.isSourceLegendShow = status
-      },
-      setisdataPanelShow(status) {
-         this.isdataPanelShow = status
-      },
-      setissatelliteOrbitShow(status) {
-         this.issatelliteOrbitShow = status
-      },
+    currentHotMapCountry: null,
+  }),
+  actions: {
+    setGlobalRecordMainSysTaskCode(status) {
+      this.globalRecordMainSysTaskCode = status;
+    },
+    setGlobalLeftWssCONTINE(status) {
+      this.globalLeftWssCONTINE = status;
+    },
+    setSubSystemTimeLineEndSelectTime(status) {
+      this.subSystemTimeLineEndSelectTime = status;
+    },
+    setFooterTimeHasedSelectTimeToSub(status) {
+      this.footerTimeHasedSelectTimeToSub = status;
+    },
+    setGlobalSubsystemSelectedTimeRange(range) {
+      this.globalSubsystemSelectedTimeRange = range;
+    },
+    setGlobalisFromTosub(status) {
+      this.globalisFromTosub = status;
+    },
+    setGlobalTimeLineEndSelectTime(time) {
+      this.globalTimeLineEndSelectTime = time;
+    },
+    setGlobalTimeLineStartTime(time) {
+      this.globalTimeLineStartTime = time;
+    },
+    setGlobalTimeLineEndTime(time) {
+      this.globalTimeLineEndTime = time;
+    },
+    setSubsystemSocket(socket) {
+      this.subsystemSocket = socket;
+    },
+    setSubsystemSocketContent(content) {
+      this.subsystemSocketContent = content;
+    },
+    setHeartbeatInterval(interval) {
+      this.HeartbeatInterval = interval;
+    },
+    setisTimeLineShow(status) {
+      this.isTimeLineShow = status;
+    },
+    setislegendShow(status) {
+      this.islegendShow = status;
+    },
+    setisSourceLegendShow(status) {
+      this.isSourceLegendShow = status;
+    },
+    setisdataPanelShow(status) {
+      this.isdataPanelShow = status;
+    },
+    setissatelliteOrbitShow(status) {
+      this.issatelliteOrbitShow = status;
+    },
 
-      setissatelliteBeamShow(status) {
-         this.issatelliteBeamShow = status
-      },
-       setiscontrolPanelShow(status) {
-         this.iscontrolPanelShow = status
-      },
-      setglobaleAutoPlay(status) {
-         this.globaleAutoPlay = status
-      },
-      setglobalIntervalTime(status) {
+    setissatelliteBeamShow(status) {
+      this.issatelliteBeamShow = status;
+    },
+    setiscontrolPanelShow(status) {
+      this.iscontrolPanelShow = status;
+    },
+    setglobaleAutoPlay(status) {
+      this.globaleAutoPlay = status;
+    },
+    setglobalIntervalTime(status) {
       //   //console.log("开始执行间隔时间");
-        
-         this.globalIntervalTime = status
-      },
-      setglobalStartWss(status) {
-         // //console.log("同步socket数据");
-         
-         this.globalStartWss = status
-      },
-      setglobalSatelliteSearchID(status) {
+
+      this.globalIntervalTime = status;
+    },
+    setglobalStartWss(status) {
+      // //console.log("同步socket数据");
+
+      this.globalStartWss = status;
+    },
+    setglobalSatelliteSearchID(status) {
       //   //console.log("设置卫星搜索ID");
-        
-         this.globalSatelliteSearchID = status
-      },
-      setglobalSubsystemActiveIndex(status) {
-        this.globalSubsystemActiveIndex = status
-      },
-      setglobalSubsystemIsFastForward(status) {
-        this.globalSubsystemIsFastForward = status
-      },
-      setglobalSubsystemSpeed(status) {
-        this.globalSubsystemSpeed = status
-      },
-      setglobalSubsystemTaskCode(status) {
-        this.globalSubsystemTaskCode = status
-      },
 
-      setglobalSubsystemSelectedStartTime(status) {
-        this.globalSubsystemSelectedStartTime = status
-      },
-      setglobalSubsystemSelectedEndTime(status) {
-        this.globalSubsystemSelectedEndTime = status
-      },
-    }
-  })
+      this.globalSatelliteSearchID = status;
+    },
+    setglobalSubsystemActiveIndex(status) {
+      this.globalSubsystemActiveIndex = status;
+    },
+    setglobalSubsystemIsFastForward(status) {
+      this.globalSubsystemIsFastForward = status;
+    },
+    setglobalSubsystemSpeed(status) {
+      this.globalSubsystemSpeed = status;
+    },
+    setglobalSubsystemTaskCode(status) {
+      this.globalSubsystemTaskCode = status;
+    },
+
+    setglobalSubsystemSelectedStartTime(status) {
+      this.globalSubsystemSelectedStartTime = status;
+    },
+    setglobalSubsystemSelectedEndTime(status) {
+      this.globalSubsystemSelectedEndTime = status;
+    },
+  },
+});
 
-export default useAppStore
+export default useAppStore;