From 3cc445834dd33209256b32f5643ec6c7e20ad2a4 Mon Sep 17 00:00:00 2001 From: zhangab Date: Wed, 7 Nov 2018 15:35:42 +0800 Subject: Fix VNF Performance Query Bugs Change-Id: Ieb296116f454e8134bb3c43703f6515a58d9cc0a Issue-ID: USECASEUI-166 Signed-off-by: zhangab --- .../graphiclist/graphiclist.component.html | 68 ++++---- .../graphiclist/graphiclist.component.ts | 174 ++++++--------------- .../performance-details.component.ts | 4 +- .../performance-vnf/performance-vnf.component.css | 4 +- .../performance-vnf/performance-vnf.component.html | 31 +++- .../performance-vnf/performance-vnf.component.less | 2 +- .../performance-vnf/performance-vnf.component.ts | 118 ++++++++------ 7 files changed, 186 insertions(+), 215 deletions(-) diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html index 8a1e64da..3789c598 100644 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html +++ b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html @@ -14,44 +14,42 @@ limitations under the License. -->
-
-
- Report Time: - - - -
+
+ Report Time: + + + +
- - - - NO - Source Name - Priority - SpecificProblem - Report Time - Status - Action - - - - - - {{i+1}} - {{item.name}} - {{item.age}} - {{item.address}} - {{item.address}} - {{item.address}} - - - - - + + + + NO + Source Name + Event Name + ReportingEntityName + + Action + + + + + + {{i+1}} + {{item.sourceName}} + {{item.eventName}} + {{item.reportingEntityName}} + + + + + +
-
- \ No newline at end of file + \ No newline at end of file diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts index 6eaf19f4..c3153c8e 100644 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts +++ b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts @@ -1,147 +1,75 @@ +/* + Copyright (C) 2018 CMCC, Inc. and others. All rights reserved. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ import { Component, OnInit, Input, Output, EventEmitter, HostBinding } from '@angular/core'; +import { MyhttpService } from '../../myhttp.service'; import * as addDays from 'date-fns/add_days'; +import { DatePipe } from "@angular/common" @Component({ selector: 'app-graphiclist', templateUrl: './graphiclist.component.html', - styleUrls: ['./graphiclist.component.less'] + styleUrls: ['./graphiclist.component.less'], + providers: [DatePipe] }) export class GraphiclistComponent implements OnInit { + public startTime: string = ''; + public endTime: string = ''; + public currentPage: number = 1; + public pageSize: number = 10; + list: any; + constructor( private datePipe: DatePipe, + private myhttp: MyhttpService) { } + isVisibleMiddle = false; - constructor() { } - // isVisibleMiddle = false; - - // showModalMiddle(): void { - // this.isVisibleMiddle = true; - // } - // handleOkMiddle(): void { - // console.log('click ok'); - // this.isVisibleMiddle = false; - // } - // handleCancelMiddle(): void { - // this.isVisibleMiddle = false; - // } + showModalMiddle(): void { + this.isVisibleMiddle = true; + } + handleOkMiddle(): void { + // console.log('click ok'); + this.isVisibleMiddle = false; + } + handleCancelMiddle(): void { + this.isVisibleMiddle = false; + } ngOnInit() { + this.getPerformanceFormData(); } - - // 筛选框（下拉框） - MeasurementList = ['aaaa','bbbb','cccc','dddddDDDD']; - MeasurementSelected = "Measurement"; - ReportTimeList = ['aaaa','bbbb','cccc','ddddd']; - ReportTimeSelected = "ReportTime"; - choseMeasurement(item){ - console.log(item); - this.MeasurementSelected = item; + ngOnchanges(changes){ + this.getPerformanceFormData(); + console.log(this.vnfname) + } - choseReportTime(item){ - console.log(item); - this.ReportTimeSelected = item; + getPerformanceFormData() { + this.myhttp.getAlarmFormData(this.currentPage, this.pageSize, this.vnfname, this.startTime, this.endTime).subscribe((data) => { + console.log(data) + this.list = data.alarms; + }) } // Date screening dateRange = [ addDays(new Date(), -30), new Date() ]; onChange(result: Date): void { - console.log('onChange: ', result); - } + this.startTime = this.datePipe.transform(result[0], 'yyyy-MM-dd-HH:mm:ss'); + this.endTime = this.datePipe.transform(result[1], 'yyyy-MM-dd-HH:mm:ss'); +} sort(e){ } - //表格数据 - dataSet = [ - { - name : 'John Brown', - age : 32, - expand : false, - address : 'New York No. 1', - description: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.' - }, - { - name : 'Aim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Bim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Cim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Jim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Xim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Jim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Jim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Jim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'Jim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'cim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'bim Green', - age : 42, - expand : false, - address : 'London No. 1', - description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.' - }, - { - name : 'aoe Black', - age : 32, - expand : false, - address : 'Sidney No. 1', - description: 'My name is Joe Black, I am 32 years old, living in Sidney No. 1 Lake Park.' - } - ]; - + @Input () vnfname; @Output() detailData = new EventEmitter(); detailShow(id){ let prems = { diff --git a/usecaseui-portal/src/app/components/performance-details/performance-details.component.ts b/usecaseui-portal/src/app/components/performance-details/performance-details.component.ts index 9f70824b..2e174474 100644 --- a/usecaseui-portal/src/app/components/performance-details/performance-details.component.ts +++ b/usecaseui-portal/src/app/components/performance-details/performance-details.component.ts @@ -14,11 +14,11 @@ export class PerformanceDetailsComponent implements OnInit { constructor(private myhttp:MyhttpService) { } ngOnInit() { - this.getAlarmDetailData(7); + this.getAlarmDetailData(this.detailId); } ngOnChanges(changes){ - console.log(changes); + // console.log(changes); } datailheaderdata: any = {}; dataillistdata: any = []; diff --git a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.css b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.css index cbb5bfdd..414beebf 100644 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.css +++ b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.css @@ -43,13 +43,13 @@ hr { top: 10px; right: 10px; } -.select .submit { +.select .search { margin-left: 20px; vertical-align: middle; height: 30px; padding: 0 10px; } -.select .submit span { +.select .search span { color: #fff; font-weight: 400; } diff --git a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.html b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.html index 824599e7..d308d808 100644 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.html +++ b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.html @@ -1,3 +1,18 @@ +

Performance VNF > Graphic list @@ -14,25 +29,25 @@ - +
-
- VNF3 -

Mfvs_MMEManaxxdeafsfdf

-
- Mfvs_MMEMa naxxdfdafa fafad a afeaf sfdff doafe oghaiod aaafeageageagfdavzvdagewag +
+ +

{{item.name}}

+
+ {{item.text}}
- +
- +
diff --git a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.less b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.less index 977ef5c0..6cc5b0fc 100644 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.less +++ b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.less @@ -43,7 +43,7 @@ hr { } //下拉框中的样式在style.less中，下拉框是在body中额外临时生成的 } - .submit { + .search { margin-left: 20px; vertical-align: middle; height: 30px; diff --git a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.ts b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.ts index d2e8d991..3e08c2d4 100644 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.ts +++ b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.ts @@ -1,64 +1,85 @@ +/* + Copyright (C) 2018 CMCC, Inc. and others. All rights reserved. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ import { Component, OnInit, HostBinding } from '@angular/core'; import { slideToRight, showHideAnimate } from '../../animates'; +import { MyhttpService } from '../../myhttp.service'; @Component({ selector: 'app-performance-vnf', templateUrl: './performance-vnf.component.html', styleUrls: ['./performance-vnf.component.less'], - animations: [ slideToRight, showHideAnimate ] + animations: [slideToRight, showHideAnimate], }) export class PerformanceVnfComponent implements OnInit { @HostBinding('@routerAnimate') routerAnimateState; - constructor() { } + public sourceNameList: Array = ['---auto---']; + public namecurrentPage: number = 1; + public namepageSize: number = 10; + public sourceName: string = ''; + public vnfsdataTotal: number; + + constructor( + private myhttp: MyhttpService) { } ngOnInit() { - let _this = this; - setTimeout(function(){ - // 在路由切换时加载图片造成动画卡顿，先完成动画再加载图片 - _this.vnfsData = [ - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"}, - {name:"aaa",text:"oahgieango"} - ]; - _this.emptys = new Array(15-_this.vnfsData.length); - },300) + this.getqueryAllSourceNames(); + this.getperformanceSsourceNames() } - // 筛选框（下拉框） - sourceNameList = ['aaaa','bbbb','cccc','dddddDDDDDDDDDDDDDDD']; + sourceNameSelected = this.sourceNameList[0]; - ReportingEntityNameList = ['aaaa','bbbb','cccc','ddddd']; - ReportingEntityNameSelected = this.ReportingEntityNameList[0]; - choseSourceName(item){ - console.log(item); - this.sourceNameSelected = item; + getqueryAllSourceNames() { + this.myhttp.getqueryAllSourceNames().subscribe((data) => { + // console.log(data) + for (let i = 0; i < data.length; i++) { + this.sourceNameList.push(data[i]); + } + this.sourceNameSelected = this.sourceNameList[0]; + }) } - choseReportingEntityName(item){ + choseSourceName(item) { console.log(item); - this.ReportingEntityNameSelected = item; + this.sourceNameSelected = item; + if (item == "---auto---") { + this.sourceName = ''; + } else { + this.sourceName = item; + } } - submit(){ - + getperformanceSsourceNames() { + this.myhttp.getperformanceSsourceNames(this.namecurrentPage, this.namepageSize, this.sourceName).subscribe((data) => { + this.vnfsData = data.vnfdata; + this.vnfsdataTotal = data.total; + if (Number.isInteger(this.vnfsData.length / 5)) { + this.emptys = new Array(0); + } else { + this.emptys = new Array(5 - this.vnfsData.length % 5); + } + // console.log(this.emptys); + }) } - // vnfs数据 + // vnfs data vnfsData = []; - emptys = []; //补空盒子用 - // 分页 - current = 1; //当前页码 + emptys = []; //Fill the box - //详情页标题显示 + //Detail page title display graphicshow = false; detailshow = false; - // 显示隐藏动画 + // Show hidden animation state = "show"; state2 = "hide"; state3 = "hide"; @@ -69,24 +90,33 @@ export class PerformanceVnfComponent implements OnInit { this.graphicshow = false; this.detailshow = false; } - graphicShow() { + // Selected name + + graphicShow(item) { this.state = 'hide'; this.state2 = 'show'; this.state3 = 'hide'; this.graphicshow = true; this.detailshow = false; } - // 选中id - detailId:number; - detailShow(prems) { + vnfname: number; + graphicShow2(item){ + this.state = 'hide'; + this.state2 = 'show'; + this.state3 = 'hide'; + this.graphicshow = true; + this.detailshow = false; + this.vnfname = item.name; + } + // Selected id + detailId: number; + detailShow(item) { this.state = 'hide'; this.state2 = 'hide'; this.state3 = 'show'; this.graphicshow = true; this.detailshow = true; - console.log(prems); - this.detailId = prems.id; + this.detailId = item.id; } - } -- cgit 1.2.3-korg