fix: warnings

src/components/Graph.vue

@@ -20,6 +20,7 @@ import { watch, ref, Ref, onMounted, onBeforeUnmount, unref } from "vue";
 import type { PropType } from "vue";
 import { useECharts } from "@/hooks/useEcharts";
 import { addResizeListener, removeResizeListener } from "@/utils/event";
+import { useTimeoutFn } from "@/hooks/useTimeout";
 
 /*global Nullable, defineProps, defineEmits*/
 const emits = defineEmits(["select"]);
@@ -36,14 +37,16 @@ const props = defineProps({
   },
 });
 
-onMounted(() => {
+onMounted(async () => {
-  setOptions(props.option);
+  await setOptions(props.option);
-  const instance = getInstance();
-
-  instance.on("click", (params: any) => {
-    emits("select", params);
-  });
   addResizeListener(unref(chartRef), resize);
+  useTimeoutFn(() => {
+    const instance = getInstance();
+
+    instance.on("click", (params: any) => {
+      emits("select", params);
+    });
+  }, 1000);
 });
 
 watch(

src/components/TimePicker.vue

@@ -145,6 +145,7 @@ limitations under the License. -->
 import { ref, computed, onMounted, onBeforeUnmount, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import DateCalendar from "./DateCalendar.vue";
+import { useTimeoutFn } from "@/hooks/useTimeout";
 /*global defineProps, defineEmits */
 const datepicker = ref(null);
 const { t } = useI18n();
@@ -270,9 +271,9 @@ const ok = (leaveOpened: boolean) => {
   emit("input", get());
   !leaveOpened &&
     !props.showButtons &&
-    setTimeout(() => {
+    useTimeoutFn(() => {
       show.value = range.value;
-    });
+    }, 1);
 };
 const setDates = (d: Date) => {
   dates.value[1] = d;

src/locales/lang/en.ts

@@ -86,6 +86,7 @@ const msg = {
   nodeSettings: "Node Settings",
   conditions: "Conditions",
   legendSettings: "Legend Settings",
+  setLegend: "Set Legend",
   hourTip: "Select Hour",
   minuteTip: "Select Minute",
   secondTip: "Select Second",

src/locales/lang/zh.ts

@@ -85,6 +85,7 @@ const msg = {
   nodeSettings: "拓扑点设置",
   conditions: "条件",
   legendSettings: "图例设置",
+  setLegend: "设置图例",
   hourTip: "选择小时",
   minuteTip: "选择分钟",
   secondTip: "选择秒数",

src/router/index.ts

@@ -26,6 +26,7 @@ import { routesEvent } from "./event";
 import { routesAlert } from "./alert";
 import { routesSetting } from "./setting";
 import { routesAlarm } from "./alarm";
+import { useTimeoutFn } from "@/hooks/useTimeout";
 
 const routes: Array<RouteRecordRaw> = [
   ...routesGen,
@@ -51,7 +52,7 @@ router.beforeEach((to, from, next) => {
   // const token = window.localStorage.getItem("skywalking-authority");
   if ((window as any).axiosCancel.length !== 0) {
     for (const func of (window as any).axiosCancel) {
-      setTimeout(func(), 0);
+      useTimeoutFn(func(), 0);
     }
     (window as any).axiosCancel = [];
   }

src/views/dashboard/related/topology/components/Settings.vue

@@ -160,7 +160,7 @@ limitations under the License. -->
       size="small"
       type="primary"
     >
-      set legend
+      {{ t("setLegend") }}
     </el-button>
   </div>
 </template>
@@ -170,12 +170,7 @@ import { useI18n } from "vue-i18n";
 import { useDashboardStore } from "@/store/modules/dashboard";
 import { useTopologyStore } from "@/store/modules/topology";
 import { ElMessage } from "element-plus";
-import {
+import { MetricCatalog, ScopeType, MetricConditions } from "../../../data";
-  MetricCatalog,
-  ScopeType,
-  MetricConditions,
-  LegendConditions,
-} from "../../../data";
 import { Option } from "@/types/app";
 import { useQueryTopologyMetrics } from "@/hooks/useProcessor";
 import { Node, Call } from "@/types/topology";