Skip to content
This repository was archived by the owner on Jun 1, 2022. It is now read-only.

Commit 3dd396b

Browse files
Fine0830Fine0830
authored
fix: separate variables and avoid queries with null parameter to request service for endpoint dependency (#557)
1 parent c766ad5 commit 3dd396b

File tree

5 files changed

+75
-16
lines changed

5 files changed

+75
-16
lines changed

‎src/store/modules/dashboard/mutation-types.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ export const SET_SERVICE_INSTANCE_DEPENDENCY = 'SET_SERVICE_INSTANCE_DEPENDENCY'
4747
export const SET_ENDPOINT_DEPENDENCY = 'SET_ENDPOINT_DEPENDENCY';
4848
export const SET_SELECTOR_ERRORS = 'SET_SELECTOR_ERRORS';
4949
export const SET_DASHBOARD_ERRORS = 'SET_DASHBOARD_ERRORS';
50+
export const SET_CURRENT_DEPENDENCY_ENDPOINT = 'SET_CURRENT_DEPENDENCY_ENDPOINT';
5051

5152
// comp
5253
export const SET_CURRENT_GROUP = 'SET_CURRENT_GROUP';

‎src/store/modules/global/selectors.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ export interface State {
3838
destInstance: Option;
3939
destEndpoint: Option;
4040
selectorErrors: { [key: string]: string };
41+
currentDependencyEndpoint: Option;
4142
}
4243

4344
const initState: State = {
@@ -55,6 +56,7 @@ const initState: State = {
5556
destInstance: { key: '', label: '' },
5657
destEndpoint: { key: '', label: '' },
5758
selectorErrors: {},
59+
currentDependencyEndpoint: { key: '', label: '' },
5860
};
5961

6062
// mutations
@@ -81,14 +83,19 @@ const mutations: MutationTree<State> = {
8183
state.endpoints = pageTypes.includes(state.pageType) ? [{ label: 'All', key: '' }, ...data] : data;
8284
if (!state.endpoints.length) {
8385
state.currentEndpoint = { key: '', label: '' };
86+
state.currentDependencyEndpoint = { key: '', label: '' };
8487
return;
8588
}
8689
state.currentEndpoint = state.endpoints[0];
90+
state.currentDependencyEndpoint = state.endpoints[0];
8791
},
8892
[types.SET_CURRENT_ENDPOINT](state: State, endpoint: Option) {
8993
state.currentEndpoint = endpoint;
9094
state.updateDashboard = endpoint;
9195
},
96+
[types.SET_CURRENT_DEPENDENCY_ENDPOINT](state: State, endpoint: Option) {
97+
state.currentDependencyEndpoint = endpoint;
98+
},
9299
[types.SET_INSTANCES](state: State, data: Option[]) {
93100
const pageTypes = [PageTypes.LOG, PageTypes.EVENT] as string[];
94101
state.instances = pageTypes.includes(state.pageType) ? [{ label: 'All', key: '' }, ...data] : data;

‎src/store/modules/topology/index.ts‎

Lines changed: 51 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -483,7 +483,24 @@ const mutations = {
483483
localStorage.setItem('topologyServicesInstanceDependency', JSON.stringify(state.topoServicesInstanceDependency));
484484
},
485485
[types.SET_ENDPOINT_DEPENDENCY](state: State, data: { calls: Call[]; nodes: Node[] }) {
486-
state.endpointDependency = data;
486+
const obj = {} as any;
487+
let nodes = [];
488+
let calls = [];
489+
nodes = data.nodes.reduce((prev: Node[], next: Node) => {
490+
if (!obj[next.id]) {
491+
obj[next.id] = true;
492+
prev.push(next);
493+
}
494+
return prev;
495+
}, []);
496+
calls = data.calls.reduce((prev: Call[], next: Call) => {
497+
if (!obj[next.id]) {
498+
obj[next.id] = true;
499+
prev.push(next);
500+
}
501+
return prev;
502+
}, []);
503+
state.endpointDependency = { nodes, calls };
487504
state.selectedEndpointCall = null;
488505
},
489506
[types.SET_ENDPOINT_DEPTH](state: State, data: { key: number; label: string }) {
@@ -709,18 +726,31 @@ const actions: ActionTree<State, any> = {
709726
const endpointIds = res.nodes
710727
.map((item: Node) => item.id)
711728
.filter((d: string) => !params.endpointIds.includes(d));
712-
729+
if (!endpointIds.length) {
730+
context.commit(types.SET_ENDPOINT_DEPENDENCY, res);
731+
return;
732+
}
713733
context.dispatch('GET_ENDPOINT_TOPO', { endpointIds, duration: params.duration }).then((json) => {
714734
if (context.state.currentEndpointDepth.key > 2) {
715735
const ids = json.nodes
716736
.map((item: Node) => item.id)
717737
.filter((d: string) => ![...endpointIds, ...params.endpointIds].includes(d));
718-
738+
if (!ids.length) {
739+
const nodes = [...res.nodes, ...json.nodes];
740+
const calls = [...res.calls, ...json.calls];
741+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
742+
return;
743+
}
719744
context.dispatch('GET_ENDPOINT_TOPO', { endpointIds: ids, duration: params.duration }).then((topo) => {
720745
if (context.state.currentEndpointDepth.key > 3) {
721746
const endpoints = topo.nodes
722747
.map((item: Node) => item.id)
723748
.filter((d: string) => ![...ids, ...endpointIds, ...params.endpointIds].includes(d));
749+
if (!endpoints.length) {
750+
const nodes = [...res.nodes, ...json.nodes, ...topo.nodes];
751+
const calls = [...res.calls, ...json.calls, ...topo.calls];
752+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
753+
}
724754
context
725755
.dispatch('GET_ENDPOINT_TOPO', { endpointIds: endpoints, duration: params.duration })
726756
.then((data) => {
@@ -730,21 +760,35 @@ const actions: ActionTree<State, any> = {
730760
.filter(
731761
(d: string) => ![...endpoints, ...ids, ...endpointIds, ...params.endpointIds].includes(d),
732762
);
763+
if (!nodeIds.length) {
764+
const nodes = [...res.nodes, ...json.nodes, ...topo.nodes, ...data.nodes];
765+
const calls = [...res.calls, ...json.calls, ...topo.calls, ...data.calls];
766+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
767+
return;
768+
}
733769
context
734770
.dispatch('GET_ENDPOINT_TOPO', { endpointIds: nodeIds, duration: params.duration })
735771
.then((toposObj) => {
736-
context.commit(types.SET_ENDPOINT_DEPENDENCY, toposObj);
772+
const nodes = [...res.nodes, ...json.nodes, ...topo.nodes, ...data.nodes, ...toposObj.nodes];
773+
const calls = [...res.calls, ...json.calls, ...topo.calls, ...data.calls, ...toposObj.calls];
774+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
737775
});
738776
} else {
739-
context.commit(types.SET_ENDPOINT_DEPENDENCY, data);
777+
const nodes = [...res.nodes, ...json.nodes, ...topo.nodes, ...data.nodes];
778+
const calls = [...res.calls, ...json.calls, ...topo.calls, ...data.calls];
779+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
740780
}
741781
});
742782
} else {
743-
context.commit(types.SET_ENDPOINT_DEPENDENCY, topo);
783+
const nodes = [...res.nodes, ...json.nodes, ...topo.nodes];
784+
const calls = [...res.calls, ...json.calls, ...topo.calls];
785+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
744786
}
745787
});
746788
} else {
747-
context.commit(types.SET_ENDPOINT_DEPENDENCY, json);
789+
const nodes = [...res.nodes, ...json.nodes];
790+
const calls = [...res.calls, ...json.calls];
791+
context.commit(types.SET_ENDPOINT_DEPENDENCY, { nodes, calls });
748792
}
749793
});
750794
} else {

‎src/views/components/topology/dependency/topo-endpoint-dependency.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ limitations under the License. -->
124124
private currentType: Option[] = [];
125125
126126
private beforeMount() {
127-
this.height = document.body.clientHeight - 133;
127+
this.height = document.body.clientHeight - 103;
128128
}
129129
130130
private addMetrics() {

‎src/views/containers/topology/endpoint-dependency/index.vue‎

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ limitations under the License. -->
1919
<ToolBarEndpointSelect
2020
@onChoose="selectEndpoint"
2121
:title="$t('currentEndpoint')"
22-
:current="stateDashboardOption.currentEndpoint"
22+
:current="stateDashboardOption.currentDependencyEndpoint"
2323
:data="stateDashboardOption.endpoints"
2424
icon="code"
2525
/>
@@ -39,6 +39,7 @@ limitations under the License. -->
3939
import Vue from 'vue';
4040
import { Component, Prop } from 'vue-property-decorator';
4141
import { Action, Getter, State, Mutation } from 'vuex-class';
42+
import { Option } from '@/types/global';
4243
import ToolBarSelect from '@/views/components/dashboard/tool-bar/tool-bar-select.vue';
4344
import ToolBarEndpointSelect from '@/views/components/dashboard/tool-bar/tool-bar-endpoint-select.vue';
4445
import TopoEndpointDependency from '@/views/components/topology/dependency/topo-endpoint-dependency.vue';
@@ -59,30 +60,36 @@ limitations under the License. -->
5960
@Mutation('rocketTopo/SET_ENDPOINT_DEPTH') private SET_ENDPOINT_DEPTH: any;
6061
@Action('GET_SERVICE_ENDPOINTS') private GET_SERVICE_ENDPOINTS: any;
6162
@Action('MIXHANDLE_CHANGE_GROUP_WITH_CURRENT') private MIXHANDLE_CHANGE_GROUP_WITH_CURRENT: any;
62-
@Action('SELECT_ENDPOINT') private SELECT_ENDPOINT: any;
63+
@Mutation('SET_CURRENT_DEPENDENCY_ENDPOINT') private SET_CURRENT_DEPENDENCY_ENDPOINT: any;
6364
@Action('rocketTopo/GET_ALL_ENDPOINT_DEPENDENCY') private GET_ALL_ENDPOINT_DEPENDENCY: any;
6465
@Prop() private current!: { key: number | string; label: string };
6566
6667
private depths: Array<{ key: number; label: string }> = [{ key: 2, label: '2' }];
6768
6869
private beforeMount() {
70+
this.depths = [1, 2, 3, 4, 5].map((item: number) => ({ key: item, label: String(item) }));
6971
this.SET_CURRENT_SERVICE(this.current);
7072
this.MIXHANDLE_CHANGE_GROUP_WITH_CURRENT({ index: 0, current: 2 });
7173
this.GET_SERVICE_ENDPOINTS({ duration: this.durationTime, serviceId: this.current.key, keyword: '' }).then(() => {
72-
this.selectEndpoint(this.stateDashboardOption.endpoints[0] || {});
74+
this.GET_ALL_ENDPOINT_DEPENDENCY({
75+
endpointIds: [this.stateDashboardOption.currentDependencyEndpoint.key],
76+
duration: this.durationTime,
77+
});
7378
});
74-
this.depths = [1, 2, 3, 4, 5].map((item: number) => ({ key: item, label: String(item) }));
7579
}
7680
77-
private selectEndpoint(i: any) {
78-
this.SELECT_ENDPOINT({ endpoint: i, duration: this.durationTime });
79-
this.GET_ALL_ENDPOINT_DEPENDENCY({ endpointIds: [i.key], duration: this.durationTime });
81+
private selectEndpoint(i: Option) {
82+
this.SET_CURRENT_DEPENDENCY_ENDPOINT(i);
83+
this.GET_ALL_ENDPOINT_DEPENDENCY({
84+
endpointIds: [this.stateDashboardOption.currentDependencyEndpoint.key],
85+
duration: this.durationTime,
86+
});
8087
}
8188
8289
private selectDepth(i: { key: number; label: string }) {
8390
this.SET_ENDPOINT_DEPTH(i);
8491
this.GET_ALL_ENDPOINT_DEPENDENCY({
85-
endpointIds: [this.stateDashboardOption.currentEndpoint.key],
92+
endpointIds: [this.stateDashboardOption.currentDependencyEndpoint.key],
8693
duration: this.durationTime,
8794
});
8895
}

0 commit comments

Comments
 (0)