summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/home
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src/app/home')
-rw-r--r--usecaseui-portal/src/app/home/home.component.css158
-rw-r--r--usecaseui-portal/src/app/home/home.component.html102
-rw-r--r--usecaseui-portal/src/app/home/home.component.less265
-rw-r--r--usecaseui-portal/src/app/home/home.component.spec.ts42
-rw-r--r--usecaseui-portal/src/app/home/home.component.ts531
5 files changed, 0 insertions, 1098 deletions
diff --git a/usecaseui-portal/src/app/home/home.component.css b/usecaseui-portal/src/app/home/home.component.css
deleted file mode 100644
index 41b3f5fe..00000000
--- a/usecaseui-portal/src/app/home/home.component.css
+++ /dev/null
@@ -1,158 +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;
-}
-.content .services {
- float: left;
- background-color: #fff;
- width: 30%;
- height: 628px;
- border-radius: 5px;
- padding: 28px 22px;
-}
-.content .services h4 {
- font: 600 16px/16px "Arial";
- color: #3d4d65;
- margin-bottom: 58px;
-}
-.content .services h3 {
- font: 400 48px/48px "Arial";
- color: #3fa8eb;
- text-align: center;
-}
-.content .services h3 span {
- font-size: 14px;
-}
-.content .services p {
- font: 400 14px/14px "Arial";
- color: #54657e;
- text-align: center;
- margin-bottom: 48px;
-}
-.content .services .tip {
- background-color: #eceff4;
- color: #3d4d65;
- font-size: 16px;
- margin: 0 20px;
- height: 35px;
- line-height: 35px;
- border-radius: 5px;
-}
-.content .rightcontent {
- float: left;
- padding-left: 15px;
- width: 70%;
-}
-.content .rightcontent .rt-content {
- height: 220px;
- margin-bottom: 18px;
-}
-.content .rightcontent .rt-content .poerformance {
- float: left;
- margin-left: 2%;
- background-color: #fff;
- height: 100%;
- width: 50%;
- border-radius: 5px;
- padding: 28px 26px;
-}
-.content .rightcontent .rt-content .poerformance h4 {
- font: 600 16px/16px "Arial";
- color: #3d4d65;
- margin-bottom: 34px;
-}
-.content .rightcontent .rt-content .poerformance div {
- height: 57px;
- position: relative;
- margin-bottom: 10px;
-}
-.content .rightcontent .rt-content .poerformance div h3 {
- font: 600 25px/25px "Arial";
- color: #3d4d65;
- margin-bottom: 10px;
-}
-.content .rightcontent .rt-content .poerformance div p {
- font: 400 12px/12px "Arial";
- color: #54657e;
-}
-.content .rightcontent .rt-content .poerformance div img {
- position: absolute;
- top: 0;
- right: 0;
-}
-.content .rightcontent .rt-content .alarm {
- float: left;
- background-color: #fff;
- height: 100%;
- width: 48%;
- margin-left: 2%;
- border-radius: 5px;
- position: relative;
- padding: 28px 26px;
-}
-.content .rightcontent .rt-content .alarm h4 {
- position: absolute;
- font: 600 16px/16px "Arial";
- color: #3d4d65;
-}
-.content .rightcontent .rb-content {
- height: 390px;
- background-color: #fff;
- border-radius: 5px;
- padding: 24px 30px;
- position: relative;
-}
-.content .rightcontent .rb-content h4 {
- font: 600 16px/16px "Arial";
- color: #3d4d65;
-}
-.content .rightcontent .rb-content nz-dropdown {
- position: absolute;
- top: 24px;
- right: 30px;
-}
-.content .rightcontent .rb-content nz-dropdown button {
- width: 170px;
- height: 35px;
- background-color: #eceff4;
- text-align: left;
- border-color: #cad3df;
-}
-.content .rightcontent .rb-content nz-dropdown button span {
- display: inline-block;
- width: 120px;
- overflow: hidden;
- text-overflow: ellipsis;
- font-size: 14px;
-}
-.content .rightcontent .rb-content nz-dropdown button i {
- position: absolute;
- top: 12px;
- right: 12px;
-}
-.content .rightcontent .rb-content #pfVmChartLine {
- width: 100%;
- height: 318px;
-}
diff --git a/usecaseui-portal/src/app/home/home.component.html b/usecaseui-portal/src/app/home/home.component.html
deleted file mode 100644
index 4126f241..00000000
--- a/usecaseui-portal/src/app/home/home.component.html
+++ /dev/null
@@ -1,102 +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"> {{"Overall trend" | translate}}</h3>
-<hr> -->
-<div class="content">
- <div class="left-content">
- <div class="services">
- <h4>{{"i18nTextDefine_SERVICES" | translate}}</h4>
- <!-- <h3>{{serviceNumber}} <span>{{"services" | translate}}</span> </h3>
- <p>{{serviceNumber}} {{"services has been created" | translate}}</p> -->
- <app-pie [initData]="serviceChartInit" [chartData]="serviceChartData" *ngIf="serviceChart"></app-pie>
- <div *ngIf="!serviceChart"
- style="color: #ddd; font-weight: 700;font-size: 19px;height: 200px;text-align: center;line-height: 8;">No Service Instances </div>
-
- <div>
- <h5><span>{{"i18nTextDefine_Total" | translate}}:</span> {{serviceNumber}}
- <span>{{"i18nTextDefine_cutomers_and" | translate}}</span> {{serviceNumber}}
- <span>{{"i18nTextDefine_service_instance" | translate}}</span></h5>
- </div>
- <p class="tip">
- <span style="color:#3C4F8C" (click) = "goback_services()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
- </p>
- </div>
- <div class="PACKAGE">
- <h4>{{"i18nTextDefine_PACKAGE" | translate}}</h4>
- <div class="details">
- <li class="detailstoplinContent">
- <div class="detailstoplin">
- <div><span></span> NS</div>
- <div>
- <app-bar [initData]="serviceBarChartInit" [chartData]="servicesBarChartData"></app-bar>
- </div>
- <div>{{NSdata}}</div>
- </div>
- </li>
- <li class="detailstoplinContent">
- <div class="detailstoplin">
- <div><span style="background-color:#BCECB8;"></span> VNF</div>
- <div>
- <app-bar [initData]="serviceBarChartInit" [chartData]="servicesBarChartData1"></app-bar>
- </div>
- <div>{{Vnfdata}}</div>
- </div>
- </li>
- <li class="detailstoplinContent">
- <div class="detailstoplin">
- <div><span style="background-color:#ACCAF4;"></span> PNF</div>
- <div>
- <app-bar [initData]="serviceBarChartInit" [chartData]="servicesBarChartData2"></app-bar>
- </div>
- <div>{{PnfData}}</div>
- </div>
- </li>
- </div>
- <p class="tip">
- <span style="color:#3C4F8C" (click) = "goback_onboard()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
- </p>
- </div>
- </div>
- <div class="rightcontent" style="height: 96vh">
- <div class="rt-content">
- <div class="alarm">
- <h4>{{"i18nTextDefine_ALARM" | translate}}</h4>
- <app-pie [initData]="alarmChartInit" [chartData]="alarmChartData"></app-pie>
- <p class="alarm-name"> {{"i18nTextDefine_VNF_Alarm" | translate}} </p>
- </div>
- <div class="poerformance">
- <app-pie [initData]="VMAlarmChartInit" [chartData]="VMAlarmChartData"></app-pie>
- <p class="alarm-name"> {{"i18nTextDefine_VM_Alarm" | translate}} </p>
- <p class="tip">
- <a href="#" style="color:#3C4F8C">{{"i18nTextDefine_ViewDetails" | translate}}</a>
- </p>
- </div>
- </div>
- <div class="rb-content">
- <h4>{{"i18nTextDefine_VM_Performance" | translate}}</h4>
- <nz-dropdown [nzTrigger]="'click'" [nzPlacement]="'bottomRight'">
- <button nz-button nz-dropdown><span>{{sourceNameSelected}}</span> <i class="anticon anticon-down"></i></button>
- <ul nz-menu>
- <li nz-menu-item (click)="sourceNameSelect(item)" *ngFor="let item of sourceNameList">
- <a>{{item}}</a>
- </li>
- </ul>
- </nz-dropdown>
- <app-line [initData]="alarmLineChartInit" [chartData]="alarmLineChartData"></app-line>
- </div>
- </div>
-</div>
diff --git a/usecaseui-portal/src/app/home/home.component.less b/usecaseui-portal/src/app/home/home.component.less
deleted file mode 100644
index 9e768cf7..00000000
--- a/usecaseui-portal/src/app/home/home.component.less
+++ /dev/null
@@ -1,265 +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;
-// }
-.content {
- padding: 20px 20px;
- overflow: hidden;
- .left-content{
- float: left;
- width:30%;
- // height:96vh;
- .services,.PACKAGE{
- width: 100%;
- background:rgba(255,255,255,1);
- box-shadow:0px 10px 10px 2px rgba(222,222,222,0.5);
- border-radius:6px;
- padding: 28px 22px;
- h4{
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
- }
- .tip {
- float: right;
- width: 110px;
- line-height: 35px;
- border-radius: 5px;
- background-color: #eceff4;
- font-size: 16px;
- color: #3C4F8C;
- margin-top: 20px;
- margin-bottom: 0!important;
- }
- }
- .services{
- height:466px;
- h4{
- margin-bottom: 20px;
- }
- h5 {
- font: 500 18px/18px "ArialMT";
- color:#0DA9E2;
- margin: -2em 0 1em 0 ;
- display: -webkit-box;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 2;
- overflow: hidden;
- span {
- font-size: 14px;
- font-family: "Arial";
- color:#3C4F8C;
- }
- span:first-child {
- font-size: 18px;
- padding: 0 4PX 0 4px;
- }
- span:last-child {
- padding-left: 4px;
- }
-
- }
- }
- .PACKAGE{
- height:422px;
- margin-top: 20px;
- h4{
- margin-bottom: 50px;
- }
- .details {
- .detailstoplinContent{
- border-bottom:0.5px solid rgba(237,237,237,1);
- border-radius:4px;
- line-height: 45px;
- font-size: 14px;
- color: #3C4F8C;
- font-family:"ArialMT";
- .detailstoplin {
- width: 100%;
- height: 50px;
- border-top: 0.5px solid #ededed;
- border-radius: 4px;
- div:first-child{
- width: 20%;
- float: left;
- }
- div:nth-child(2){
- width: 65%;
- float: left;
- }
- div:last-child {
- width: 13%;
- float: right;
- font-size:12px;
- font-weight: 500;
- color:rgba(60,79,140,0.5);
- }
- }
- }
- }
-
- }
- }
- .services,.PACKAGE{
- h3 {
- font: 400 48px/48px "Arial";
- color: #3fa8eb;
- text-align: center;
- span {
- font-size: 14px;
- }
- }
-
- p {
- font: 400 14px/14px "Arial";
- color: #54657e;
- text-align: center;
- margin-bottom: 48px;
- }
- }
- .rightcontent {
- float: left;
- padding-left: 15px;
- width: 70%;
- .rt-content {
- height: 40%;
- margin-bottom: 18px;
- background:rgba(255,255,255,1);
- box-shadow:0px 10px 10px 2px rgba(222,222,222,0.5);
- border-radius:6px;
- .poerformance {
- float: left;
- background-color: #fff;
- height: 100%;
- width: 50%;
- border-radius: 5px;
- padding: 28px 26px;
- .pfVmPm {
- h3 {
- color:#BD57E5;
- }
- }
- h4 {
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
- margin-bottom: 34px;
- }
-
- div {
- height: 57px;
- position: relative;
- margin-bottom: 10px;
- h3 {
- font: 600 25px/25px "Arial";
- color: #2F6AEF;
- margin-bottom: 10px;
- padding-left: 50%;
- }
- p {
- font: 400 12px/12px "Arial";
- color:rgba(60,79,140,0.5);
- padding-left: 50%;
-
- }
- img {
- position: absolute;
- top: 0;
- left: 0;
- }
- }
- }
- .alarm {
- float: left;
- background-color: #fff;
- height: 100%;
- width: 48%;
- border-radius: 5px;
- position: relative;
- padding: 28px 26px;
- h4 {
- position: absolute;
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
- }
- }
- .alarm-name{
- text-align: center;
- margin-top: 15px;
- }
- .tip{
- width: 110px;
- background-color: #eceff4;
- color: #3C4F8C;
- font-size: 16px;
- float: right;
- margin-top: 20px;
- margin-bottom: 0!important;
- line-height: 35px;
- border-radius: 5px;
- text-align: center;
- }
- }
- .rb-content {
- position: relative;
- height: 58%;
- background-color: #fff;
- padding: 24px 30px;
- box-shadow:0px 10px 15px 2px rgba(222,222,222,0.5);
- border-radius:6px;
- h4 {
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
- }
- nz-dropdown {
- position: absolute;
- top: 24px;
- right: 30px;
- button {
- width: 170px;
- height: 35px;
- background-color: #eceff4;
- text-align: left;
- border-color: #cad3df;
- span {
- display: inline-block;
- width: 120px;
- overflow: hidden;
- text-overflow: ellipsis;
- font-size: 14px;
- }
- i {
- position: absolute;
- top: 12px;
- right: 12px;
- }
- }
- //下拉框中的样式在style.less中，下拉框是在body中额外临时生成的
- }
- #pfVmChartLine {
- width: 100%;
- height: 318px;
- }
- }
- }
-} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/home/home.component.spec.ts b/usecaseui-portal/src/app/home/home.component.spec.ts
deleted file mode 100644
index 9e463e65..00000000
--- a/usecaseui-portal/src/app/home/home.component.spec.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { TranslateModule, TranslateLoader, TranslateService, TranslateFakeLoader} from '@ngx-translate/core';
-import { NgZorroAntdModule } from 'ng-zorro-antd';
-import { NgxEchartsModule } from 'ngx-echarts';
-import { HttpClientModule } from '@angular/common/http';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { RouterTestingModule } from '@angular/router/testing';
-
-import { HomeComponent } from './home.component';
-import { PieComponent } from '../components/charts/pie/pie.component';
-import { BarComponent } from '../components/charts/bar/bar.component';
-import { LineComponent } from '../components/charts/line/line.component';
-import { HomesService } from '../homes.service';
-
-describe('HomeComponent', () => {
- let component: HomeComponent;
- let fixture: ComponentFixture<HomeComponent>;
-
- beforeEach(async(() => {
- TestBed.configureTestingModule({
- declarations: [ HomeComponent, PieComponent, BarComponent, LineComponent ],
- imports: [TranslateModule.forRoot({loader: { provide: TranslateLoader, useClass: TranslateFakeLoader }}),
- NgZorroAntdModule,
- NgxEchartsModule,
- HttpClientModule,
- BrowserAnimationsModule,
- RouterTestingModule],
- providers: [HomesService, TranslateService]
- })
- .compileComponents();
- }));
-
- beforeEach(() => {
- fixture = TestBed.createComponent(HomeComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
diff --git a/usecaseui-portal/src/app/home/home.component.ts b/usecaseui-portal/src/app/home/home.component.ts
deleted file mode 100644
index 2b1f6765..00000000
--- a/usecaseui-portal/src/app/home/home.component.ts
+++ /dev/null
@@ -1,531 +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 { slideToRight } from '../animates';
-import { TranslateService } from "@ngx-translate/core";
-import { Router } from '@angular/router';
-
-@Component({
- selector: 'app-home',
- templateUrl: './home.component.html',
- styleUrls: ['./home.component.less'],
- animations: [slideToRight]
-})
-export class HomeComponent implements OnInit {
- @HostBinding('@routerAnimate') routerAnimateState;
-
- constructor(private myhttp: HomesService, private router: Router) { }
-
- ngOnInit() {
- this.getListSortMasters();
- this.getSourceNames();
- this.getHomeServiceData();
- this.getHomeAlarmData();
- this.getHomeAlarmChartData();
- this.getHomeServiceBarNsData();
- this.getHomeServiceBarVnfData();
- this.getHomeServiceBarPnfData();
- }
-
-
- // services
- serviceNumber: number = 0;
- serviceChartData: Object;
- serviceChartInit: Object = {
- backgroundColor: '#fff',
- height: 200,
- option: {
- legend: {
- orient: 'vertical',
- left: '0px',
- bottom: '0px',
- data: ['Active', 'Closed']
- },
- color: ["#7AC0EF", "#6A86D8", "#748CDC", "#7277D4", "#7067CE", "#B9B0F7", "#7DCFF5"],
- series: [
- {
- name: "服务信息",
- radius: ['50%', '70%'],
- center: ['50%', '45%'],
- avoidLabelOverlap: false,
- label: {
- normal: {
- show: false,
- position: 'center'
- },
- emphasis: {
- show: true,
- formatter: '{b}\n{c}',
- textStyle: {
- fontSize: '18',
- fontWeight: 'bold'
- }
- }
- },
- labelLine: {
- normal: {
- show: false
- }
- },
- itemStyle: {
- normal: {
- borderWidth: 4,
- borderColor: "#fff"
- },
- emphasis: {
- borderWidth: 0
- }
- },
- }
- ]
- }
- };
- // gethomeServiceData
- serviceChart = true;
- getHomeServiceData() {
- this.myhttp.getHomeServiceData()
- .subscribe(
- (data) => {
- this.serviceNumber = data.serviceTotalNum;
- if (this.serviceNumber > 0) {
- this.serviceChart = true;
- } else {
- this.serviceChart = false;
- }
- this.serviceChartData = {
- series: [{ data: data.customerServiceList }]
- };
- },
- (err) => {
- console.log(err);
- }
- )
- }
-
- // VM alarm
- VMAlarmChartData: Object;
- VMAlarmChartInit: Object = {
- height: 180,
- option: {
- tooltip: {
- trigger: 'item',
- formatter: '{b}\n{c},{d}%'
- },
- color: [
- {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [{
- offset: 0, color: '#FB93C2' // 0% color
- }, {
- offset: 1, color: '#FB7788' // 100% color
- }],
- globalCoord: false
- }, {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [{
- offset: 0, color: '#A6BFE4' // 0% color
- }, {
- offset: 1, color: '#7A8BAE' // 100% color
- }],
- globalCoord: false
- }],
- series: [{
- name: "告警信息",
- radius: ['50%', '70%'],
- center: ['50%', '45%'],
- label: {
- normal: {
- show: false,
- },
- emphasis: {
- show: true,
- formatter: '{b}\n{c},{d}%',
- color: "#3C4F8C"
- }
- },
-
- }]
- }
- };
-
- // alarm bar
- alarmChartData: Object;
- alarmChartInit: Object = {
- height: 180,
- option: {
- tooltip: {
- trigger: 'item',
- formatter: '{b}\n{c},{d}%'
- },
- legend: {
- orient: 'vertical',
- left: '0px',
- bottom: '0px',
- itemWidth: 10,
- itemHeight: 10,
- textStyle: {
- color: "#3C4F8C"
- },
- data: ['Active', 'Fixed']
- },
- color: [
- {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [{
- offset: 0, color: '#FB93C2' // 0% color
- }, {
- offset: 1, color: '#FB7788' // 100% color
- }],
- globalCoord: false
- }, {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [{
- offset: 0, color: '#A6BFE4' // 0%
- }, {
- offset: 1, color: '#7A8BAE' // 100%
- }],
- globalCoord: false
- }],
- series: [{
- name: "告警信息",
- radius: '55%',
- center: ['50%', '45%'],
- label: {
- normal: {
- show: false,
- },
- emphasis: {
- show: true,
- formatter: '{b}\n{c},{d}%',
- color: "#3C4F8C"
- }
- }
- }]
- }
- };
-
- getHomeAlarmData() {
- this.myhttp.getHomeAlarmData()
- .subscribe((data) => {
- this.alarmChartData = {
- series: [{
- data: [{name: "Active", value: data[0]}, {name: "Fixed", value: data[1]}]
- }]
- };
- this.VMAlarmChartData = {
- series: [{
- data: [{name: "Active", value: data[0]}, {name: "Fixed", value: data[1]}]
- }]
- };
- })
- }
-
- // alarm line
- alarmLineChartData: Object;
- alarmLineChartInit: Object = {
- height: 320,
- option: {
- legend: {
- bottom: '0px',
- data: ['CPU', 'Memory', 'Disk']
- },
- xAxis: {
- data: []
- },
- series: [
- {
- name: 'CPU',
- type: 'line',
- itemStyle: {
- color: "#70ACEC"
- },
- data: []
- },
- {
- name: 'Memory',
- type: 'line',
- itemStyle: {
- color: "#3BCD79"
- },
- data: []
- },
- {
- name: 'Disk',
- type: 'line',
- itemStyle: {
- color: "#FDC288"
- },
- data: []
- }
- ]
- }
- };
-
- // services
- servicesBarChartData: Object;
- servicesBarChartData1: Object;
- servicesBarChartData2: Object;
- serviceBarChartInit: Object = {
- height: 40,
- width: 160,
- option: {
- tooltip: {
-
- },
- grid: {
-
- },
- xAxis: {
- type: 'value',
- show: false,
- min: 0,
- max: 100,
- axisTick: {
- show: false
- },
- },
- yAxis: {
- type: 'category',
- show: false,
- axisTick: {
- show: false
- }
- },
- series: [{
- type: 'bar',
- name: 'a',
- silent: true,
- animation: false,
- data: [],
- stack: 'income',
- barWidth: 12,
- itemStyle: {
- normal: {}
- },
- }, {
- type: 'bar',
- name: '',
- animation: false,
- silent: true,
- data: [100],
- tooltip: {
- show: false
- },
- stack: 'income',
- barWidth: 12,
- itemStyle: {
- normal: {
- color: '#fff',
- barBorderRadius: [10, 10, 10, 10]
- }
- },
- label: {
- normal: {
- show: false,
- }
- },
- }
- ]
- }
- }
-
-
- NSdata: number;
- Vnfdata: number;
- PnfData: number;
- getHomeServiceBarNsData() {
- this.myhttp.getHomeServiceBarNsData()
- .subscribe((data) => {
- this.NSdata = data.length;
- this.servicesBarChartData = {
- series: [
- {
- data: [this.NSdata],
- itemStyle: {
- normal: {
- color: {
- type: 'bar',
- colorStops: [{
- offset: 0,
- color: '#FDAC63'
- }, {
- offset: 1,
- color: '#FECE72'
- }],
- globalCoord: false,
- },
- barBorderRadius: [10, 10, 10, 10]
- }
- },
- },
- { data: [100] },
-
- ]
- }
- }, (err) => {
- console.log(err);
- })
- }
-
- getHomeServiceBarVnfData() {
- this.myhttp.getHomeServiceBarVnfData()
- .subscribe((data) => {
- this.Vnfdata = data.length;
- this.servicesBarChartData1 = {
- series: [
- {
- data: [this.Vnfdata],
- itemStyle: {
- normal: {
- color: {
- type: 'bar',
- colorStops: [{
- offset: 0,
- color: '#9AD09F'
- }, {
- offset: 1,
- color: '#BCECB8'
- }],
- globalCoord: false,
-
- },
- barBorderRadius: [10, 10, 10, 10]
- }
- },
- },
- { data: [100] },
- ]
- }
- }, (err) => {
- console.log(err);
- })
- }
-
- getHomeServiceBarPnfData() {
- this.myhttp.getHomeServiceBarPnfData()
- .subscribe((data) => {
- this.PnfData = data.length;
- this.servicesBarChartData2 = {
- series: [
- {
- data: [this.PnfData],
- itemStyle: {
- normal: {
- color: {
- type: 'bar',
- colorStops: [{
- offset: 0,
- color: '#71ADEF'
- }, {
- offset: 1,
- color: '#ACCAF4'
- }],
- globalCoord: false,
-
- },
- barBorderRadius: [10, 10, 10, 10]
- }
- },
- },
- { data: [100] },
- ]
- }
- }, (err) => {
- console.log(err);
- })
- }
- // sourceName
- sourceNameList = ['performanceNameOne'];
- sourceNameSelected = null;
-
-
- listSortMasters = null;
-
- getListSortMasters() {
- if (sessionStorage.getItem("DefaultLang") == undefined) {
- sessionStorage.setItem("DefaultLang", "en");
- }
- this.myhttp.getListSortMasters()
- .subscribe((data) => {
- this.listSortMasters = JSON.stringify(data);
- sessionStorage.setItem('listSortMasters', this.listSortMasters)
- })
- }
-
- getSourceNames() {
- this.myhttp.getSourceNames()
- .subscribe((data) => {
- this.sourceNameList = data;
- })
- }
- sourceNameSelect(item) {
- if (this.sourceNameSelected != 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.getHomeAlarmChartData(obj)
- .subscribe((data) => {
- this.alarmLineChartData = {
- xAxis: {
- data: data.dataList
- },
- series: [
- { data: data.allList },
- { data: data.ActiveList },
- { data: data.closedList }
- ]
- }
- }, (err) => {
- console.log(err);
- })
- }
-
- goback_services() {
- this.router.navigateByUrl('/services/services-list');
- }
- goback_onboard() {
- this.router.navigateByUrl('/services/onboard-vnf-vm');
- }
-
-}