From d0f5347dc16b5aa9fc95eb520fbc9a1c7b672b09 Mon Sep 17 00:00:00 2001 From: cyuamber Date: Thu, 22 Aug 2019 16:55:57 +0800 Subject: feat: change the project structure and add mock data function Change-Id: I381845bff5eb37d1fab3eba8cf1ae7838df523b7 Issue-ID: USECASEUI-307 Signed-off-by: cyuamber --- .../graphiclist/graphiclist.component.css | 91 -------------- .../graphiclist/graphiclist.component.html | 55 --------- .../graphiclist/graphiclist.component.less | 137 --------------------- .../graphiclist/graphiclist.component.spec.ts | 25 ---- .../graphiclist/graphiclist.component.ts | 78 ------------ 5 files changed, 386 deletions(-) delete mode 100644 usecaseui-portal/src/app/components/graphiclist/graphiclist.component.css delete mode 100644 usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html delete mode 100644 usecaseui-portal/src/app/components/graphiclist/graphiclist.component.less delete mode 100644 usecaseui-portal/src/app/components/graphiclist/graphiclist.component.spec.ts delete mode 100644 usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts (limited to 'usecaseui-portal/src/app/components/graphiclist') diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.css b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.css deleted file mode 100644 index 2f6519c4..00000000 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.css +++ /dev/null @@ -1,91 +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. -*/ -.content .title { - border-radius: 5px 5px 0 0; - background-color: #fff; - height: 106px; - border-bottom: 1px solid #f0f0f0; - margin-bottom: 0; -} -.content .title ul { - display: flex; - display: -webkit-flex; - justify-content: space-around; - align-items: center; - padding: 0; - margin: 0; - height: 100%; -} -.content .title ul li { - list-style: none; - padding-left: 32px; - width: 100%; - border-left: 1px solid #eceff4; -} -.content .title ul li h5 { - font: 500 14px "Arial"; - color: #3d4d65; -} -.content .title ul li p { - font: 500 24px "Arial"; - color: #3fa8eb; - margin-bottom: 0; -} -.content .title ul li:nth-child(1) { - border: none; -} -.content .chart { - position: relative; - border-radius: 5px; - margin-bottom: 20px; - height: 70px; -} -.content .chart .select { - padding: 20px 20px 20px 0px; - width: 70%; - float: left; -} -.content .chart .select span { - display: inline-block; - font: 700 14px "Arial"; - color: #4c5e70; -} -.content .chart .select .search { - margin-left: 20px; - height: 30px; - padding: 0 10px; -} -.content .chart .select .search span { - color: #fff; - font-weight: 400; -} -.content .tablelist { - background-color: #fff; - padding: 24px 10px 0px; - border-radius: 0 0 5px 5px; -} -.content .tablelist .action { - padding: 10px 0 0 20px; -} -.content .tablelist .action .details { - display: inline-block; - width: 16px; - height: 16px; - background: url(../../../assets/images/icon.png) center -113px; -} -.content .tablelist .action .details:hover { - background: url(../../../assets/images/icon.png) no-repeat center -128px; -} diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html deleted file mode 100644 index 317d48b0..00000000 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.html +++ /dev/null @@ -1,55 +0,0 @@ - -
- -
-
- Report Time: - - - -
-
-
- - - - NO - Source Name - Event Name - ReportingEntityName - Report Time - Action - - - - - - {{i+1}} - {{item.sourceName}} - {{item.eventName}} - {{item.reportingEntityName}} - {{item.startEpochMicrosec | date:'yyyy-MM-dd HH:mm:ss'}} - - - - - -
-
\ No newline at end of file diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.less b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.less deleted file mode 100644 index 24e92fbd..00000000 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.less +++ /dev/null @@ -1,137 +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. -*/ -.content { - .title { - border-radius: 5px 5px 0 0; - background-color: #fff; - height: 106px; - border-bottom: 1px solid #f0f0f0; - margin-bottom: 0; - ul { - display: flex; - display: -webkit-flex; - justify-content: space-around; - align-items: center; - padding: 0; - margin: 0; - height: 100%; - li { - list-style: none; - padding-left: 32px; - width: 100%; - border-left: 1px solid #eceff4; - h5 { - font: 500 14px "Arial"; - color: #3d4d65; - } - p { - font: 500 24px "Arial"; - color: #3fa8eb; - margin-bottom: 0; - } - } - li:nth-child(1){ - border: none; - } - } - } - .chart { - // background-color: #fff; - position: relative; - border-radius: 5px; - margin-bottom: 20px; - height: 70px; - .select { - padding: 20px 20px 20px 0px; - width: 70%; - float: left; - span { - display: inline-block; - font: 700 14px "Arial"; - color: #4c5e70; - } - .search { - margin-left: 20px; - height: 30px; - padding: 0 10px; - span { - color: #fff; - font-weight: 400; - } - } - // nz-dropdown { - // margin-right: 20px; - // a { - // font: 700 12px "Arial"; - // color: #3d4d65; - // &:hover { - // color: #3fa8eb; - // } - // } - // } - } - // .AlarmChart { - // // height: 0px; - // // border-bottom: 1px solid #f5f5f5; - // // transition: all 0.3s linear; - // width: 25%; - // padding-top: 7px; - // float: left; - // } - // .alarmChart-active { - // height: 386px; - // } - // .open-close { - // width: 50px; - // height: 25px; - // position: absolute; - // left: 50%; - // bottom: 0px; - // transform: translate(-25px,0); - // border: none; - // outline: none; - // cursor: pointer; - // background-color: #fff; - // background: url(../../../assets/images/open-close.png) no-repeat center -27px; - // &:hover { - // background: url(../../../assets/images/open-close.png) no-repeat center -79px; - // } - // } - // .open-close-active { - // background: url(../../../assets/images/open-close.png) center -1px; - // &:hover { - // background: url(../../../assets/images/open-close.png) no-repeat center -53px; - // } - // } - } - .tablelist { - background-color: #fff; - padding: 24px 10px 0px; - border-radius: 0 0 5px 5px; - .action{ - padding: 10px 0 0 20px; - .details{ - display: inline-block; - width: 16px; - height: 16px; - background: url(../../../assets/images/icon.png) center -113px; - &:hover { - background: url(../../../assets/images/icon.png) no-repeat center -128px; - } - } - } - } -} \ No newline at end of file diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.spec.ts b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.spec.ts deleted file mode 100644 index 013db38a..00000000 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { GraphiclistComponent } from './graphiclist.component'; - -describe('GraphiclistComponent', () => { - let component: GraphiclistComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ GraphiclistComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(GraphiclistComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts b/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts deleted file mode 100644 index ccffac08..00000000 --- a/usecaseui-portal/src/app/components/graphiclist/graphiclist.component.ts +++ /dev/null @@ -1,78 +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, Input, Output, EventEmitter, HostBinding } from '@angular/core'; -import { HomesService } from '../../homes.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'], - 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: HomesService) { } - isVisibleMiddle = false; - - showModalMiddle(): void { - this.isVisibleMiddle = true; - } - handleOkMiddle(): void { - // console.log('click ok'); - this.isVisibleMiddle = false; - } - handleCancelMiddle(): void { - this.isVisibleMiddle = false; - } - - ngOnInit() { - } - ngOnChanges(changes){ - this.getPerformanceFormData(); - } - getPerformanceFormData() { - this.myhttp.getPerformanceFormData(this.currentPage, this.pageSize, this.vnfname, this.startTime, this.endTime).subscribe((data) => { - this.list = data.performances; - }) - } - // Date screening - dateRange = [ addDays(new Date(), -30), new Date() ]; - - onChange(result: Date): void { - 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){ - } - @Input () vnfname; - @Output() detailData = new EventEmitter(); - detailShow(id){ - let prems = { - id:id, - detailShow: true - } - this.detailData.emit(prems); - - } - -} -- cgit 1.2.3-korg