summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/shared/components/customer/customer.component.html
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-08-22 16:55:57 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-08-22 16:56:09 +0800
commitd0f5347dc16b5aa9fc95eb520fbc9a1c7b672b09 (patch)
treeb3891d8de290d755d7f0f00d35bb77d3b89ad747 /usecaseui-portal/src/app/shared/components/customer/customer.component.html
parent56923755c761897cc86ca2457667fcc3e6a0e43f (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/shared/components/customer/customer.component.html')
-rw-r--r--usecaseui-portal/src/app/shared/components/customer/customer.component.html144
1 files changed, 144 insertions, 0 deletions
diff --git a/usecaseui-portal/src/app/shared/components/customer/customer.component.html b/usecaseui-portal/src/app/shared/components/customer/customer.component.html
new file mode 100644
index 00000000..08a23935
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/components/customer/customer.component.html
@@ -0,0 +1,144 @@
+<!--
+ 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.
+-->
+<div class="content">
+ <div class="chearts">
+ <div class="Cu">
+ <p> {{"i18nTextDefine_Instance_Count_of_Customer" | translate}} </p>
+ <app-pie [initData]="CUChartInit" [chartData]="CUChartData" *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 class="legend"></div><span> {{"i18nTextDefine_users" | translate}} </span> -->
+ </div>
+ <div class="type">
+ <p> {{"i18nTextDefine_Instance_Count_of_ServiceType" | translate}} </p>
+ <app-bar [initData]="serviceInit" [chartData]="serviceData"></app-bar>
+ <div class="footname" style="width: 100%;height: 40px;line-height: 40px;text-align: center;color: #3C4F8C;">
+ <img src="../../../../assets/images/customerBarUser.png" alt="customerName"
+ style="margin-right: 5px;margin-bottom: 3px;">
+ {{this.serviceInit["customer"]}}
+ </div>
+ </div>
+ </div>
+ <div class="customer">
+ <div class="customer_title">
+ <div class="customers">
+ <span> {{"i18nTextDefine_Customer" | translate}} </span>
+ <img src="../../../../assets/images/customer04.png" alt="" (click)="this.customeradd = !this.customeradd"
+ style="cursor: pointer">
+ </div>
+ </div>
+ <div class="customer_detail">
+ <div class="customer_add" *ngIf="customeradd">
+ <input nz-input placeholder=" {{'i18nTextDefine_Input_customerName' | translate}} " class="customer_name"
+ nzSize="default" [(ngModel)]="addNewCustomer">
+ <button nz-button nzType="primary" class="customer_addbut"
+ (click)="createNewCustomer(notificationModel)">{{"i18nTextDefine_Add" | translate}}</button>
+ </div>
+ <div class="customer_list">
+ <ul>
+ <li *ngFor="let item of AllCustomersdata,let i = index" [ngClass]="{active: chose ==i}"
+ (click)="choseCustomer(i,item)">
+ <img src="../../../../assets/images/customer05.png" alt="">
+ <span>{{item.name}}</span>
+ <i class="anticon anticon-delete" nzType="info" (click)="deleteCustomerModel(item)"></i>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div class="services_type">
+ <div class="services_type_title">
+ <div class="servicess">
+ <span> {{"i18nTextDefine_ServiceType" | translate}} </span>
+ <img src="../../../../assets/images/customer03.png" alt="" (click)="this.servicesadd = !this.servicesadd "
+ style="cursor: pointer">
+ </div>
+ </div>
+ <div class="services_type_detail">
+ <div class="services_add" *ngIf="servicesadd">
+ <input nz-input placeholder=" {{'i18nTextDefine_Input_ServicesType' | translate}} " class="services_name"
+ nzSize="default" [(ngModel)]="addNewServiceType">
+ <button nz-button nzType="primary" class="services_addbut"
+ (click)="createNewServiceType(notificationModel)">{{"i18nTextDefine_Add" | translate}}</button>
+ </div>
+ <div class="services_list">
+ <div class="border_size"></div>
+ <div style="padding:0 20px;">
+ <ul>
+ <li *ngFor="let item of AllServiceTypes">
+ <span>{{item.type}}</span>
+ <i class="anticon anticon-delete" nzType="info" (click)="deleteServiceTypeModel(item)"></i>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <nz-modal nzWidth="428" [(nzVisible)]="deleteCustomerModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} "
+ (nzOnCancel)="deleteCustomerCancel()" (nzOnOk)="deleteCustomerOk(notificationModel)" nzClassName="deleteModel"
+ nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " nzOkText=" {{'i18nTextDefine_modelOk' | translate}} ">
+ <h3><span style="color: red">*&nbsp;</span> {{"i18nTextDefine_Input_Sure_deleteCustomer" | translate}} </h3>
+ <div class="question">
+ <h4> {{"i18nTextDefine_CustomerName" | translate}} :</h4>
+ <div class="deleteModelContent">{{thisdeleteCustomer["name"]}}</div>
+ </div>
+ <div class="question">
+ <h4> {{"i18nTextDefine_CustomerID" | translate}} :</h4>
+ <div class="deleteModelContent">{{thisdeleteCustomer["id"]}}</div>
+ </div>
+ </nz-modal>
+ <nz-modal nzWidth="428" [(nzVisible)]="deleteServiceTypeModelVisible"
+ nzTitle=" {{'i18nTextDefine_delete' | translate}} " (nzOnCancel)="deleteServiceTypeCancel()"
+ (nzOnOk)="deleteServiceTypeOk(notificationModel)" nzClassName="deleteModel deleteServiceTypeModel"
+ nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " nzOkText=" {{'i18nTextDefine_modelOk' | translate}} ">
+ <h3><span style="color: red">*&nbsp;</span> {{"i18nTextDefine_Input_Sure_deleteServiceType" | translate}} </h3>
+ <div class="question">
+ <h4> {{"i18nTextDefine_CustomerName" | translate}} :</h4>
+ <div class="deleteModelContent">{{selectCustomer.name}}</div>
+ </div>
+ <div class="question">
+ <h4> {{"i18nTextDefine_CustomerID" | translate}} :</h4>
+ <div class="deleteModelContent">{{selectCustomer.id}}</div>
+ </div>
+ <div class="question">
+ <h4> {{"i18nTextDefine_ServiceType" | translate}} :</h4>
+ <div class="deleteModelContent">{{thisdeleteServiceType["type"]}}</div>
+ </div>
+ </nz-modal>
+ <!--2019.08.14 add notification-->
+ <ng-template #notificationModel>
+ <div class="ant-notification-notice-content">
+ <div class="ant-notification-notice-with-icon">
+ <span class="ant-notification-notice-icon">
+ <img src="{{this.notificationAttributes.imgPath}}" alt="{{notificationAttributes.status}}">
+ </span>
+ <div class="ant-notification-notice-message" *ngIf="notificationAttributes.title == 'Customer'">
+ {{"i18nTextDefine_"+notificationAttributes.title | translate}}&nbsp;
+ {{"i18nTextDefine_"+notificationAttributes.action | translate}}&nbsp;&nbsp;{{"i18nTextDefine_"+notificationAttributes.status | translate}}
+ </div>
+ <div class="ant-notification-notice-description">
+ <div class="notificationlist">
+ <p>{{"i18nTextDefine_"+notificationAttributes.title | translate}}:</p>
+ <span>{{ notificationAttributes.name }}</span>
+ </div>
+ </div>
+ <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div>
+ </div>
+ </div>
+ </ng-template>
+</div> \ No newline at end of file