From 4ad5962fcc8dfd08f990125e21d68ad8e7ce7917 Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Wed, 16 Feb 2022 17:45:21 +0800
Subject: [PATCH] fix: update style

---
 src/components/Graph.vue                      |  3 ++-
 src/views/dashboard/controls/Widget.vue       |  1 -
 .../related/topology/components/Graph.vue     | 25 ++-----------------
 .../topology/components/PodTopology.vue       |  8 +++++-
 4 files changed, 11 insertions(+), 26 deletions(-)

diff --git a/src/components/Graph.vue b/src/components/Graph.vue
index b324cc83..e293ec89 100644
--- a/src/components/Graph.vue
+++ b/src/components/Graph.vue
@@ -37,11 +37,12 @@ const props = defineProps({
 });
 
 onMounted(() => {
+  setOptions(props.option);
   const instance = getInstance();
+
   instance.on("click", (params: any) => {
     emits("select", params);
   });
-  setOptions(props.option);
   addResizeListener(unref(chartRef), resize);
 });
 
diff --git a/src/views/dashboard/controls/Widget.vue b/src/views/dashboard/controls/Widget.vue
index 603bf0e4..919586b1 100644
--- a/src/views/dashboard/controls/Widget.vue
+++ b/src/views/dashboard/controls/Widget.vue
@@ -152,7 +152,6 @@ export default defineComponent({
         if (dashboardStore.entity === EntityType[0].value) {
           return;
         }
-        console.log("enter");
         queryMetrics();
       }
     );
diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue
index 51be8824..395b99a0 100644
--- a/src/views/dashboard/related/topology/components/Graph.vue
+++ b/src/views/dashboard/related/topology/components/Graph.vue
@@ -403,7 +403,7 @@ function updateSettings(config: any) {
   if (config.nodeDashboard) {
     items.value.push({
       id: "dashboard",
-      title: "Dashboard",
+      title: "View Dashboard",
       func: handleGoDashboard,
     });
   }
@@ -455,7 +455,7 @@ onBeforeUnmount(() => {
     span {
       display: block;
       height: 30px;
-      width: 100px;
+      width: 140px;
       line-height: 30px;
       text-align: center;
     }
@@ -505,27 +505,6 @@ onBeforeUnmount(() => {
     font-size: 11px;
     opacity: 0.8;
   }
-
-  .topo-tool {
-    display: none;
-  }
-
-  .topo-tool-i {
-    cursor: pointer;
-
-    .tool-hexagon {
-      fill: #3f4450;
-      stroke: #217ef2;
-      stroke-width: 2;
-      stroke-opacity: 0.5;
-    }
-
-    &:hover {
-      .tool-hexagon {
-        stroke-opacity: 1;
-      }
-    }
-  }
 }
 
 .d3-tip {
diff --git a/src/views/dashboard/related/topology/components/PodTopology.vue b/src/views/dashboard/related/topology/components/PodTopology.vue
index 56842489..1c35db4b 100644
--- a/src/views/dashboard/related/topology/components/PodTopology.vue
+++ b/src/views/dashboard/related/topology/components/PodTopology.vue
@@ -42,6 +42,7 @@ limitations under the License. -->
     class="sankey"
     :style="`height:${height}px;width:${width}px;`"
     v-loading="loading"
+    @click="handleClick"
   >
     <Sankey @click="selectNodeLink" />
   </div>
@@ -153,7 +154,6 @@ function backToTopology() {
 
 function selectNodeLink(d: any) {
   if (d.dataType === "edge") {
-    console.log(d.data);
     topologyStore.setNode(null);
     topologyStore.setLink(d.data);
     if (!settings.value.linkDashboard) {
@@ -195,6 +195,12 @@ async function getTopology(id: string) {
   }
   return resp;
 }
+function handleClick(event: any) {
+  if (event.target.nodeName === "svg") {
+    topologyStore.setNode(null);
+    topologyStore.setLink(null);
+  }
+}
 </script>
 <style lang="scss" scoped>
 .sankey {