You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@skywalking.apache.org by wu...@apache.org on 2021/03/05 09:44:28 UTC
[skywalking-rocketbot-ui] branch master updated: fix: update
instance dependency (#436)
This is an automated email from the ASF dual-hosted git repository.
wusheng pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/skywalking-rocketbot-ui.git
The following commit(s) were added to refs/heads/master by this push:
new 041d7eb fix: update instance dependency (#436)
041d7eb is described below
commit 041d7eb9a15471b1bc503565b4d52614c1fab586
Author: Qiuxia Fan <fi...@outlook.com>
AuthorDate: Fri Mar 5 17:44:21 2021 +0800
fix: update instance dependency (#436)
---
src/store/modules/topology/index.ts | 101 ++++++++++++---------
.../components/dashboard/charts/chart-sankey.vue | 10 +-
.../components/topology/dependency-sankey.vue | 12 +--
src/views/components/topology/radial.vue | 6 +-
4 files changed, 67 insertions(+), 62 deletions(-)
diff --git a/src/store/modules/topology/index.ts b/src/store/modules/topology/index.ts
index 850cd31..7c7043b 100644
--- a/src/store/modules/topology/index.ts
+++ b/src/store/modules/topology/index.ts
@@ -324,7 +324,7 @@ const actions: ActionTree<State, any> = {
},
GET_SERVICE_ENDPOINTS(context: { commit: Commit }, params: { serviceId: string; keyword: string }) {
if (!params.serviceId) {
- return new Promise((resolve) => resolve());
+ return new Promise((resolve) => resolve([]));
}
if (!params.keyword) {
params.keyword = '';
@@ -622,7 +622,7 @@ const actions: ActionTree<State, any> = {
});
});
},
- async GET_TOPO_INSTANCE_DEPENDENCY(
+ GET_TOPO_INSTANCE_DEPENDENCY(
context: { commit: Commit; state: State },
params: {
clientServiceId: string;
@@ -637,59 +637,74 @@ const actions: ActionTree<State, any> = {
if (!(res.data && res.data.data)) {
return;
}
- const serverIdsC = [] as string[];
const clientIdsC = [] as string[];
+ const serverIdsC = [] as string[];
const topoCalls = res.data.data.topo.calls;
for (const call of topoCalls) {
if (call.detectPoints.includes('CLIENT')) {
clientIdsC.push(call.id);
- } else {
+ }
+ if (call.detectPoints.includes('SERVER')) {
serverIdsC.push(call.id);
}
}
- graph
- .query('queryDependencyInstanceClientMetric')
- .params({
- idsC: clientIdsC,
- duration: params.duration,
- })
- .then((json: AxiosResponse) => {
- const clientCalls = [] as string[];
- for (const call of topoCalls) {
- for (const cpm of json.data.data.cpmC.values) {
- if (cpm.id === call.id) {
- clientCalls.push({
- ...call,
- ...cpm,
- });
+ let callback;
+ let callbackServer;
+ if (clientIdsC.length) {
+ callback = graph
+ .query('queryDependencyInstanceClientMetric')
+ .params({
+ idsC: clientIdsC,
+ duration: params.duration,
+ })
+ .then((json: AxiosResponse) => {
+ const clientCalls = [] as string[];
+ for (const call of topoCalls) {
+ for (const cpm of json.data.data.cpmC.values) {
+ if (cpm.id === call.id) {
+ clientCalls.push({
+ ...call,
+ ...cpm,
+ });
+ }
}
}
- }
- graph
- .query('queryDependencyInstanceServerMetric')
- .params({
- idsC: serverIdsC,
- duration: params.duration,
- })
- .then((jsonResp: AxiosResponse) => {
- const serverCalls = [] as string[];
- for (const call of topoCalls) {
- for (const cpm of jsonResp.data.data.cpmC.values) {
- if (cpm.id === call.id) {
- serverCalls.push({
- ...call,
- ...cpm,
- });
- }
+ return clientCalls;
+ });
+ } else {
+ callback = new Promise((resolve) => resolve([]));
+ }
+ if (serverIdsC.length) {
+ callbackServer = graph
+ .query('queryDependencyInstanceServerMetric')
+ .params({
+ idsC: serverIdsC,
+ duration: params.duration,
+ })
+ .then((jsonResp: AxiosResponse) => {
+ const serverCalls = [] as string[];
+ for (const call of topoCalls) {
+ for (const cpm of jsonResp.data.data.cpmC.values) {
+ if (cpm.id === call.id) {
+ serverCalls.push({
+ ...call,
+ ...cpm,
+ });
}
}
- const data = {
- nodes: res.data.data.topo.nodes,
- calls: [...serverCalls, ...clientCalls],
- };
- context.commit(types.SET_INSTANCE_DEPENDENCY, data);
- });
- });
+ }
+ return serverCalls;
+ });
+ } else {
+ callbackServer = new Promise((resolve) => resolve([]));
+ }
+ Promise.all([callback, callbackServer]).then((values: any) => {
+ const instanceDependency = {
+ nodes: res.data.data.topo.nodes,
+ calls: [...values[0], ...values[1]],
+ };
+ context.commit(types.SET_INSTANCE_DEPENDENCY, instanceDependency);
+ });
});
},
INSTANCE_RELATION_INFO(
diff --git a/src/views/components/dashboard/charts/chart-sankey.vue b/src/views/components/dashboard/charts/chart-sankey.vue
index cd05b3c..2cd88cc 100644
--- a/src/views/components/dashboard/charts/chart-sankey.vue
+++ b/src/views/components/dashboard/charts/chart-sankey.vue
@@ -51,15 +51,11 @@ limitations under the License. -->
data: this.data.nodes,
links: this.data.calls,
itemStyle: {
- normal: {
- borderWidth: 0,
- },
+ borderWidth: 0,
},
lineStyle: {
- normal: {
- color: 'source',
- opacity: 0.12,
- },
+ color: 'source',
+ opacity: 0.12,
},
},
],
diff --git a/src/views/components/topology/dependency-sankey.vue b/src/views/components/topology/dependency-sankey.vue
index 1c71ca4..bb9ea6c 100644
--- a/src/views/components/topology/dependency-sankey.vue
+++ b/src/views/components/topology/dependency-sankey.vue
@@ -38,7 +38,7 @@ limitations under the License. -->
top: 20,
right: 300,
bottom: 40,
- focusNodeAdjacency: 'allEdges',
+ emphasis: { focus: 'adjacency' },
data: this.data.nodes,
links: this.data.calls,
label: {
@@ -47,15 +47,11 @@ limitations under the License. -->
},
color: ['#3fe1da', '#6be6c1', '#3fcfdc', '#626c91', '#3fbcde', '#a0a7e6', '#3fa9e1', '#96dee8', '#bf99f8'],
itemStyle: {
- normal: {
- borderWidth: 0,
- },
+ borderWidth: 0,
},
lineStyle: {
- normal: {
- color: 'source',
- opacity: 0.12,
- },
+ color: 'source',
+ opacity: 0.12,
},
},
};
diff --git a/src/views/components/topology/radial.vue b/src/views/components/topology/radial.vue
index a69a0a5..92071de 100644
--- a/src/views/components/topology/radial.vue
+++ b/src/views/components/topology/radial.vue
@@ -101,10 +101,8 @@ limitations under the License. -->
},
},
lineStyle: {
- normal: {
- color: 'source',
- curveness: 0.3,
- },
+ color: 'source',
+ curveness: 0.3,
},
},
],