github/skywalking-booster-ui
3
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-10-15 12:49:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Fine0830
2022-03-21 19:34:08 +08:00
committed by GitHub
parent 61f82c54df
commit f1e405fbb4
23 changed files with 250 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/views/dashboard/related/topology/components/Graph.vue
View File

@@ -85,6 +85,7 @@ import Settings from "./Settings.vue";
import { Option } from "@/types/app";
import { Service } from "@/types/selector";
import { useAppStoreWithOut } from "@/store/modules/app";
import getDashboard from "@/hooks/useDashboardsSession";
/*global Nullable, defineProps */
const props = defineProps({
@@ -239,9 +240,15 @@ function handleLinkClick(event: any, d: Call) {
dashboardStore.entity === EntityType[1].value
? EntityType[0].value
: dashboardStore.entity;
const path = `/dashboard/${dashboardStore.layerId}/${e}Relation/${
d.source.id
}/${d.target.id}/${settings.value.linkDashboard.split(" ").join("-")}`;
const p = getDashboard({
name: settings.value.linkDashboard,
layer: dashboardStore.layerId,
entity: `${e}Relation`,
});
dashboardStore.setEntity(p.entity);
const path = `/dashboard/${p.layer}/${e}Relation/${d.source.id}/${
d.target.id
}/${p.name.split(" ").join("-")}`;
const routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");
}
@@ -373,15 +380,27 @@ async function handleInspect() {
update();
}
function handleGoEndpoint(name: string) {
const path = `/dashboard/${dashboardStore.layerId}/Endpoint/${
topologyStore.node.id
}/${name.split(" ").join("-")}`;
const p = getDashboard({
name,
layer: dashboardStore.layerId,
entity: EntityType[2].value,
});
dashboardStore.setEntity(p.entity);
const path = `/dashboard/${p.layer}/Endpoint/${topologyStore.node.id}/${name
.split(" ")
.join("-")}`;
const routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");
}
function handleGoInstance(name: string) {
const path = `/dashboard/${dashboardStore.layerId}/ServiceInstance/${
const p = getDashboard({
name,
layer: dashboardStore.layerId,
entity: EntityType[3].value,
});
dashboardStore.setEntity(p.entity);
const path = `/dashboard/${p.layer}/ServiceInstance/${
topologyStore.node.id
}/${name.split(" ").join("-")}`;
const routeUrl = router.resolve({ path });
@@ -389,9 +408,15 @@ function handleGoInstance(name: string) {
window.open(routeUrl.href, "_blank");
}
function handleGoDashboard(name: string) {
const path = `/dashboard/${dashboardStore.layerId}/Service/${
topologyStore.node.id
}/${name.split(" ").join("-")}`;
const p = getDashboard({
name,
layer: dashboardStore.layerId,
entity: EntityType[0].value,
});
dashboardStore.setEntity(p.entity);
const path = `/dashboard/${p.layer}/Service/${topologyStore.node.id}/${name
.split(" ")
.join("-")}`;
const routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");

18
src/views/dashboard/related/topology/components/PodTopology.vue
View File

@@ -86,6 +86,7 @@ import { ElMessage } from "element-plus";
import Sankey from "./Sankey.vue";
import Settings from "./Settings.vue";
import router from "@/router";
import getDashboard from "@/hooks/useDashboardsSession";
/*global defineProps */
const props = defineProps({
@@ -150,7 +151,14 @@ function goDashboard() {
dashboardStore.entity === EntityType[2].value
? EntityType[2].value
: EntityType[3].value;
const path = `/dashboard/${dashboardStore.layerId}/${entity}/${topologyStore.node.serviceId}/${topologyStore.node.id}/${settings.value.nodeDashboard}`;
const d = getDashboard({
name: settings.value.nodeDashboard,
layer: dashboardStore.layerId,
entity,
});
dashboardStore.setEntity(entity);
dashboardStore.setCurrentDashboard(d);
const path = `/dashboard/${d.layer}/${entity}/${topologyStore.node.serviceId}/${topologyStore.node.id}/${d.name}`;
const routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");
topologyStore.setNode(null);
@@ -182,7 +190,13 @@ function selectNodeLink(d: any) {
dashboardStore.entity === EntityType[2].value
? EntityType[6].value
: EntityType[5].value;
const path = `/dashboard/${dashboardStore.layerId}/${entity}/${sourceObj.serviceId}/${sourceObj.id}/${targetObj.serviceId}/${targetObj.id}/${settings.value.linkDashboard}`;
const p = getDashboard({
name: settings.value.linkDashboard,
layer: dashboardStore.layerId,
entity,
});
dashboardStore.setEntity(entity);
const path = `/dashboard/${p.layer}/${entity}/${sourceObj.serviceId}/${sourceObj.id}/${targetObj.serviceId}/${targetObj.id}/${p.name}`;
const routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");
return;

1
src/views/dashboard/related/topology/components/Settings.vue
View File

@@ -225,6 +225,7 @@ const states = reactive<{
linkDashboards: [],
nodeDashboards: [],
});
console.log(dashboardStore.selectedGrid);
const isService = [EntityType[0].value, EntityType[1].value].includes(
dashboardStore.entity
);