图标曲线配置完成

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

@@ -62,13 +62,13 @@ const dataX = computed(() => {
   if (props.lineArray) {//代表x轴有多个
     let arrx = []
     props.data.forEach(it => {
-      arrx.push(it.length > 0 ? it.map(item => item.x.split(' ')[1].slice(0, 8)) : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'])
+      arrx.push(it.length > 0 ? it.map(item => item.x.split(' ')[1]?.slice(0, 8)) : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'])
     })
     // console.log(arrx, 'x轴信息');
     return arrx
     // return props.data.length > 0 ? props.data.map(item => item.x.split(' ')[1].slice(0, 8)) : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
   } else {
-    return props.data.length > 0 ? props.data.map(item => item.x.split(' ')[1].slice(0, 8)) : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
+    return props.data.length > 0 ? props.data.map(item => item.x.split(' ')[1]?.slice(0, 8)) : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
   }
 
 })
@@ -274,22 +274,23 @@ function initChart() {
         fontSize: 10,
         interval: 'auto', // 或直接不写
         hideOverlap: true, //  防重叠（很关键）
-        formatter: function (value, index) {
-          console.log(value, '判断依据', index);
+        formatter: function (value) {
+
+          const date = new Date(value);
+          console.log(value, '判断依据', `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()} ${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`);
 
           if (value.toString().includes(':')) {
             const date = new Date(value);
             const minutes = date.getMinutes();
             if (minutes === 0 || minutes === 30) {
-              console.log(value, '判断分钟');
+              // console.log(value, '判断分钟');
               return value
             }
           } else if (!isNaN(Number(value))) {
             const date = new Date(value);
             const minutes = date.getMinutes();
             if (minutes === 0 || minutes === 30) {
-              console.log(date, '判断分钟11', value);
-
+              // console.log(date, '判断分钟11', value);
               return timestampToHMS(value)
             }
           }
@@ -378,18 +379,12 @@ function initChart() {
   if (props.lineArray) {
     delete option.xAxis.data
   }
-  // console.log(option, '配置', myChart, '住新冠');
-  console.log(option, '数据配置');
-  // console.log(series1Data.value, '对象');
-  // if (timesset) {
-  //   clearTimeout(timesset)
-  // }
-  // timesset = setTimeout(() => {
+  // console.log(JSON.stringify(option), '数据配置');
+
   clearTimeout(timesset)
   myChart.setOption(option);
   resizeChart();
   window.addEventListener('resize', resizeChart);
-  // }, 1000);
 }
 //转换颜色函数
 function hexToRgba(hex, alpha) {

src/pages/header/component/screenConfigeDialog.vue

@@ -47,7 +47,7 @@
               <div class="selector-item">
                 <label class="selector-label">{{ keliSelector.label }}</label>
                 <div class="custom-select">
-                  <!-- 粒度 -->
+                  <!-- 地面粒度 -->
                   <el-select v-model="keliSelector.value" placeholder="" style="width: 100%;" @change="keliOnChange">
                     <el-option v-for="item in keliSelector.options" :key="item.value" :label="item.label"
                       :value="item.value" />
@@ -70,7 +70,7 @@
               <div class="selector-item">
                 <label class="selector-label">模板列表</label>
                 <div class="custom-select">
-                  <!-- 粒度 -->
+                  <!-- 模版列表下拉框 -->
                   <el-select v-model="templateSelector" placeholder="请选择模板列表" @change="templateOnChange"
                     style="width: 100%;">
                     <el-option v-for="item in templateSelectorOptions" :key="item.value" :label="item.label"
@@ -315,7 +315,16 @@ const handleAdd = () => {
 onMounted(async () => {
   await handleConfigData()
   await handleList();
-  await getPanelCurveData()
+  await getPanelCurveData(
+    {
+      granularity: keliSelector.value.value,//类型
+      // startTime: '2026-01-03 23:59:59',
+      // endTime: '2026-01-04 23:59:59',
+      regionName: keliSelector.value.value == 'region' ? childrenSelector.value.value : null,//区域名称
+      signalSiteCode: keliSelector.value.value == 'station' ? childrenSelector.value.value : null,//信关站编码
+      gridCodes: keliSelector.value.value == 'grid' ? childrenSelector.value.value : null,//格网编码
+    }
+  )
 
   // await handleConfigData()
   // await getCapacityAndTrafficData()
@@ -398,7 +407,7 @@ const getPanelCurveData = async (data) => {
   }
 }
 // 下拉框选中模版时自动回显对应模版信息接口
-const getPaneldetailApiFn = async () => {
+const getPaneldetailApiFn = async (data) => {
   const res = await getPaneldetailApi(data)
   if (res.code == 200) {
     console.log('所有曲线数据', res.data)
@@ -584,14 +593,27 @@ const handleList = async () => {
   }
 }
 
-const templateOnChange = (val) => {
+const templateOnChange = async (val) => {
   const selectedTemplate = templateCaseList.value.find(item => item.templateId === val)
   currentSettingConfig.value = selectedTemplate
+  console.log('切换模版', templateSelectorOptions);
+
   resetData() // 切换模板时重置数据，避免数据混乱
   // console.log('selectedTemplate', selectedTemplate)
   // availabilityCurveType
   // capacityCurveType
   // latencyCurveType
+  await getPaneldetailApiFn(
+    {
+      granularity: keliSelector.value.value,//类型
+      selectedTemplate: templateSelector.value,//模版编码
+      // startTime: '2026-01-03 23:59:59',
+      // endTime: '2026-01-04 23:59:59',
+      regionName: keliSelector.value.value == 'region' ? childrenSelector.value.value : null,//区域名称
+      signalSiteCode: keliSelector.value.value == 'station' ? childrenSelector.value.value : null,//信关站编码
+      gridCodes: keliSelector.value.value == 'grid' ? childrenSelector.value.value : null,//格网编码
+    }
+  )
   calculateConfig();
 
 }

src/utils/requestSocekt.js

@@ -53,13 +53,13 @@ import useAppStore from '@/store/module/app.js';
 
 const apiUrl = `ws://121.229.107.155:19021/TestTimeSend`;  //线上
 // const apiUrl = `ws://127.0.0.1:19021/TestTimeSend`; //本地
-let wss = null; 
+let wss = null;
 let timer = null;
 const appStore = useAppStore();
 
 function createWebSocket() {
   wss = new WebSocket(apiUrl);
-  
+
   wss.onopen = () => {
     console.log('WebSocket已连接');
   };
@@ -74,10 +74,10 @@ function createWebSocket() {
 
   wss.onclose = () => {
     console.log('连接关闭，1秒后重连...');
-    timer =  setTimeout(() => {
-     wss = createWebSocket(); // 重新创建连接
-     clearTimeout(timer);
-     timer = null; //释放内存
+    timer = setTimeout(() => {
+      wss = createWebSocket(); // 重新创建连接
+      clearTimeout(timer);
+      timer = null; //释放内存
     }, 1000);
   };
 }

src/utils/requestSocektTime.js

 import useAppStore from '@/store/module/app.js';
 
-// const apiUrl = `ws://121.229.107.155:19021/time`;  //线上
-const apiUrl = `ws://127.0.0.1:19021/time`;  //线上
+const apiUrl = `ws://121.229.107.155:19021/time`;  //线上
+// const apiUrl = `ws://127.0.0.1:19021/time`;  //本地
 let Timewss = null;
 let timer = null;
 const appStore = useAppStore();

src/utils/subSystemRequestSocket.js

@@ -9,8 +9,8 @@
 import ueHeartbeatInterval from '@/store/module/app.js'
 import useAppStore from '@/store/module/app.js'
 const useAppStoreInstance = useAppStore()
-// const apiUrl = `ws://121.229.107.155:19021/systemData`
-const apiUrl = `ws://127.0.0.1:19021/systemData`//本地地址
+const apiUrl = `ws://121.229.107.155:19021/systemData`
+// const apiUrl = `ws://127.0.0.1:19021/systemData`//本地地址
 
 const SubWss = new WebSocket(apiUrl);
 useAppStoreInstance.setSubsystemSocket(SubWss)