github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-20 14:37:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

update topology

Browse Source
This commit is contained in:
Qiuxia Fan 2022-03-22 15:35:05 +08:00
parent fccbc10bd2
commit 01d8157099
4 changed files with 30 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/views/dashboard/data.ts
View File

@ -204,11 +204,18 @@ export const ServiceRelationTools = [
{ name: "device_hub", content: "Add Topology", id: "addTopology" }, { name: "device_hub", content: "Add Topology", id: "addTopology" },
{ name: "save", content: "Apply", id: "apply" }, { name: "save", content: "Apply", id: "apply" },
]; ];
export const PodRelationTools = [
export const EndpointRelationTools = [
{ name: "playlist_add", content: "Add Widget", id: "addWidget" }, { name: "playlist_add", content: "Add Widget", id: "addWidget" },
{ name: "all_inbox", content: "Add Tab", id: "addTab" }, { name: "all_inbox", content: "Add Tab", id: "addTab" },
{ name: "save", content: "Apply", id: "apply" }, { name: "save", content: "Apply", id: "apply" },
]; ];
export const InstanceRelationTools = [
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
{ name: "all_inbox", content: "Add Tab", id: "addTab" },
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
{ name: "save", content: "Apply", id: "apply" },
];
export const ScopeType = [ export const ScopeType = [
{ value: "Service", label: "Service", key: 1 }, { value: "Service", label: "Service", key: 1 },

18
src/views/dashboard/panel/Tool.vue
View File

@ -110,7 +110,8 @@ import {
ServiceTools, ServiceTools,
InstanceTools, InstanceTools,
EndpointTools, EndpointTools,
PodRelationTools, EndpointRelationTools,
InstanceRelationTools,
ServiceRelationTools, ServiceRelationTools,
} from "../data"; } from "../data";
import { useSelectorStore } from "@/store/modules/selectors"; import { useSelectorStore } from "@/store/modules/selectors";
@ -124,8 +125,9 @@ const selectorStore = useSelectorStore();
const appStore = useAppStoreWithOut(); const appStore = useAppStoreWithOut();
const params = useRoute().params; const params = useRoute().params;
const type = EntityType.filter((d: Option) => d.value === params.entity)[0]; const type = EntityType.filter((d: Option) => d.value === params.entity)[0];
const toolIcons = const toolIcons = ref<{ name: string; content: string; id: string }[]>(
ref<{ name: string; content: string; id: string }[]>(PodRelationTools); EndpointRelationTools
);
const states = reactive<{ const states = reactive<{
destService: string; destService: string;
destPod: string; destPod: string;
@ -446,8 +448,14 @@ function getTools() {
case EntityType[4].value: case EntityType[4].value:
toolIcons.value = ServiceRelationTools; toolIcons.value = ServiceRelationTools;
break; break;
case EntityType[5].value:
toolIcons.value = InstanceRelationTools;
break;
case EntityType[6].value:
toolIcons.value = EndpointRelationTools;
break;
default: default:
toolIcons.value = PodRelationTools; toolIcons.value = EndpointRelationTools;
} }
} }
</script> </script>
@ -501,6 +509,6 @@ function getTools() {
} }
.selectorPod { .selectorPod {
width: 340px; width: 300px;
} }
</style> </style>

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

@ -473,8 +473,12 @@ function setConfig() {
dashboardStore.selectWidget(props.config); dashboardStore.selectWidget(props.config);
} }
function resize() { function resize() {
height.value = document.body.clientHeight; const dom = document.querySelector(".topology")?.getBoundingClientRect() || {
width.value = document.body.clientWidth; height: 40,
width: 0,
};
height.value = dom.height - 40;
width.value = dom.width;
svg.value.attr("height", height.value).attr("width", width.value); svg.value.attr("height", height.value).attr("width", width.value);
} }
function updateSettings(config: any) { function updateSettings(config: any) {

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

@ -234,6 +234,9 @@ async function getTopology(id: string) {
Number(depth.value) Number(depth.value)
); );
break; break;
case EntityType[5].value:
resp = await topologyStore.getInstanceTopology();
break;
case EntityType[4].value: case EntityType[4].value:
resp = await topologyStore.getInstanceTopology(); resp = await topologyStore.getInstanceTopology();
break; break;