From 53ea5c4a0f00371c4a8e44cd7b460ce6f5c81798 Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Mon, 21 Mar 2022 17:33:32 +0800
Subject: [PATCH] reset entity

---
 src/views/dashboard/graphs/EndpointList.vue   | 19 +++++++++++-------
 src/views/dashboard/graphs/InstanceList.vue   | 20 ++++++++++++-------
 src/views/dashboard/graphs/ServiceList.vue    | 19 ++++++++++++------
 .../related/topology/components/Graph.vue     |  4 ++++
 .../topology/components/PodTopology.vue       |  2 ++
 5 files changed, 44 insertions(+), 20 deletions(-)

diff --git a/src/views/dashboard/graphs/EndpointList.vue b/src/views/dashboard/graphs/EndpointList.vue
index 27fbd7eb..f59f262a 100644
--- a/src/views/dashboard/graphs/EndpointList.vue
+++ b/src/views/dashboard/graphs/EndpointList.vue
@@ -33,17 +33,13 @@ limitations under the License. -->
       <el-table v-loading="chartLoading" :data="endpoints" style="width: 100%">
         <el-table-column label="Endpoints">
           <template #default="scope">
-            <router-link
+            <span
               class="link"
-              :to="`/dashboard/${dashboardStore.layerId}/${
-                EntityType[2].value
-              }/${selectorStore.currentService.id}/${
-                scope.row.id
-              }/${config.dashboardName.split(' ').join('-')}`"
+              @click="clickEndpoint"
               :style="{ fontSize: `${config.fontSize}px` }"
             >
               {{ scope.row.label }}
-            </router-link>
+            </span>
           </template>
         </el-table-column>
         <el-table-column
@@ -94,6 +90,7 @@ import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useProcessor";
 import Line from "./Line.vue";
 import Card from "./Card.vue";
 import { EntityType } from "../data";
+import router from "@/router";
 
 /*global defineProps */
 const props = defineProps({
@@ -159,6 +156,14 @@ async function queryEndpointMetrics(currentPods: Endpoint[]) {
   }
   endpoints.value = currentPods;
 }
+function clickEndpoint(scope: any) {
+  dashboardStore.setEntity(EntityType[2].value);
+  router.push(
+    `/dashboard/${dashboardStore.layerId}/${EntityType[2].value}/${
+      selectorStore.currentService.id
+    }/${scope.row.id}/${props.config.dashboardName.split(" ").join("-")}`
+  );
+}
 function changePage(pageIndex: number) {
   endpoints.value = searchEndpoints.value.splice(pageIndex - 1, pageSize);
 }
diff --git a/src/views/dashboard/graphs/InstanceList.vue b/src/views/dashboard/graphs/InstanceList.vue
index 06e7a23f..554115da 100644
--- a/src/views/dashboard/graphs/InstanceList.vue
+++ b/src/views/dashboard/graphs/InstanceList.vue
@@ -33,17 +33,13 @@ limitations under the License. -->
       <el-table v-loading="chartLoading" :data="instances" style="width: 100%">
         <el-table-column label="Service Instances">
           <template #default="scope">
-            <router-link
+            <span
               class="link"
-              :to="`/dashboard/${dashboardStore.layerId}/${
-                EntityType[3].value
-              }/${selectorStore.currentService.id}/${
-                scope.row.id
-              }/${config.dashboardName.split(' ').join('-')}`"
+              @click="clickInstance"
               :style="{ fontSize: `${config.fontSize}px` }"
             >
               {{ scope.row.label }}
-            </router-link>
+            </span>
           </template>
         </el-table-column>
         <el-table-column
@@ -94,6 +90,7 @@ import { InstanceListConfig } from "@/types/dashboard";
 import { Instance } from "@/types/selector";
 import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useProcessor";
 import { EntityType } from "../data";
+import router from "@/router";
 
 /*global defineProps */
 const props = defineProps({
@@ -164,6 +161,15 @@ async function queryInstanceMetrics(currentInstances: Instance[]) {
   instances.value = currentInstances;
 }
 
+function clickInstance(scope: any) {
+  dashboardStore.setEntity(EntityType[3].value);
+  router.push(
+    `/dashboard/${dashboardStore.layerId}/${EntityType[3].value}/${
+      selectorStore.currentService.id
+    }/${scope.row.id}/${props.config.dashboardName.split(" ").join("-")}`
+  );
+}
+
 function changePage(pageIndex: number) {
   instances.value = searchInstances.value.splice(pageIndex - 1, pageSize);
 }
diff --git a/src/views/dashboard/graphs/ServiceList.vue b/src/views/dashboard/graphs/ServiceList.vue
index f2b78563..94575bd7 100644
--- a/src/views/dashboard/graphs/ServiceList.vue
+++ b/src/views/dashboard/graphs/ServiceList.vue
@@ -45,16 +45,13 @@ limitations under the License. -->
         </el-table-column>
         <el-table-column label="Service Names">
           <template #default="scope">
-            <router-link
+            <span
               class="link"
-              :to="`/dashboard/${dashboardStore.layerId}/${
-                EntityType[0].value
-              }/${scope.row.id}/${config.dashboardName.split(' ').join('-')}`"
-              :key="1"
               :style="{ fontSize: `${config.fontSize}px` }"
+              @click="clickService(scope)"
             >
               {{ scope.row.label }}
-            </router-link>
+            </span>
           </template>
         </el-table-column>
         <el-table-column
@@ -105,6 +102,7 @@ import { useDashboardStore } from "@/store/modules/dashboard";
 import { Service } from "@/types/selector";
 import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useProcessor";
 import { EntityType } from "../data";
+import router from "@/router";
 
 /*global defineProps */
 const props = defineProps({
@@ -173,6 +171,15 @@ async function queryServices() {
   }
   queryServiceMetrics(services.value);
 }
+
+function clickService(scope: any) {
+  dashboardStore.setEntity(EntityType[0].value);
+  const path = `/dashboard/${dashboardStore.layerId}/${EntityType[0].value}/${
+    scope.row.id
+  }/${props.config.dashboardName.split(" ").join("-")}`;
+
+  router.push(path);
+}
 async function queryServiceMetrics(currentServices: Service[]) {
   const { metrics } = props.config;
 
diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue
index f67be5ec..4f080c9a 100644
--- a/src/views/dashboard/related/topology/components/Graph.vue
+++ b/src/views/dashboard/related/topology/components/Graph.vue
@@ -239,6 +239,7 @@ function handleLinkClick(event: any, d: Call) {
     dashboardStore.entity === EntityType[1].value
       ? EntityType[0].value
       : dashboardStore.entity;
+  dashboardStore.setEntity(`${e}Relation`);
   const path = `/dashboard/${dashboardStore.layerId}/${e}Relation/${
     d.source.id
   }/${d.target.id}/${settings.value.linkDashboard.split(" ").join("-")}`;
@@ -373,6 +374,7 @@ async function handleInspect() {
   update();
 }
 function handleGoEndpoint(name: string) {
+  dashboardStore.setEntity(EntityType[2].value);
   const path = `/dashboard/${dashboardStore.layerId}/Endpoint/${
     topologyStore.node.id
   }/${name.split(" ").join("-")}`;
@@ -381,6 +383,7 @@ function handleGoEndpoint(name: string) {
   window.open(routeUrl.href, "_blank");
 }
 function handleGoInstance(name: string) {
+  dashboardStore.setEntity(EntityType[3].value);
   const path = `/dashboard/${dashboardStore.layerId}/ServiceInstance/${
     topologyStore.node.id
   }/${name.split(" ").join("-")}`;
@@ -389,6 +392,7 @@ function handleGoInstance(name: string) {
   window.open(routeUrl.href, "_blank");
 }
 function handleGoDashboard(name: string) {
+  dashboardStore.setEntity(EntityType[0].value);
   const path = `/dashboard/${dashboardStore.layerId}/Service/${
     topologyStore.node.id
   }/${name.split(" ").join("-")}`;
diff --git a/src/views/dashboard/related/topology/components/PodTopology.vue b/src/views/dashboard/related/topology/components/PodTopology.vue
index 045f17f7..692b8209 100644
--- a/src/views/dashboard/related/topology/components/PodTopology.vue
+++ b/src/views/dashboard/related/topology/components/PodTopology.vue
@@ -150,6 +150,7 @@ function goDashboard() {
     dashboardStore.entity === EntityType[2].value
       ? EntityType[2].value
       : EntityType[3].value;
+  dashboardStore.setEntity(entity);
   const path = `/dashboard/${dashboardStore.layerId}/${entity}/${topologyStore.node.serviceId}/${topologyStore.node.id}/${settings.value.nodeDashboard}`;
   const routeUrl = router.resolve({ path });
   window.open(routeUrl.href, "_blank");
@@ -182,6 +183,7 @@ function selectNodeLink(d: any) {
       dashboardStore.entity === EntityType[2].value
         ? EntityType[6].value
         : EntityType[5].value;
+    dashboardStore.setEntity(entity);
     const path = `/dashboard/${dashboardStore.layerId}/${entity}/${sourceObj.serviceId}/${sourceObj.id}/${targetObj.serviceId}/${targetObj.id}/${settings.value.linkDashboard}`;
     const routeUrl = router.resolve({ path });
     window.open(routeUrl.href, "_blank");