From 69a148b599b2d1906d2caf41af327faa638ccb3f Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Thu, 17 Feb 2022 20:50:12 +0800
Subject: [PATCH] fix: warnings

---
 src/components/Graph.vue                        | 17 ++++++++++-------
 src/components/TimePicker.vue                   |  5 +++--
 src/locales/lang/en.ts                          |  1 +
 src/locales/lang/zh.ts                          |  1 +
 src/router/index.ts                             |  3 ++-
 .../related/topology/components/Settings.vue    |  9 ++-------
 6 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/src/components/Graph.vue b/src/components/Graph.vue
index e293ec89..dc906a99 100644
--- a/src/components/Graph.vue
+++ b/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(() => {
-  setOptions(props.option);
-  const instance = getInstance();
-
-  instance.on("click", (params: any) => {
-    emits("select", params);
-  });
+onMounted(async () => {
+  await setOptions(props.option);
   addResizeListener(unref(chartRef), resize);
+  useTimeoutFn(() => {
+    const instance = getInstance();
+
+    instance.on("click", (params: any) => {
+      emits("select", params);
+    });
+  }, 1000);
 });
 
 watch(
diff --git a/src/components/TimePicker.vue b/src/components/TimePicker.vue
index 5842f9a8..f41f9a16 100755
--- a/src/components/TimePicker.vue
+++ b/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;
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index d13b9e27..3edcbdb3 100644
--- a/src/locales/lang/en.ts
+++ b/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",
diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts
index 9486a572..a06216ef 100644
--- a/src/locales/lang/zh.ts
+++ b/src/locales/lang/zh.ts
@@ -85,6 +85,7 @@ const msg = {
   nodeSettings: "拓扑点设置",
   conditions: "条件",
   legendSettings: "图例设置",
+  setLegend: "设置图例",
   hourTip: "选择小时",
   minuteTip: "选择分钟",
   secondTip: "选择秒数",
diff --git a/src/router/index.ts b/src/router/index.ts
index 4ab9d190..80068c3e 100644
--- a/src/router/index.ts
+++ b/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 = [];
   }
diff --git a/src/views/dashboard/related/topology/components/Settings.vue b/src/views/dashboard/related/topology/components/Settings.vue
index a1c46a7b..4a03e200 100644
--- a/src/views/dashboard/related/topology/components/Settings.vue
+++ b/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 {
-  MetricCatalog,
-  ScopeType,
-  MetricConditions,
-  LegendConditions,
-} from "../../../data";
+import { MetricCatalog, ScopeType, MetricConditions } from "../../../data";
 import { Option } from "@/types/app";
 import { useQueryTopologyMetrics } from "@/hooks/useProcessor";
 import { Node, Call } from "@/types/topology";