feat: add switch to control dashboard mode (#31)

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,8 @@ import { InstanceListConfig } from "@/types/dashboard";
 import { Instance } from "@/types/selector";
 import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useProcessor";
 import { EntityType } from "../data";
+import router from "@/router";
+import getDashboard from "@/hooks/useDashboardsSession";
 
 /*global defineProps */
 const props = defineProps({
@@ -164,6 +162,21 @@ async function queryInstanceMetrics(currentInstances: Instance[]) {
   instances.value = currentInstances;
 }
 
+function clickInstance(scope: any) {
+  const d = getDashboard({
+    name: props.config.dashboardName,
+    layer: dashboardStore.layerId,
+    entity: EntityType[3].value,
+  });
+  dashboardStore.setCurrentDashboard(d);
+  dashboardStore.setEntity(d.entity);
+  router.push(
+    `/dashboard/${d.layer}/${d.entity}/${selectorStore.currentService.id}/${
+      scope.row.id
+    }/${d.name.split(" ").join("-")}`
+  );
+}
+
 function changePage(pageIndex: number) {
   instances.value = searchInstances.value.splice(pageIndex - 1, pageSize);
 }