fix: 指标页面数据获取异常接口调整

2025-07-18 21:24:58 +08:00
parent a76c595c4c
commit a19427e953
7 changed files with 102 additions and 103 deletions
--- a/src/views/dashboard/overview2/components/NeResources/index.vue
+++ b/src/views/dashboard/overview2/components/NeResources/index.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onMounted, ref, nextTick, watch } from 'vue';
 import * as echarts from 'echarts/core';
-import { GridComponent, GridComponentOption, TooltipComponent } from 'echarts/components';
+import { GridComponent, TooltipComponent } from 'echarts/components';
 import { CanvasRenderer } from 'echarts/renderers';
 import { graphNodeClickID, graphNodeState } from '../../hooks/useTopology';
 import useI18n from '@/hooks/useI18n';
@@ -13,8 +13,6 @@ const { t } = useI18n();

 echarts.use([GridComponent, TooltipComponent, CanvasRenderer]);

-type EChartsOption = echarts.ComposeOption<GridComponentOption>;
-
 /**图DOM节点实例对象 */
 const neResourcesDom = ref<HTMLElement | undefined>(undefined);

@@ -29,7 +27,7 @@ const resourceData = ref({
  neCpu: 1,
  sysCpu: 1,
  sysMem: 1,
-  sysDisk: 1
+  sysDisk: 1,
 });

 // 获取颜色
@@ -47,14 +45,14 @@ function getColorByValue(value: number) {
 const optionData: any = {
  tooltip: {
    trigger: 'item',
-    formatter: '{b}: {c}%'
+    formatter: '{b}: {c}%',
  },
  grid: {
    top: '10%',
    bottom: '5%',
    left: '5%',
    right: '5%',
-    containLabel: true
+    containLabel: true,
  },
  series: [
    {
@@ -65,27 +63,29 @@ const optionData: any = {
      name: t('views.dashboard.overview.resources.neCpu'),
      color: getColorByValue(resourceData.value.neCpu),
      backgroundStyle: {
-        color: 'rgba(10, 60, 160, 0.1)'
+        color: 'rgba(10, 60, 160, 0.1)',
      },
      label: {
        normal: {
          formatter: () => {
-            return `${t('views.dashboard.overview.resources.neCpu')}\n${resourceData.value.neCpu}%`;
+            return `${t('views.dashboard.overview.resources.neCpu')}\n${
+              resourceData.value.neCpu
+            }%`;
          },
          textStyle: {
            fontSize: 12,
-            color: '#fff'
-          }
-        }
+            color: '#fff',
+          },
+        },
      },
      outline: {
        show: true,
        borderDistance: 2,
        itemStyle: {
          borderColor: '#0a3ca0',
-          borderWidth: 1
-        }
-      }
+          borderWidth: 1,
+        },
+      },
    },
    {
      type: 'liquidFill',
@@ -95,27 +95,29 @@ const optionData: any = {
      name: t('views.dashboard.overview.resources.sysCpu'),
      color: getColorByValue(resourceData.value.sysCpu),
      backgroundStyle: {
-        color: 'rgba(10, 60, 160, 0.1)'
+        color: 'rgba(10, 60, 160, 0.1)',
      },
      label: {
        normal: {
          formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysCpu')}\n${resourceData.value.sysCpu}%`;
+            return `${t('views.dashboard.overview.resources.sysCpu')}\n${
+              resourceData.value.sysCpu
+            }%`;
          },
          textStyle: {
            fontSize: 12,
-            color: '#fff'
-          }
-        }
+            color: '#fff',
+          },
+        },
      },
      outline: {
        show: true,
        borderDistance: 2,
        itemStyle: {
          borderColor: '#0a3ca0',
-          borderWidth: 1
-        }
-      }
+          borderWidth: 1,
+        },
+      },
    },
    {
      type: 'liquidFill',
@@ -125,27 +127,29 @@ const optionData: any = {
      name: t('views.dashboard.overview.resources.sysMem'),
      color: getColorByValue(resourceData.value.sysMem),
      backgroundStyle: {
-        color: 'rgba(10, 60, 160, 0.1)'
+        color: 'rgba(10, 60, 160, 0.1)',
      },
      label: {
        normal: {
          formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysMem')}\n${resourceData.value.sysMem}%`;
+            return `${t('views.dashboard.overview.resources.sysMem')}\n${
+              resourceData.value.sysMem
+            }%`;
          },
          textStyle: {
            fontSize: 12,
-            color: '#fff'
-          }
-        }
+            color: '#fff',
+          },
+        },
      },
      outline: {
        show: true,
        borderDistance: 2,
        itemStyle: {
          borderColor: '#0a3ca0',
-          borderWidth: 1
-        }
-      }
+          borderWidth: 1,
+        },
+      },
    },
    {
      type: 'liquidFill',
@@ -155,36 +159,35 @@ const optionData: any = {
      name: t('views.dashboard.overview.resources.sysDisk'),
      color: getColorByValue(resourceData.value.sysDisk),
      backgroundStyle: {
-        color: 'rgba(10, 60, 160, 0.1)'
+        color: 'rgba(10, 60, 160, 0.1)',
      },
      label: {
        normal: {
          formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysDisk')}\n${resourceData.value.sysDisk}%`;
+            return `${t('views.dashboard.overview.resources.sysDisk')}\n${
+              resourceData.value.sysDisk
+            }%`;
          },
          textStyle: {
            fontSize: 12,
-            color: '#fff'
-          }
-        }
+            color: '#fff',
+          },
+        },
      },
      outline: {
        show: true,
        borderDistance: 2,
        itemStyle: {
          borderColor: '#0a3ca0',
-          borderWidth: 1
-        }
-      }
-    }
-  ]
+          borderWidth: 1,
+        },
+      },
+    },
+  ],
 };

 /**图数据渲染 */
