diff options
Diffstat (limited to 'usecaseui-portal/src/app/views/home/home.component.html')
| -rw-r--r-- | usecaseui-portal/src/app/views/home/home.component.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/usecaseui-portal/src/app/views/home/home.component.html b/usecaseui-portal/src/app/views/home/home.component.html new file mode 100644 index 00000000..4126f241 --- /dev/null +++ b/usecaseui-portal/src/app/views/home/home.component.html @@ -0,0 +1,102 @@ +<!-- + 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> |