summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--usecaseui-portal/src/app/alarm/alarm.component.ts39
-rw-r--r--usecaseui-portal/src/app/components/charts/line/line.component.ts2
-rw-r--r--usecaseui-portal/src/app/home/home.component.html16
-rw-r--r--usecaseui-portal/src/app/home/home.component.ts201
-rw-r--r--usecaseui-portal/src/app/myhttp.service.ts71
5 files changed, 177 insertions, 152 deletions
diff --git a/usecaseui-portal/src/app/alarm/alarm.component.ts b/usecaseui-portal/src/app/alarm/alarm.component.ts
index 3f563b6e..58c75e7b 100644
--- a/usecaseui-portal/src/app/alarm/alarm.component.ts
+++ b/usecaseui-portal/src/app/alarm/alarm.component.ts
@@ -132,13 +132,16 @@ export class AlarmComponent implements OnInit {
startTime: this.startTime,
endTime: this.endTime
}
- this.myhttp.getHomePerformanceChartData(paramsObj)
+ this.myhttp.getHomeAlarmChartData(paramsObj)
.subscribe((data) => {
this.alarmChartData = {
- series: [
- { data: data.CPU },
- { data: data.CPU },
- { data: data.Memory }
+ xAxis:{
+ data:data.dataList
+ },
+ series:[
+ {data:data.allList},
+ {data:data.ActiveList},
+ {data:data.closedList}
]
}
}, (err) => {
@@ -151,13 +154,16 @@ export class AlarmComponent implements OnInit {
alarmSourceName: this.sourceName,
day:"day"
}
- this.myhttp.getHomePerformanceChartData(paramsObj)
+ this.myhttp.getHomeAlarmChartData(paramsObj)
.subscribe((data) => {
this.alarmChartData = {
- series: [
- { data: data.CPU },
- { data: data.CPU },
- { data: data.Memory }
+ xAxis:{
+ data:data.dataList
+ },
+ series:[
+ {data:data.allList},
+ {data:data.ActiveList},
+ {data:data.closedList}
]
}
}, (err) => {
@@ -169,13 +175,16 @@ export class AlarmComponent implements OnInit {
alarmSourceName: this.sourceName,
day:"month"
}
- this.myhttp.getHomePerformanceChartData(paramsObj)
+ this.myhttp.getHomeAlarmChartData(paramsObj)
.subscribe((data) => {
this.alarmChartData = {
- series: [
- { data: data.CPU },
- { data: data.CPU },
- { data: data.Memory }
+ xAxis:{
+ data:data.dataList
+ },
+ series:[
+ {data:data.allList},
+ {data:data.ActiveList},
+ {data:data.closedList}
]
}
}, (err) => {
diff --git a/usecaseui-portal/src/app/components/charts/line/line.component.ts b/usecaseui-portal/src/app/components/charts/line/line.component.ts
index fa9c0367..fde63ed6 100644
--- a/usecaseui-portal/src/app/components/charts/line/line.component.ts
+++ b/usecaseui-portal/src/app/components/charts/line/line.component.ts
@@ -39,7 +39,7 @@ export class LineComponent implements OnInit {
axisLine:{
show: false
},
- data: ['01','02','04','06','08','10','12','14','16','18','20','22','24']
+ data: this.initData.option.xAxis.data
},
yAxis: {
axisTick: {
diff --git a/usecaseui-portal/src/app/home/home.component.html b/usecaseui-portal/src/app/home/home.component.html
index b2fa5eb4..c93d3f76 100644
--- a/usecaseui-portal/src/app/home/home.component.html
+++ b/usecaseui-portal/src/app/home/home.component.html
@@ -29,14 +29,14 @@
<div class="poerformance">
<h4>{{"PERFORMANCE" | translate}}</h4>
<div class="pfVnf">
- <h3 class="pfVnfNum">126</h3>
+ <h3 class="pfVnfNum">{{performanceVnfNum}}</h3>
<p>Performance VNF</p>
- <img src="../../assets/images/VNF.png" alt="VNF">
+ <img src="./assets/images/VNF.png" alt="VNF">
</div>
<div class="pfVmPm">
- <h3 class="pfVmPmNum">286</h3>
+ <h3 class="pfVmPmNum">{{performanceVmNum}}</h3>
<p>Performance VM/PM</p>
- <img src="../../assets/images/VM.png" alt="VM/PM">
+ <img src="./assets/images/VM.png" alt="VM/PM">
</div>
</div>
<div class="alarm">
@@ -46,16 +46,16 @@
</div>
<div class="rb-content">
- <h4>{{"VM Performance" | translate}}</h4>
+ <h4>{{"Alarm" | translate}}</h4>
<nz-dropdown [nzTrigger]="'click'" [nzPlacement]="'bottomRight'">
- <button nz-button nz-dropdown><span>{{vmPerformanceNameSelected}}</span> <i class="anticon anticon-down"></i></button>
+ <button nz-button nz-dropdown><span>{{sourceNameSelected}}</span> <i class="anticon anticon-down"></i></button>
<ul nz-menu>
- <li nz-menu-item (click)="vmPerformanceNameSelect(item)" *ngFor="let item of vmPerformanceNames">
+ <li nz-menu-item (click)="sourceNameSelect(item)" *ngFor="let item of sourceNameList">
<a>{{item}}</a>
</li>
</ul>
</nz-dropdown>
- <app-line [initData]="performanceChartInit" [chartData]="performanceChartData"></app-line>
+ <app-line [initData]="alarmLineChartInit" [chartData]="alarmLineChartData"></app-line>
</div>
</div>
diff --git a/usecaseui-portal/src/app/home/home.component.ts b/usecaseui-portal/src/app/home/home.component.ts
index 39fab25d..5d91e357 100644
--- a/usecaseui-portal/src/app/home/home.component.ts
+++ b/usecaseui-portal/src/app/home/home.component.ts
@@ -14,38 +14,15 @@ export class HomeComponent implements OnInit {
constructor(private myhttp: MyhttpService) { }
ngOnInit() {
- this.getHomeAllData();
+ this.getSourceNames();
+ this.getHomeServiceData();
+ this.getHomePerformanceData();
+ this.getHomeAlarmData();
+ this.getHomeAlarmChartData();
}
- // alarm饼图
- alarmChartData:Object;
- alarmChartInit:Object = {
- height: 164,
- option:{
- legend: {
- orient: 'vertical',
- left: '0px',
- bottom: '0px',
- data: ['Active','Closed']
- },
- color:["#fb6e6e","#526b75"],
- series:[{
- name:"告警信息",
- radius : '55%',
- label:{
- normal:{
- show: false,
- },
- emphasis: {
- show: true,
- formatter:'{b}\n{c},{d}%',
- }
- }
- }]
- }
- };
- // services饼图
+ // services
serviceNumber:number = 0;
serviceChartData:Object;
serviceChartInit:Object = {
@@ -84,40 +61,141 @@ export class HomeComponent implements OnInit {
}]
}
};
+ // gethomeServiceData
+ getHomeServiceData(){
+ this.myhttp.getHomeServiceData()
+ .subscribe(
+ (data)=>{
+ // console.log(data);
+ this.serviceNumber = data.serviceTotalNum;
+ this.serviceChartData = {
+ series:[{data:data.customerServiceList}]
+ };
+ // console.log(this.serviceChartData);
+ },
+ (err)=>{
+ console.log(err);
+ }
+ )
+ }
+
+ // performance
+ performanceVnfNum = 0;
+ performanceVmNum = 0;
+ getHomePerformanceData(){
+ this.myhttp.getHomePerformanceData()
+ .subscribe((data)=>{
+ this.performanceVnfNum = data.length;
+ })
+ }
+
+ // alarm饼图
+ alarmChartData:Object;
+ alarmChartInit:Object = {
+ height: 164,
+ option:{
+ legend: {
+ orient: 'vertical',
+ left: '0px',
+ bottom: '0px',
+ data: ['Active','Closed']
+ },
+ color:["#fb6e6e","#526b75"],
+ series:[{
+ name:"告警信息",
+ radius : '55%',
+ label:{
+ normal:{
+ show: false,
+ },
+ emphasis: {
+ show: true,
+ formatter:'{b}\n{c},{d}%',
+ }
+ }
+ }]
+ }
+ };
+ getHomeAlarmData(){
+ this.myhttp.getHomeAlarmData()
+ .subscribe((data)=>{
+ this.alarmChartData ={
+ series:[{
+ data:[{name:"Active",value:data[0]},{name:"Closed",value:data[1]}]
+ }]
+ };
+ })
+ }
- // Performance线图
- performanceChartData:Object;
- performanceChartInit:Object = {
+ // alarm线图
+ alarmLineChartData:Object;
+ alarmLineChartInit:Object = {
height:320,
option:{
legend: {
bottom: '0px',
- data: ['CPU','Memory']
+ data: ['All','Active','Closed']
+ },
+ xAxis:{
+ data:["2018-09-10 ","2018-09-11","2018-09-12","2018-09-13","2018-09-14",
+ "2018-09-15","2018-09-16","2018-09-17","2018-09-18","2018-09-19",
+ "2018-09-20","2018-09-21","2018-09-22"]
},
series : [
{
- name: 'CPU',
+ name: 'All',
type: 'line',
- data:[20,23,14,12,34,25,22,42,52,35,34,13,13]
+ data:[30,45,34,35,43,56,36,53,42,45,44,35,32]
},
{
- name: 'Memory',
+ name: 'Active',
type: 'line',
data:[10,23,24,22,14,15,32,12,12,32,14,23,23]
+ },
+ {
+ name: 'Closed',
+ type: 'line',
+ data:[20,23,14,12,34,25,22,42,52,35,34,13,13]
}
]
}
};
- getPerformanceChartData(){
- let paramsObj = {
- vmPerformanceName:this.vmPerformanceNameSelected
+ // sourceName筛选框
+ sourceNameList = ['performanceNameOne'];
+ sourceNameSelected = null;
+ getSourceNames(){
+ this.myhttp.getSourceNames()
+ .subscribe((data)=>{
+ this.sourceNameList = data;
+ })
+ }
+ sourceNameSelect(item){
+ if(this.sourceNameSelected != item){
+ // console.log(item);
+ this.sourceNameSelected = item;
+ this.getHomeAlarmChartData()
+ }
+ }
+ getHomeAlarmChartData(){
+ let nowTime = this.myhttp.dateformater( Date.now());
+ let startTime = this.myhttp.dateformater( Date.now()-30*24*60*60*1000 );
+ let obj = {
+ sourceName:this.sourceNameSelected,
+ startTime: startTime,
+ endTime:nowTime,
+ format:"day"
}
- this.myhttp.getHomePerformanceChartData(paramsObj)
+ console.log(obj);
+ this.myhttp.getHomeAlarmChartData(obj)
.subscribe((data)=>{
- this.performanceChartData = {
+ this.alarmLineChartData = {
+ xAxis:{
+ data:data.dataList
+ },
series:[
- {data:data.CPU},
- {data:data.Memory}
+ {data:data.allList},
+ {data:data.ActiveList},
+ {data:data.closedList}
]
}
},(err)=>{
@@ -125,42 +203,5 @@ export class HomeComponent implements OnInit {
})
}
- // vm筛选框
- vmPerformanceNames = ['performanceNameOne'];
- vmPerformanceNameSelected = this.vmPerformanceNames[0];
- vmPerformanceNameSelect(item){
- if(this.vmPerformanceNameSelected != item){
- console.log(item);
- this.vmPerformanceNameSelected = item;
- this.getPerformanceChartData()
- }
- }
-
- // 获取数据
- getHomeAllData(){
- this.myhttp.getAllHomeData()
- .subscribe(
- (data)=>{
- console.log(data);
- this.alarmChartData ={
- series:[{
- data:data.alarm.chartdata
- }]
- };
- this.serviceNumber = data.services.number;
- this.serviceChartData ={
- series:[{
- data:data.services.chartdata
- }]
- };
- this.vmPerformanceNames = data.Vm_performance.names;
- this.vmPerformanceNameSelected = this.vmPerformanceNames[0];
- this.getPerformanceChartData();
- },
- (err)=>{
- console.log(err);
- }
- )
- }
}
diff --git a/usecaseui-portal/src/app/myhttp.service.ts b/usecaseui-portal/src/app/myhttp.service.ts
index 53a25cec..b2ab91be 100644
--- a/usecaseui-portal/src/app/myhttp.service.ts
+++ b/usecaseui-portal/src/app/myhttp.service.ts
@@ -27,16 +27,15 @@ export class MyhttpService {
// baseUrl = "./assets/json";
// url={
- // allhome:this.baseUrl + "/homeAllData.json",
- // homeLineData:this.baseUrl + "/homePerformanceChartData.json",
- // serviceSelectList:this.baseUrl + "/servicesList.json", //customer、serviceType
- // servicesTableData:this.baseUrl + "/servicesTableData.json",
- // onboardTableData:this.baseUrl + "/onboardTableData.json",
+ // home_serviceData:this.baseUrl + "/home_serviceData.json",
+ // home_performanceData:this.baseUrl + "/home_performanceData.json",
+ // home_alarmData:this.baseUrl + "/home_alarmData.json",
+ // home_alarmChartData:this.baseUrl + "/home_alarmChartData.json",
+ // sourceNames:this.baseUrl + "/SourceName.json",
// customers:this.baseUrl + "/customers.json?",
// serviceType:this.baseUrl + "/serviceTypes.json?*_*",
- // servicesCategory:this.baseUrl + "/configuration_files/servicesCategory.json?",
- // serviceInstanceList:this.baseUrl + "/instanceTableData.json?",
+ // servicesTableData:this.baseUrl + "/servicesTableData.json",
// serviceTemplates:this.baseUrl + "/serviceTemplates2.json?",
// templateParameters:this.baseUrl + "/*_*" + "ServiceTemplateParameters.json?",
// vimInfo:this.baseUrl + "/vimInfo.json?",
@@ -59,24 +58,20 @@ export class MyhttpService {
// connectivity:this.baseUrl + "/sotn-connectivity2.json?",
// vpnBinding:this.baseUrl + "/vpnbinding.json?",
// alarmFormData:this.baseUrl + "/alarmFormData.json?",
- // alarmFormDetailData:this.baseUrl + "/alarmFormDetailData.json?",
- // sourceName:this.baseUrl+ "/SorceName.json?"
// }
// baseUrl = 'http://172.19.44.223/api/usecaseui-server/v1';
baseUrl = '/api/usecaseui-server/v1';
url={
- allhome:this.baseUrl + "/alarm/getAlarmDataByStatus/0",
- homeLineData:this.baseUrl + "/...........",
- serviceSelectList:this.baseUrl + "/xxxxxxxxxxxxx",
- servicesTableData:this.baseUrl + "/xxxxxxxx.json",
- onboardTableData:this.baseUrl + "/xxxxxxx.json",
-
+ home_serviceData:this.baseUrl + "/uui-lcm/serviceNumByCustomer",
+ home_performanceData:this.baseUrl + "/performance/queryAllSourceNames",
+ home_alarmData:this.baseUrl + "/alarm/statusCount",
+ home_alarmChartData:this.baseUrl + "/alarm/diagram",
+ sourceNames:this.baseUrl + "/alarm/getSourceNames",
customers:this.baseUrl + "/uui-lcm/customers",
serviceType:this.baseUrl + "/uui-lcm/customers/" + "*_*" + "/service-subscriptions",
- servicesCategory: "./assets/json/configuration_files/servicesCategory.json",
- serviceInstanceList:this.baseUrl + '/uui-sotn/getServiceInstanceList',
+ servicesTableData:this.baseUrl + '/uui-sotn/getServiceInstanceList',
serviceTemplates:this.baseUrl + "/uui-lcm/service-templates",
templateParameters:this.baseUrl + "/uui-lcm/service-templates/" + "*_*" +"?toscaModelPath=",
nstemplateParameters:this.baseUrl + "/uui-lcm/fetchNsTemplateData",
@@ -102,32 +97,26 @@ export class MyhttpService {
}
// home
- getAllHomeData() {
- return this.http.get<homeData>(this.url.allhome);
+ getHomeServiceData(){
+ return this.http.get<any>(this.url.home_serviceData);
+ }
+ getHomePerformanceData(){
+ return this.http.get<String[]>(this.url.home_performanceData);
}
- //home lin
- getHomePerformanceChartData(paramsObj){
+ getHomeAlarmData(){
+ return this.http.get<any>(this.url.home_alarmData);
+ }
+ getHomeAlarmChartData(paramsObj){
let params = new HttpParams({fromObject:paramsObj});
- return this.http.get<homeVmLineData>(this.url.homeLineData,{params});
+ return this.http.get<any>(this.url.home_alarmChartData,{params});
}
- // servicesList data
- // getServicesSelectData():Observable<HttpResponse<servicesSelectData>>{
- // return this.http.get<servicesSelectData>(this.url.serviceSelectList,{observe:'response'});
- // }
+ // serviceTable list
getServicesTableData(paramsObj):Observable<HttpResponse<servicesTableData>>{
let params = new HttpParams({fromObject:paramsObj});
return this.http.get<servicesTableData>(this.url.servicesTableData,{observe:'response',params});
}
- // onboard data
- getOnboardTableData(paramsObj):Observable<HttpResponse<onboardTableData>>{
- let params = new HttpParams({fromObject:paramsObj});
- return this.http.get<onboardTableData>(this.url.onboardTableData,{observe:'response',params});
- }
-
-
-
//---------------------------------------------------------------------------------
// Get all customers
@@ -140,21 +129,7 @@ export class MyhttpService {
let url = this.url.serviceType.replace("*_*",customer.id);
return this.http.get<any>(url);
}
- // Get service classification information, local configuration file
- // getServicesCategory(){
- // return this.http.get<any>(this.url.servicesCategory);
- // }
- // list Tabular data
- getInstanceTableData(paramsObj){
- let params = new HttpParams({fromObject:paramsObj});
- return this.http.get<any>(this.url.serviceInstanceList,{params});
- }
- // // Service details data
- // getInstanceDetails(id){
- // let url = this.baseUrl + "/detailsData.json?id=" + id;
- // return this.http.get<instanceDetail>(url);
- // }
// Get all template types
getAllServiceTemplates(type){