github/skywalking-booster-ui
3
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-10-14 20:01:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: split queries for topology to avoid page crash (#485)

Browse Source
This commit is contained in:
Fine0830
2025-07-30 20:52:33 +08:00
committed by GitHub
parent faf475d82f
commit ad4b0639cd
6 changed files with 55 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/views/dashboard/related/topology/config/Settings.vue
View File

@@ -158,7 +158,6 @@ limitations under the License. -->
import { useI18n } from "vue-i18n";
import { useDashboardStore } from "@/store/modules/dashboard";
import { useTopologyStore } from "@/store/modules/topology";
import { ElMessage } from "element-plus";
import { ScopeType, EntityType, CallTypes } from "@/views/dashboard/data";
import type { Option } from "@/types/app";
import { useQueryTopologyExpressionsProcessor } from "@/hooks/useExpressionsProcessor";
@@ -239,17 +238,12 @@ limitations under the License. -->
async function setLegend() {
updateSettings();
const expression = dashboardStore.selectedGrid.legendMQE && dashboardStore.selectedGrid.legendMQE.expression;
const { getExpressionQuery } = useQueryTopologyExpressionsProcessor(
const { getMetrics } = useQueryTopologyExpressionsProcessor(
[expression],
topologyStore.nodes.filter((d: Node) => d.isReal),
);
const param = getExpressionQuery();
const res = await topologyStore.getTopologyExpressionValue(param);
if (res.errors) {
ElMessage.error(res.errors);
} else {
topologyStore.setLegendValues([expression], res.data);
}
const metrics = await getMetrics();
topologyStore.setLegendValues(expression, metrics);
}
function changeNodeDashboard(opt: any) {
states.nodeDashboard = opt[0].value;

7
src/views/dashboard/related/topology/pod/Sankey.vue
View File

@@ -90,7 +90,7 @@ limitations under the License. -->
const htmlServer = serverMetrics.map((m, index) => {
const metric =
topologyStore.linkServerMetrics[m].values.find((val: { id: string; value: unknown }) => val.id === data.id) ||
topologyStore.linkServerMetrics[m]?.values?.find((val: { id: string; value: unknown }) => val.id === data.id) ||
{};
if (metric) {
const opt: MetricConfigOpt = linkServerMetricConfig[index] || {};
@@ -103,7 +103,7 @@ limitations under the License. -->
const htmlClient = clientMetrics.map((m, index) => {
const opt: MetricConfigOpt = linkClientMetricConfig[index] || {};
const metric =
topologyStore.linkClientMetrics[m].values.find((val: { id: string; value: unknown }) => val.id === data.id) ||
topologyStore.linkClientMetrics[m]?.values?.find((val: { id: string; value: unknown }) => val.id === data.id) ||
{};
return ` <div class="mb-5"><span class="grey">${opt.label || m}: </span>${metric.value} ${opt.unit || ""}</div>`;
@@ -122,7 +122,8 @@ limitations under the License. -->
const nodeMetricConfig = props.settings.nodeMetricConfig || [];
const html = nodeMetrics.map((m, index) => {
const metric =
topologyStore.nodeMetricValue[m].values.find((val: { id: string; value: unknown }) => val.id === data.id) || {};
topologyStore.nodeMetricValue[m]?.values?.find((val: { id: string; value: unknown }) => val.id === data.id) ||
{};
const opt: MetricConfigOpt = nodeMetricConfig[index] || {};
return ` <div class="mb-5"><span class="grey">${opt.label || m}: </span>${metric.value} ${opt.unit || ""}</div>`;

23
src/views/dashboard/related/topology/service/ServiceMap.vue
View File

@@ -159,7 +159,7 @@ limitations under the License. -->
import zoom from "@/views/dashboard/related/components/utils/zoom";
import { useQueryTopologyExpressionsProcessor } from "@/hooks/useExpressionsProcessor";
import { ConfigFieldTypes } from "@/views/dashboard/data";
/*global Nullable, defineProps */
/*global Nullable, defineProps, Indexable */
const props = defineProps({
config: {
type: Object as PropType<any>,
@@ -285,20 +285,16 @@ limitations under the License. -->
if (!expression) {
return;
}
const { getExpressionQuery } = useQueryTopologyExpressionsProcessor(
const { getMetrics } = useQueryTopologyExpressionsProcessor(
[expression],
topologyStore.nodes.filter((d: Node) => d.isReal),
);
const param = getExpressionQuery();
const res = await topologyStore.getTopologyExpressionValue(param);
if (res.errors) {
ElMessage.error(res.errors);
} else {
topologyStore.setLegendValues([expression], res.data);
}
const metrics = await getMetrics();
topologyStore.setLegendValues(expression, metrics);
}
function getNodeStatus(d: any) {
function getNodeStatus(d: Indexable) {
const { legendMQE } = settings.value;
if (!legendMQE) {
return icons.CUBE;
@@ -313,8 +309,7 @@ limitations under the License. -->
const nodeMetricConfig = settings.value.nodeMetricConfig || [];
const html = nodeMetrics.map((m, index) => {
const metric =
(topologyStore.nodeMetricValue[m] &&
topologyStore.nodeMetricValue[m].values.find((val: { id: string; value: string }) => val.id === data.id)) ||
topologyStore.nodeMetricValue[m]?.values?.find((val: { id: string; value: string }) => val.id === data.id) ||
{};
const opt: MetricConfigOpt = nodeMetricConfig[index] || {};
return ` <div class="mb-5"><span class="grey">${opt.label || m}: </span>${metric.value || NaN} ${
@@ -339,7 +334,7 @@ limitations under the License. -->
const linkClientMetricConfig: MetricConfigOpt[] = settings.value.linkClientMetricConfig || [];
const linkServerMetrics: string[] = settings.value.linkServerExpressions || [];
const htmlServer = linkServerMetrics.map((m, index) => {
const metric = topologyStore.linkServerMetrics[m].values.find(
const metric = topologyStore.linkServerMetrics[m]?.values?.find(
(val: { id: string; value: unknown }) => val.id === data.id,
);
if (metric) {
@@ -351,7 +346,7 @@ limitations under the License. -->
});
const htmlClient = linkClientMetrics.map((m: string, index: number) => {
const opt: MetricConfigOpt = linkClientMetricConfig[index] || {};
const metric = topologyStore.linkClientMetrics[m].values.find(
const metric = topologyStore.linkClientMetrics[m]?.values?.find(
(val: { id: string; value: unknown }) => val.id === data.id,
);
if (metric) {