From 2ec3c8dbf2644f3e99e5494620b2811c5dccbac0 Mon Sep 17 00:00:00 2001 From: cyuamber Date: Mon, 9 Dec 2019 16:58:55 +0800 Subject: feat:add monitor echarts data of api function of monitor 5g page Change-Id: If0f76e8dec5c580b2144ff2f334aea063433ac9f Issue-ID: USECASEUI-370 Signed-off-by: cyuamber --- .../src/app/core/services/slicingTaskServices.ts | 18 +++++++++++ usecaseui-portal/src/app/mock/routes.js | 4 +++ .../views/fcaps/monitor-5g/monitor-5g.component.ts | 35 +++++++++++++++++++++- 3 files changed, 56 insertions(+), 1 deletion(-) (limited to 'usecaseui-portal') diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts index 3380d832..bf74fea7 100644 --- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts +++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts @@ -47,6 +47,10 @@ export class SlicingTaskServices { slicingNssiList:this.baseUrl+"/resource/nssi/instances/pageNo/{pageNo}/pageSize/{pageSize}", slicingNssiQueryOfStatus:this.baseUrl+"/resource/nssi/{instanceStatus}/instances/pageNo/{pageNo}/pageSize/{pageSize}", slicingNssiDetail:this.baseUrl+"/resource/nssi/{nssiId}/details", + //monitor 5G + fetchTraffic:this.baseUrl+"/monitoring/queryTimestamp/{queryTimestamp}/trafficData", + fetchOnlineusers:this.baseUrl+"/monitoring/queryTimestamp/{queryTimestamp}/onlineUsers", + fetchBandwidth:this.baseUrl+"/monitoring/queryTimestamp/{queryTimestamp}/bandwidth" } @@ -163,6 +167,20 @@ export class SlicingTaskServices { let url = this.url.slicingNssiDetail.replace("{nssiId}",nssiId); return this.http.get(url); } + //monitor 5G + getFetchTraffic(service_list,time){ + let url = this.url.fetchTraffic.replace("{queryTimestamp}",time); + return this.http.post(url,service_list); + } + getFetchOnlineusers(service_list,time){ + let url = this.url.fetchOnlineusers.replace("{queryTimestamp}",time); + return this.http.post(url,service_list); + } + getFetchBandwidth(service_list,time){ + let url = this.url.fetchBandwidth.replace("{queryTimestamp}",time); + return this.http.post(url,service_list); + } + } diff --git a/usecaseui-portal/src/app/mock/routes.js b/usecaseui-portal/src/app/mock/routes.js index 3a5eb950..3cf8262f 100644 --- a/usecaseui-portal/src/app/mock/routes.js +++ b/usecaseui-portal/src/app/mock/routes.js @@ -117,6 +117,10 @@ module.exports = "/uui-slicing/nsmf/resource/nssi/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nssi_list", "/uui-slicing/nsmf/resource/nssi/:instanceStatus/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nssi_list_activated", "/uui-slicing/nsmf/resource/nssi/:nssiId/details":"/getSlicingNssiDetail", + ///////<-------------monitor 5G--------->///// + "/POST/uui-slicing/nsmf/monitoring/queryTimestamp/:queryTimestamp/trafficData": "/fetchTrafficData", + "/POST/uui-slicing/nsmf/monitoring/queryTimestamp/:queryTimestamp/onlineUsers": "/fetchOnlineusersData", + "/POST/uui-slicing/nsmf/monitoring/queryTimestamp/:queryTimestamp/bandwidth": "/fetchBandwidthData", ///////<-------------general interface--------->///// "/api/*": "/$1", "/*/*": "/$1_$2", diff --git a/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts b/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts index ac7cc905..5511c1c0 100644 --- a/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts +++ b/usecaseui-portal/src/app/views/fcaps/monitor-5g/monitor-5g.component.ts @@ -16,6 +16,10 @@ export class Monitor5gComponent implements OnInit { pageSize: number = 10; total: number = 0; loading = false; + trafficData: any[] =[]; + onlineusersData: any[] =[]; + bandwidthData: any[] =[]; + selectDate: Date = null; ngOnInit() { this.getBusinessList() } @@ -31,7 +35,8 @@ export class Monitor5gComponent implements OnInit { if (+result_code === 200) { this.total = record_number; this.loading = false; - this.listOfData = [].concat(slicing_business_list) + this.listOfData = [].concat(slicing_business_list); + this.getChartsData(); } }) } @@ -44,6 +49,7 @@ export class Monitor5gComponent implements OnInit { onDateOk(result: Date): void { console.log('onOk', result); + this.selectDate = result; } getChartsData = (time = new Date().getTime()) => { if (!this.listOfData.length) { @@ -53,6 +59,33 @@ export class Monitor5gComponent implements OnInit { this.listOfData.forEach(item => { service_list.push({service_id: item.service_instance_id}); }); + this.fetchTrafficData(service_list, time); + this.fetchOnlineusersData(service_list, time); + this.fetchBandwidthData(service_list, time); + } + fetchTrafficData(service_list, time){ + this.myhttp.getFetchTraffic(service_list,time).subscribe (res => { + const { result_header: { result_code }, result_body: { slicing_usage_traffic_list } } = res; + if (+result_code === 200) { + this.trafficData = slicing_usage_traffic_list; + } + }) + } + fetchOnlineusersData(service_list, time){ + this.myhttp.getFetchOnlineusers(service_list,time).subscribe (res => { + const { result_header: { result_code }, result_body: { slicing_online_user_list } } = res; + if (+result_code === 200) { + this.onlineusersData = slicing_online_user_list; + } + }) + } + fetchBandwidthData(service_list, time){ + this.myhttp.getFetchBandwidth(service_list,time).subscribe (res => { + const { result_header: { result_code }, result_body: { slicing_total_bandwidth_list } } = res; + if (+result_code === 200) { + this.bandwidthData = slicing_total_bandwidth_list; + } + }) } } -- cgit 1.2.3-korg