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

toplist associate with trace

Browse Source
This commit is contained in:
Fine 2022-09-27 15:30:14 +08:00
parent 2ab2dfcafc
commit 1e2963950c
3 changed files with 44 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/types/dashboard.d.ts vendored
View File

@ -50,6 +50,7 @@ export interface LayoutConfig {
traceId?: string; traceId?: string;
spanId?: string; spanId?: string;
segmentId?: string; segmentId?: string;
id?: string;
}; };
} }

8
src/views/dashboard/graphs/TopList.vue
View File

@ -68,7 +68,7 @@ import Trace from "../controls/Trace.vue";
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object as PropType<{ type: Object as PropType<{
[key: string]: { name: string; value: number; traceIds: string[] }[]; [key: string]: { name: string; value: number; id: string }[];
}>, }>,
default: () => ({}), default: () => ({}),
}, },
@ -80,7 +80,7 @@ const props = defineProps({
}); });
const { t } = useI18n(); const { t } = useI18n();
const showTrace = ref<boolean>(false); const showTrace = ref<boolean>(false);
const traceOptions = ref<{ type: string; filter?: unknown }>({ const traceOptions = ref<{ type: string; filters?: unknown }>({
type: "Trace", type: "Trace",
}); });
const key = computed(() => Object.keys(props.data)[0] || ""); const key = computed(() => Object.keys(props.data)[0] || "");
@ -101,10 +101,10 @@ function handleClick(event: PointerEvent, i: string) {
event.stopPropagation(); event.stopPropagation();
copy(i); copy(i);
} }
function viewTrace(item: { name: string }) { function viewTrace(item: { name: string; id: string }) {
traceOptions.value = { traceOptions.value = {
...traceOptions.value, ...traceOptions.value,
filter: item, filters: item,
}; };
showTrace.value = true; showTrace.value = true;
} }

53
src/views/dashboard/related/trace/Filter.vue
View File

@ -164,7 +164,7 @@ async function getServices() {
ElMessage.error(resp.errors); ElMessage.error(resp.errors);
return; return;
} }
state.service = traceStore.services[0]; state.service = getCurrentNode(traceStore.services) || traceStore.services[0];
getEndpoints(state.service.id); getEndpoints(state.service.id);
getInstances(state.service.id); getInstances(state.service.id);
} }
@ -175,7 +175,8 @@ async function getEndpoints(id?: string, keyword?: string) {
ElMessage.error(resp.errors); ElMessage.error(resp.errors);
return; return;
} }
state.endpoint = traceStore.endpoints[0]; state.endpoint =
getCurrentNode(traceStore.endpoints) || traceStore.endpoints[0];
} }
async function getInstances(id?: string) { async function getInstances(id?: string) {
const resp = await traceStore.getInstances(id); const resp = await traceStore.getInstances(id);
@ -183,9 +184,36 @@ async function getInstances(id?: string) {
ElMessage.error(resp.errors); ElMessage.error(resp.errors);
return; return;
} }
state.instance = traceStore.instances[0]; state.instance =
getCurrentNode(traceStore.instances) || traceStore.instances[0];
} }
function searchTraces() { function getCurrentNode(arr: { id: string }[]) {
let item;
if (props.data.filters && props.data.filters.id) {
item = arr.find((d: { id: string }) => d.id === props.data.filters?.id);
}
return item;
}
function setCondition() {
let param: any = {
traceState: state.status.value || "ALL",
tags: tagsMap.value.length ? tagsMap.value : undefined,
queryOrder: traceStore.conditions.queryOrder || "BY_DURATION",
queryDuration: duration.value,
minTraceDuration: Number(minTraceDuration.value),
maxTraceDuration: Number(maxTraceDuration.value),
traceId: traceId.value || undefined,
paging: { pageNum: 1, pageSize: 20 },
};
if (props.data.filters && props.data.filters.id) {
param = {
...param,
serviceId: selectorStore.currentService.id,
endpointId: state.endpoint.id || undefined,
serviceInstanceId: state.instance.id || undefined,
};
return param;
}
let endpoint = "", let endpoint = "",
instance = ""; instance = "";
if (dashboardStore.entity === EntityType[2].value) { if (dashboardStore.entity === EntityType[2].value) {
@ -194,21 +222,18 @@ function searchTraces() {
if (dashboardStore.entity === EntityType[3].value) { if (dashboardStore.entity === EntityType[3].value) {
instance = selectorStore.currentPod.id; instance = selectorStore.currentPod.id;
} }
traceStore.setTraceCondition({ param = {
...param,
serviceId: selectorStore.currentService serviceId: selectorStore.currentService
? selectorStore.currentService.id ? selectorStore.currentService.id
: state.service.id, : state.service.id,
traceId: traceId.value || undefined,
endpointId: endpoint || state.endpoint.id || undefined, endpointId: endpoint || state.endpoint.id || undefined,
serviceInstanceId: instance || state.instance.id || undefined, serviceInstanceId: instance || state.instance.id || undefined,
traceState: state.status.value || "ALL", };
queryDuration: duration.value, return param;
minTraceDuration: Number(minTraceDuration.value), }
maxTraceDuration: Number(maxTraceDuration.value), function searchTraces() {
queryOrder: traceStore.conditions.queryOrder || "BY_DURATION", traceStore.setTraceCondition(setCondition());
tags: tagsMap.value.length ? tagsMap.value : undefined,
paging: { pageNum: 1, pageSize: 20 },
});
queryTraces(); queryTraces();
} }
async function queryTraces() { async function queryTraces() {