diff options
author | cyuamber <xuranyjy@chinamobile.com> | 2019-08-22 16:55:57 +0800 |
---|---|---|
committer | cyuamber <xuranyjy@chinamobile.com> | 2019-08-22 16:56:09 +0800 |
commit | d0f5347dc16b5aa9fc95eb520fbc9a1c7b672b09 (patch) | |
tree | b3891d8de290d755d7f0f00d35bb77d3b89ad747 /usecaseui-portal/src/app/performance/performance-vnf | |
parent | 56923755c761897cc86ca2457667fcc3e6a0e43f (diff) |
feat: change the project structure and add mock data function
Change-Id: I381845bff5eb37d1fab3eba8cf1ae7838df523b7
Issue-ID: USECASEUI-307
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/performance/performance-vnf')
5 files changed, 0 insertions, 512 deletions
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 deleted file mode 100644 index 269af7a9..00000000 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.css +++ /dev/null @@ -1,126 +0,0 @@ -/* - Copyright (C) 2019 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. -*/ -.title { - font: 700 18px/18px "思源黑体"; - color: #4c5e70; - margin-bottom: 18px; -} -hr { - border: none; - height: 2px; - background-color: #dce1e7; - margin-bottom: 20px; -} -.select { - margin-bottom: 20px; -} -.select span { - display: inline-block; - font: 700 14px "Arial"; - color: #4c5e70; -} -.select nz-dropdown { - vertical-align: middle; -} -.select nz-dropdown :hover { - border-color: #147dc2; -} -.select nz-dropdown button { - width: 165px; - height: 30px; - background-color: #eceff4; - text-align: left; - border-color: #9fa9ab; -} -.select nz-dropdown button span { - font-weight: 400; - display: inline-block; - width: 120px; - overflow: hidden; - text-overflow: ellipsis; - padding-top: 2px; -} -.select nz-dropdown button i { - position: absolute; - top: 10px; - right: 10px; -} -.select .search { - margin-left: 20px; - vertical-align: middle; - height: 30px; - padding: 0 10px; -} -.select .search span { - color: #fff; - font-weight: 400; -} -.content { - background-color: #fff; - border-radius: 5px; - padding: 12px; -} -.content .vnfs { - display: flex; - flex-wrap: wrap; - justify-content: space-around; -} -.content .vnfs .vnf { - width: 18%; - height: 200px; - margin: 5px; - padding: 20px; - border-radius: 2px; - text-align: center; - cursor: pointer; - transition: all 0.3s linear; -} -.content .vnfs .vnf:hover { - background-color: #f5f5f5; - transform: scale(1.02); -} -.content .vnfs .vnf h3 { - font-size: 14px; - color: #3fa8eb; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - margin-bottom: 0; -} -.content .vnfs .vnf .intro { - text-align: left; - font-size: 12px; - overflow: hidden; - display: -webkit-box; - -webkit-line-clamp: 3; - -webkit-box-orient: vertical; - word-wrap: break-word; - word-break: break-all; -} -.content .vnfs .empty { - width: 18%; - height: 200px; - margin: 5px; - border-radius: 2px; -} -.content .pages { - height: 25px; - margin: 20px 10px; - position: relative; -} -.content .pages nz-pagination { - float: right; -} 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 deleted file mode 100644 index f151ef33..00000000 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.html +++ /dev/null @@ -1,60 +0,0 @@ -<!-- - Copyright (C) 2019 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. ---> -<h3 class="title"> - <span (click)="performanceShow()" style="cursor:pointer;" *ngIf="graphicshow" >Performance VNF</span> - <span (click)="graphicShow()" *ngIf="graphicshow">/ Graphic list </span> - <span *ngIf="detailshow">/ Details </span> -</h3> -<div class="select" [@showHideAnimate]="state"> - <span>Source Name: </span> - <nz-dropdown [nzTrigger]="'click'" [nzPlacement]="'bottomLeft'"> - <button nz-button nz-dropdown><span>{{sourceNameSelected}}</span> <i class="anticon anticon-down"></i></button> - <ul nz-menu> - <li nz-menu-item (click)="choseSourceName(item)" *ngFor="let item of sourceNameList"> - <a>{{item}}</a> - </li> - </ul> - </nz-dropdown> - <button class="search" nz-button [nzType]="'primary'"><i class="anticon anticon-search"></i><span>Search</span></button> - <!-- <button class="search" nz-button [nzType]="'primary'" (click)="getperformanceSsourceNames()"><i class="anticon anticon-search"></i><span>Search</span></button> --> -</div> -<div class="content" [@showHideAnimate]="state"> - <div class="vnfs"> - <div class="vnf" *ngFor="let item of totalRecords"> - <img src="../../../assets/images/vnf01.png" title="VNF" (click)="graphicShow2(item)"> - <!-- <h3>{{item.name}}</h3> --> - <div class="intro"> - {{item.name}} - </div> - </div> - <div class="vnf" *ngFor="let item of totalpnfs"> - <img src="../../../assets/images/pnf01.png" alt="PNF" (click)="graphicShow2(item)"> - <div class="intro"> - {{item.name}} - </div> - </div> - <div class="empty" *ngFor="let empty of emptys"></div> - </div> - <div class="pages"> - <nz-pagination [(nzPageIndex)]="currentPage" [nzTotal]="vnfsdataTotal" [nzSize]="'small'" [(nzPageSize)]="pageSize" [nzPageSizeOptions]="[10,15,20,25,30]" nzShowSizeChanger nzShowQuickJumper></nz-pagination> - </div> -</div> -<div [@showHideAnimate]="state2"> - <app-graphiclist (detailData)="detailShow($event)" [vnfname] = "vnfname"></app-graphiclist> -</div> -<div [@showHideAnimate]="state3"> - <app-performance-details [detailId]="detailId"></app-performance-details> -</div> 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 deleted file mode 100644 index cc4e1ca5..00000000 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.less +++ /dev/null @@ -1,136 +0,0 @@ -/* - Copyright (C) 2019 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. -*/ -.title { - font: 500 14px/18px "ArialMT"; - color: #3C4F8C; - padding: 20px 0 0 20px; -} -.select { - height: 70px; - background-color: #fff; - margin-top: -30px; - padding-left: 20px; - box-shadow: 0 2px 23px 0 rgba(0, 0, 0, 0.1), 0 2px 49px 0 rgba(0, 0, 0, 0.06); - line-height: 5; - span { - display: inline-block; - font: 400 14px "ArialMT"; - color: #3C4F8C; - } - nz-dropdown { - vertical-align: middle; - :hover{ - border-color: #147dc2; - } - button { - width: 165px; - height: 30px; - background-color: #fff; - text-align: left; - border-color: #E5E8F2; - span { - font-weight: 400; - display: inline-block; - width: 120px; - overflow: hidden; - text-overflow: ellipsis; - padding-top: 2px; - } - i { - position: absolute; - top: 10px; - right: 10px; - } - } - :hover { - border-color: #48C6EF; - } - //下拉框中的样式在style.less中,下拉框是在body中额外临时生成的 - } - .search { - margin-left: 20px; - margin-top: -6px; - vertical-align: middle; - height: 30px; - padding: 0 10px; - span { - color: #fff; - font-weight: 400; - } - } -} - -.content { - // background-color: #fff; - border-radius: 5px; - padding: 12px; - .vnfs { - display: flex; - flex-wrap: wrap; - justify-content: space-around; - .vnf { - // width: 180px; - background-color: #fff; - width: 18%; - height: 200px; - margin: 5px; - padding: 20px; - border-radius: 2px; - text-align: center; - cursor: pointer; - transition: all 0.3s linear; - &:hover { - background-color: #fff; - transform: scale(1.02); - color: #3F9CFF; - } - h3 { - font-size: 14px; - color: #3fa8eb; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - margin-bottom: 0; - } - .intro { - text-align: left; - font-size: 12px; - overflow: hidden; - padding-top: 25px; - display: -webkit-box; - -webkit-line-clamp: 3; - -webkit-box-orient: vertical; - word-wrap:break-word; - word-break:break-all; - } - } - .empty { - // width: 180px; - width: 18%; - height: 200px; - margin: 5px; - border-radius: 2px; - } - } - .pages { - height: 25px; - margin: 20px 10px; - position: relative; - nz-pagination { - float: right; - } - } -}
\ No newline at end of file diff --git a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.spec.ts b/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.spec.ts deleted file mode 100644 index 18526cdd..00000000 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.spec.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { NO_ERRORS_SCHEMA,CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { TranslateModule, TranslateLoader, TranslateService, TranslateFakeLoader} from '@ngx-translate/core'; -import { NgZorroAntdModule } from 'ng-zorro-antd'; -import { NgxEchartsModule } from 'ngx-echarts'; -import { NZ_I18N, en_US } from 'ng-zorro-antd'; -import { HttpClientModule } from '@angular/common/http'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; - -import { PerformanceDetailsComponent } from '../../components/performance-details/performance-details.component'; -import { GraphiclistComponent } from '../../components/graphiclist/graphiclist.component'; -import { PerformanceVnfComponent } from './performance-vnf.component'; -import { HomesService } from '../../homes.service'; - -describe('PerformanceVnfComponent', () => { - let component: PerformanceVnfComponent; - let fixture: ComponentFixture<PerformanceVnfComponent>; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ PerformanceVnfComponent, PerformanceDetailsComponent, GraphiclistComponent ], - imports: [ TranslateModule.forRoot({loader: { provide: TranslateLoader, useClass: TranslateFakeLoader }}), - NgZorroAntdModule.forRoot(), - NgxEchartsModule, - HttpClientModule, - BrowserAnimationsModule ], - providers: [TranslateService, HomesService ], - schemas: [ - CUSTOM_ELEMENTS_SCHEMA, - NO_ERRORS_SCHEMA - ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(PerformanceVnfComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -});
\ No newline at end of file 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 deleted file mode 100644 index 05719155..00000000 --- a/usecaseui-portal/src/app/performance/performance-vnf/performance-vnf.component.ts +++ /dev/null @@ -1,145 +0,0 @@ -/* - Copyright (C) 2019 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 { HomesService } from '../../homes.service'; - -@Component({ - selector: 'app-performance-vnf', - templateUrl: './performance-vnf.component.html', - styleUrls: ['./performance-vnf.component.less'], - animations: [slideToRight, showHideAnimate], -}) -export class PerformanceVnfComponent implements OnInit { - @HostBinding('@routerAnimate') routerAnimateState; - public sourceNameList: Array<any> = ['---auto---']; - public sourceName: string = ''; - public vnfsdataTotal: number; - public startTime: string = ''; - public endTime: string = ''; - public currentPage: number = 1; - public pageSize: number = 10; - list: any; - - constructor( - private myhttp: HomesService) { } - - ngOnInit() { - this.getqueryAllSourceNames(); - // this.getperformanceSsourceNames(); - let _this = this; - setTimeout(function(){ - _this.totalRecords = [ - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"} - ]; - _this.totalpnfs = [ - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"}, - {name:"Mfvs_MMEManagedElem entdElementMfvs_MMEM anagedELement",text:"oahgieango"} - ] - _this.emptys = new Array(12-_this.totalRecords.length); - },300) - } - - - sourceNameSelected = this.sourceNameList[0]; - getqueryAllSourceNames() { - this.myhttp.getqueryAllSourceNames().subscribe((data) => { - for (let i = 0; i < data.length; i++) { - this.sourceNameList.push(data[i]); - } - this.sourceNameSelected = this.sourceNameList[0]; - }) - } - choseSourceName(item) { - this.sourceNameSelected = item; - if (item == "---auto---") { - this.sourceName = ''; - } else { - this.sourceName = item; - } - } - // vnfs data - totalRecords = []; - totalpnfs = []; - //Fill the box - emptys = []; - - // getperformanceSsourceNames() { - // this.myhttp.getperformanceSourceNames(this.currentPage, this.pageSize, this.sourceName).subscribe((data) => { - // this.totalRecords = data.totalRecords; - // this.vnfsdataTotal = data.names; - // if (Number.isInteger(this.totalRecords.length / 5)) { - // this.emptys = new Array(0); - // } else { - // this.emptys = new Array(5 - this.totalRecords.length % 5); - // } - // }) - // } - //Detail page title display - isHidden = true; - graphicshow = false; - detailshow = false; - // Show hidden animation - state = "show"; - state2 = "hide"; - state3 = "hide"; - performanceShow() { - this.state = 'show'; - this.state2 = 'hide'; - this.state3 = 'hide'; - this.graphicshow = false; - this.detailshow = false; - } - // Selected name - - graphicShow() { - this.state = 'hide'; - this.state2 = 'show'; - this.state3 = 'hide'; - this.graphicshow = true; - this.detailshow = false; - } - vnfname: string; - graphicShow2(item) { - this.state = 'hide'; - this.state2 = 'show'; - this.state3 = 'hide'; - this.graphicshow = true; - this.detailshow = false; - this.vnfname = item; - } - // Selected id - detailId: string; - detailShow(item) { - this.state = 'hide'; - this.state2 = 'hide'; - this.state3 = 'show'; - this.graphicshow = true; - this.detailshow = true; - this.detailId = item.id.id; - } -} |