添加卸载生命周期

src/views/index/tenantUPF.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref, watch } from 'vue';
+import { onMounted, onUnmounted, ref, watch } from 'vue';
 import { listKPIData } from '@/api/perfManage/goldTarget';
 import * as echarts from 'echarts/core';
 import {
@@ -21,6 +21,10 @@ import {
   upfFlowData,
   upfFlowParse,
 } from '../dashboard/overview/hooks/useUPFTotalFlow';
+
+import { parseSizeFromKbs } from '@/utils/parse-utils';
+import { onBeforeMount } from 'vue';
+import { onBeforeUnmount } from 'vue';
 const { t } = useI18n();
 
 echarts.use([
@@ -68,7 +72,6 @@ function fnDesign(container: HTMLElement | undefined, option: EChartsOption) {
 //渲染速率图
 function handleRanderChart() {
   const { lineXTime, lineYUp, lineYDown } = upfFlowData.value;
-
   var yAxisSeries: any = [
     {
       name: t('views.dashboard.overview.upfFlow.up'),
@@ -191,17 +194,7 @@ function handleRanderChart() {
         },
       },
     ],
-    dataZoom: [
-      {
-        type: 'inside',
-        start: 90,
-        end: 100,
-      },
-      {
-        start: 90,
-        end: 100,
-      },
-    ],
+
     series: yAxisSeries,
   };
   fnDesign(upfFlow.value, optionData);
@@ -215,7 +208,7 @@ function fnGetInitData() {
 
   listKPIData({
     neType: 'UPF',
-    neId:'',
+    neId: '',
     startTime: parseDateToStr(tenMinutesAgo),
     endTime: parseDateToStr(nowDate),
     // startTime: '2024-03-20 19:50:00',
@@ -229,6 +222,13 @@ function fnGetInitData() {
         for (const item of res.data) {
           upfFlowParse(item);
         }
+      } else if (res.code === 0) {
+        upfFlowData.value = {
+          lineXTime: [],
+          lineYUp: [],
+          lineYDown: [],
+          cap: 0,
+        };
       }
     })
     .finally(() => {
@@ -284,6 +284,13 @@ onMounted(() => {
   //   });
   // }, 5000);
 });
+
+onUnmounted(() => {
+  if (upfFlowChart.value) {
+    upfFlowChart.value.dispose();
+    upfFlowChart.value = null;
+  }
+});
 </script>
 
 <template>