github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-18 11:05:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: query metrics

Browse Source
This commit is contained in:
Qiuxia Fan 2022-02-16 16:52:46 +08:00
parent bc87567f14
commit 57e6fc342d
6 changed files with 75 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/hooks/useProcessor.ts
View File

@ -41,6 +41,9 @@ export function useQueryProcessor(config: any) {
"ServiceInstanceRelation",
"EndpointRelation",
].includes(dashboardStore.entity);
if (isRelation && !selectorStore.currentDestService) {
return;
}
const fragment = config.metrics.map((name: string, index: number) => {
const metricType = config.metricTypes[index] || "";
const labels = ["0", "1", "2", "3", "4"];

1
src/store/modules/topology.ts
View File

@ -129,7 +129,6 @@ export const topologyStore = defineStore({
},
setLinkServerMetrics(m: { id: string; value: unknown }[]) {
this.linkServerMetrics = m;
console.log(m);
},
setLinkClientMetrics(m: { id: string; value: unknown }[]) {
this.linkClientMetrics = m;

5
src/styles/lib.scss
View File

@ -143,4 +143,9 @@
.dark-dialog {
background-color: #333840;
color: #ddd;
.el-loading-mask {
background-color: #333840;
color: #ddd;
}
}

12
src/views/dashboard/controls/Widget.vue
View File

@ -147,20 +147,12 @@ export default defineComponent({
}
);
watch(
() => [selectorStore.currentPod],
() => {
if (dashboardStore.entity === EntityType[0].value) {
return;
}
queryMetrics();
}
);
watch(
() => [selectorStore.currentDestPod],
() => [selectorStore.currentPod, selectorStore.currentDestPod],
() => {
if (dashboardStore.entity === EntityType[0].value) {
return;
}
console.log("enter");
queryMetrics();
}
);

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

@ -149,46 +149,13 @@ async function setSelector() {
EntityType[6].value,
].includes(String(params.entity))
) {
await selectorStore.getService(String(params.serviceId));
states.currentService = selectorStore.currentService.value;
const e = String(params.entity).split("Relation")[0];
await fetchPods(e, selectorStore.currentService.id, false);
if (!(selectorStore.pods.length && selectorStore.pods[0])) {
selectorStore.setCurrentPod(null);
states.currentPod = "";
return;
}
const pod = params.podId || selectorStore.pods[0].id;
const currentPod = selectorStore.pods.filter(
(d: { id: string }) => d.id === pod
)[0];
if (currentPod) {
selectorStore.setCurrentPod(currentPod);
states.currentPod = currentPod.label;
}
setSourceSelector();
if (
[EntityType[2].value, EntityType[3].value].includes(String(params.entity))
) {
return;
}
await fetchPods(
String(params.entity),
selectorStore.currentDestService.id,
false
);
if (!(selectorStore.destPods.length && selectorStore.destPods[0])) {
selectorStore.setCurrentDestPod(null);
states.currentDestPod = "";
return;
}
const destPod = params.destPodId || selectorStore.destPods[0].id;
const currentDestPod = selectorStore.destPods.filter(
(d: { id: string }) => d.id === destPod
)[0];
if (currentDestPod) {
selectorStore.setCurrentDestPod(currentDestPod);
states.currentDestPod = currentDestPod.label;
}
setDestSelector();
return;
}
// entity=Service/ServiceRelation
@ -212,6 +179,49 @@ async function setSelector() {
states.currentDestService = selectorStore.currentDestService.value;
}
async function setSourceSelector() {
await selectorStore.getService(String(params.serviceId));
states.currentService = selectorStore.currentService.value;
const e = String(params.entity).split("Relation")[0];
await fetchPods(e, selectorStore.currentService.id, false);
if (!(selectorStore.pods.length && selectorStore.pods[0])) {
selectorStore.setCurrentPod(null);
states.currentPod = "";
return;
}
const pod = params.podId || selectorStore.pods[0].id;
const currentPod = selectorStore.pods.filter(
(d: { id: string }) => d.id === pod
)[0];
if (currentPod) {
selectorStore.setCurrentPod(currentPod);
states.currentPod = currentPod.label;
}
}
async function setDestSelector() {
await selectorStore.getService(String(params.destServiceId), true);
states.currentDestService = selectorStore.currentDestService.value;
await fetchPods(
String(params.entity),
selectorStore.currentDestService.id,
false
);
if (!(selectorStore.destPods.length && selectorStore.destPods[0])) {
selectorStore.setCurrentDestPod(null);
states.currentDestPod = "";
return;
}
const destPod = params.destPodId || selectorStore.destPods[0].id;
const currentDestPod = selectorStore.destPods.filter(
(d: { id: string }) => d.id === destPod
)[0];
if (currentDestPod) {
selectorStore.setCurrentDestPod(currentDestPod);
states.currentDestPod = currentDestPod.label;
}
}
async function getServices() {
if (!dashboardStore.layerId) {
return;
@ -233,8 +243,16 @@ async function getServices() {
states.currentService = selectorStore.currentService.value;
states.currentDestService = selectorStore.currentDestService.value;
const e = dashboardStore.entity.split("Relation")[0];
fetchPods(e, selectorStore.currentService.id, true);
fetchPods(dashboardStore.entity, selectorStore.currentDestService.id, true);
if (
[EntityType[2].value, EntityType[3].value].includes(dashboardStore.entity)
) {
fetchPods(e, selectorStore.currentService.id, true);
}
if (
[EntityType[5].value, EntityType[6].value].includes(dashboardStore.entity)
) {
fetchPods(dashboardStore.entity, selectorStore.currentDestService.id, true);
}
}
async function changeService(service: Service[]) {

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

@ -100,7 +100,7 @@ const items = [
];
onMounted(async () => {
loadTopology(selectorStore.currentPod.id);
loadTopology(selectorStore.currentPod && selectorStore.currentPod.id);
});
async function loadTopology(id: string) {
@ -127,7 +127,11 @@ function goAlarm() {
topologyStore.setNode(null);
}
function goDashboard() {
const path = `/dashboard/${dashboardStore.layerId}/${dashboardStore.entity}/${topologyStore.node.serviceId}/${topologyStore.node.id}/${settings.value.nodeDashboard}`;
const entity =
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 routeUrl = router.resolve({ path });
window.open(routeUrl.href, "_blank");
topologyStore.setNode(null);
@ -149,6 +153,7 @@ 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) {
@ -194,6 +199,8 @@ async function getTopology(id: string) {
<style lang="scss" scoped>
.sankey {
margin-top: 10px;
background-color: #333840;
color: #ddd;
}
.settings {
@ -248,7 +255,7 @@ async function getTopology(id: string) {
span {
display: block;
height: 30px;
width: 100px;
width: 140px;
line-height: 30px;
text-align: center;
}