-function handleRanderChart(
-  container: HTMLElement | undefined,
-  option: any
-) {
+function handleRanderChart(container: HTMLElement | undefined, option: any) {
  if (!container) return;
  neResourcesChart.value = markRaw(echarts.init(container));
  option && neResourcesChart.value.setOption(option);
@@ -235,7 +238,10 @@ function fnChangeData(data: any[], itemID: string) {
  }

  let sysDiskUsage = 0;
-  if (info.neStateMap[neID].disk && Array.isArray(info.neStateMap[neID].disk.partitionInfo)) {
+  if (
+    info.neStateMap[neID].disk &&
+    Array.isArray(info.neStateMap[neID].disk.partitionInfo)
+  ) {
    let disks: any[] = info.neStateMap[neID].disk.partitionInfo;
    disks = disks.sort((a, b) => +b.used - +a.used);
    if (disks.length > 0) {
@@ -248,7 +254,7 @@ function fnChangeData(data: any[], itemID: string) {
    neCpu: nfCpuUsage,
    sysCpu: sysCpuUsage,
    sysMem: sysMemUsage,
-    sysDisk: sysDiskUsage
+    sysDisk: sysDiskUsage,
  };

  // 更新图表数据
@@ -260,10 +266,12 @@ function fnChangeData(data: any[], itemID: string) {
        label: {
          normal: {
            formatter: () => {
-              return `${t('views.dashboard.overview.resources.neCpu')}\n${resourceData.value.neCpu}%`;
-            }
-          }
-        }
+              return `${t('views.dashboard.overview.resources.neCpu')}\n${
+                resourceData.value.neCpu
+              }%`;
+            },
+          },
+        },
      },
      {
        data: [resourceData.value.sysCpu / 100],
@@ -271,10 +279,12 @@ function fnChangeData(data: any[], itemID: string) {
        label: {
          normal: {
            formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysCpu')}\n${resourceData.value.sysCpu}%`;
-            }
-          }
-        }
+              return `${t('views.dashboard.overview.resources.sysCpu')}\n${
+                resourceData.value.sysCpu
+              }%`;
+            },
+          },
+        },
      },
      {
        data: [resourceData.value.sysMem / 100],
@@ -282,10 +292,12 @@ function fnChangeData(data: any[], itemID: string) {
        label: {
          normal: {
            formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysMem')}\n${resourceData.value.sysMem}%`;
-            }
-          }
-        }
+              return `${t('views.dashboard.overview.resources.sysMem')}\n${
+                resourceData.value.sysMem
+              }%`;
+            },
+          },
+        },
      },
      {
        data: [resourceData.value.sysDisk / 100],
@@ -293,12 +305,14 @@ function fnChangeData(data: any[], itemID: string) {
        label: {
          normal: {
            formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysDisk')}\n${resourceData.value.sysDisk}%`;
-            }
-          }
-        }
-      }
-    ]
+              return `${t('views.dashboard.overview.resources.sysDisk')}\n${
+                resourceData.value.sysDisk
+              }%`;
+            },
+          },
+        },
+      },
+    ],
  });
 }

--- a/src/views/dashboard/overview2/components/UPFFlow/index.vue
+++ b/src/views/dashboard/overview2/components/UPFFlow/index.vue
@@ -208,10 +208,9 @@ function fnGetInitData() {

  listKPIData({
    neType: 'UPF',
-    neId: upfWhoId.value,
-    startTime: nowDate - 5 * 60 * 1000,
+    neId: '001',
+    beginTime: nowDate - 5 * 60 * 1000,
    endTime: nowDate,
-
    interval: 5, // 5秒
    sortField: 'timeGroup',
    sortOrder: 'asc',