summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-08-14 12:36:42 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-08-14 12:39:51 +0800
commit8ad7c581b715e43f364cc7ca23ea773530826bf7 (patch)
tree2da5300f4a7f03a6f052c84e277eec927248ba23 /usecaseui-portal/src
parent45fe372a7b7840b3d2c207e4b29bf7028f7df58d (diff)
feat:improve notification for Customer page
Change-Id: Ic1b37d7f1d67df132514a7acf93c1b748a8446be Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src')
-rw-r--r--usecaseui-portal/src/app/components/customer/customer.component.html30
-rw-r--r--usecaseui-portal/src/app/components/customer/customer.component.ts97
2 files changed, 106 insertions, 21 deletions
diff --git a/usecaseui-portal/src/app/components/customer/customer.component.html b/usecaseui-portal/src/app/components/customer/customer.component.html
index fea9dfdf..04975e41 100644
--- a/usecaseui-portal/src/app/components/customer/customer.component.html
+++ b/usecaseui-portal/src/app/components/customer/customer.component.html
@@ -40,7 +40,7 @@
<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()">{{"i18nTextDefine_Add" | translate}}</button>
+ <button nz-button nzType="primary" class="customer_addbut" (click) = "createNewCustomer(notificationModel)">{{"i18nTextDefine_Add" | translate}}</button>
</div>
<div class="customer_list">
<ul>
@@ -63,7 +63,7 @@
<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()">{{"i18nTextDefine_Add" | translate}}</button>
+ <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>
@@ -80,7 +80,7 @@
</div>
<nz-modal nzWidth="428" [(nzVisible)]="deleteCustomerModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} " (nzOnCancel)="deleteCustomerCancel()"
- (nzOnOk)="deleteCustomerOk()" nzClassName="deleteModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " nzOkText=" {{'i18nTextDefine_modelOk' | translate}} ">
+ (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>
@@ -92,7 +92,7 @@
</div>
</nz-modal>
<nz-modal nzWidth="428" [(nzVisible)]="deleteServiceTypeModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} " (nzOnCancel)="deleteServiceTypeCancel()"
- (nzOnOk)="deleteServiceTypeOk()" nzClassName="deleteModel deleteServiceTypeModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " nzOkText=" {{'i18nTextDefine_modelOk' | translate}} ">
+ (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>
@@ -107,5 +107,25 @@
<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
diff --git a/usecaseui-portal/src/app/components/customer/customer.component.ts b/usecaseui-portal/src/app/components/customer/customer.component.ts
index f59f72bf..d4d843ff 100644
--- a/usecaseui-portal/src/app/components/customer/customer.component.ts
+++ b/usecaseui-portal/src/app/components/customer/customer.component.ts
@@ -13,9 +13,9 @@
See the License for the specific language governing permissions and
limitations under the License.
*/
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit, TemplateRef} from '@angular/core';
import { ManagemencsService } from '../../managemencs.service';
-
+import { NzNotificationService } from 'ng-zorro-antd';
@Component({
selector: 'app-customer',
templateUrl: './customer.component.html',
@@ -24,7 +24,11 @@ import { ManagemencsService } from '../../managemencs.service';
export class CustomerComponent implements OnInit {
public chose = '';
- constructor(private managemencs: ManagemencsService) { }
+ constructor(
+ private managemencs: ManagemencsService,
+ private notification: NzNotificationService
+ ) {
+ }
ngOnInit() {
this.getAllCustomers();
@@ -43,7 +47,28 @@ export class CustomerComponent implements OnInit {
addNewServiceType = null;
deleteCustomerModelVisible = false;
deleteServiceTypeModelVisible = false;
-
+ //2019.08.14 add
+ notificationAttributes = {
+ "title":"Customer",
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"Create",
+ "status":"InProgress",
+ "name":""
+ };
+ notificationModelShow(template: TemplateRef<{}>): void {
+ console.log(this.notificationAttributes,"notificationModelShow show");
+ this.notification.template(template);
+ }
+ notificationSuccess(notificationModel){
+ this.notificationAttributes.imgPath = "../../../assets/images/execute-success.png";
+ this.notificationAttributes.status = "Success";
+ this.notificationModelShow(notificationModel);
+ }
+ notificationFailed(notificationModel){
+ this.notificationAttributes.imgPath = "../../../assets/images/execute-faild.png";
+ this.notificationAttributes.status = "Failed";
+ this.notificationModelShow(notificationModel);
+ }
getAllCustomers() {
this.managemencs.getAllCustomers().subscribe((data) => {
this.AllCustomersdata = data.map((item) => {
@@ -359,18 +384,28 @@ export class CustomerComponent implements OnInit {
})
}
- createNewCustomer() {
+ createNewCustomer(notificationModel) {
let createParams = {
customerId: this.addNewCustomer,
'global-customer-id':this.addNewCustomer,
'subscriber-name':this.addNewCustomer,
'subscriber-type':'INFRA'
};
+ this.notificationAttributes = {
+ "title":"Customer",
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"Create",
+ "status":"InProgress",
+ "name":this.addNewCustomer
+ };
+ this.notificationModelShow(notificationModel);
this.managemencs.createCustomer(this.addNewCustomer, createParams).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
+ this.notificationSuccess(notificationModel);
this.getAllCustomers();
console.log(data, "Interface returned success")
} else {
+ this.notificationFailed(notificationModel);
console.log(data, "Interface returned error")
}
})
@@ -388,48 +423,68 @@ export class CustomerComponent implements OnInit {
deleteCustomerCancel() {
this.deleteCustomerModelVisible = false;
}
- deleteCustomerOk() {
+ deleteCustomerOk(notificationModel) {
this.deleteCustomerModelVisible = false;
- this.getCustomerVersion(this.thisdeleteCustomer);
+ this.getCustomerVersion(this.thisdeleteCustomer,notificationModel);
+ this.notificationAttributes = {
+ "title":"Customer",
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"delete",
+ "status":"InProgress",
+ "name":this.thisdeleteCustomer.name
+ };
+ this.notificationModelShow(notificationModel);
}
- getCustomerVersion(thisdeleteCustomer){
+ getCustomerVersion(thisdeleteCustomer,notificationModel){
this.managemencs.getdeleteCustomerVersion(thisdeleteCustomer).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
let params = {
customerId:thisdeleteCustomer.id,
version:data["result"]["resource-version"]
};
- this.deleteCustomer(params);
+ this.deleteCustomer(params,notificationModel);
console.log(data, "Interface returned success")
} else {
console.log(data, "Interface returned error")
}
})
}
- deleteCustomer(params){
+ deleteCustomer(params,notificationModel){
this.managemencs.deleteSelectCustomer(params).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
+ this.notificationSuccess(notificationModel);
this.getAllCustomers();
console.log(data, "Interface returned success")
} else {
+ this.notificationFailed(notificationModel);
console.log(data, "Interface returned error")
}
})
}
- createNewServiceType() {
+ createNewServiceType(notificationModel) {
let createParams = {
customer: this.selectCustomer,
ServiceType: this.addNewServiceType,
"service-type":this.addNewServiceType,
"temp-ub-sub-account-id":"sotnaccount"
};
+ this.notificationAttributes = {
+ "title":"ServiceType",
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"Create",
+ "status":"InProgress",
+ "name":this.addNewServiceType
+ };
+ this.notificationModelShow(notificationModel);
this.managemencs.createServiceType(createParams).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
+ this.notificationSuccess(notificationModel);
this.getCustomersColumn(this.selectCustomer);
this.getAllCustomers();
console.log(data, "Interface returned success")
} else {
+ this.notificationFailed(notificationModel);
console.log(data, "Interface returned error")
}
})
@@ -446,15 +501,23 @@ export class CustomerComponent implements OnInit {
deleteServiceTypeCancel() {
this.deleteServiceTypeModelVisible = false;
}
- deleteServiceTypeOk() {
+ deleteServiceTypeOk(notificationModel) {
this.deleteServiceTypeModelVisible = false;
- this.getServiceTypeVersion();
+ this.getServiceTypeVersion(notificationModel);
}
- getServiceTypeVersion() {
+ getServiceTypeVersion(notificationModel) {
let paramss = {
customerId: this.selectCustomer,
ServiceType: this.thisdeleteServiceType["type"]
};
+ this.notificationAttributes = {
+ "title":"ServiceType",
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"delete",
+ "status":"InProgress",
+ "name":this.thisdeleteServiceType["type"]
+ };
+ this.notificationModelShow(notificationModel);
this.managemencs.getdeleteServiceTypeVersion(paramss).subscribe((data) => {
console.log(data)
if (data["status"] == 'SUCCESS') {
@@ -463,21 +526,23 @@ export class CustomerComponent implements OnInit {
ServiceType:this.thisdeleteServiceType["type"],
version:data["result"]["resource-version"]
};
- this.deleteServiceType(params);
+ this.deleteServiceType(params,notificationModel);
console.log(data, "Interface returned success")
} else {
console.log(data, "Interface returned error")
}
})
}
- deleteServiceType(params){
+ deleteServiceType(params,notificationModel){
this.managemencs.deleteSelectServiceType(params).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
+ this.notificationSuccess(notificationModel);
this.getServiceTypes(params.customerId);
this.getCustomersColumn(params.customerId);
this.getAllCustomers();
console.log(data, "Interface returned success")
} else {
+ this.notificationFailed(notificationModel);
console.log(data, "Interface returned error")
}
})