summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-10-11 09:57:03 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-10-11 09:57:18 +0800
commit8bc1e72e2874e5734965fd4647dc7fb682d4dd98 (patch)
treec66d252d2f7a0fc0a50f066e85255d9b8c63d60d /usecaseui-portal/src
parent97832708ef615e7c32413e3c462ea669d5856450 (diff)
feat: extract the public notification component
Change-Id: I0e42ddf844e92b986d9bc1748dfc06b202d37f2b Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src')
-rw-r--r--usecaseui-portal/src/app/app.module.ts6
-rw-r--r--usecaseui-portal/src/app/shared/components/notification/notification.component.html20
-rw-r--r--usecaseui-portal/src/app/shared/components/notification/notification.component.less0
-rw-r--r--usecaseui-portal/src/app/shared/components/notification/notification.component.spec.ts25
-rw-r--r--usecaseui-portal/src/app/shared/components/notification/notification.component.ts33
-rw-r--r--usecaseui-portal/src/app/views/management/customer/customer.component.html30
-rw-r--r--usecaseui-portal/src/app/views/management/customer/customer.component.ts58
7 files changed, 109 insertions, 63 deletions
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index 9aaa7ebf..07080bbc 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -75,6 +75,8 @@ import { TestComponent } from './test/test.component';
import { TextService } from './core/services/text.service';
import { TopCardComponent } from './views/services/services-list/top-card/top-card.component';
import { CreateModelComponent } from './views/services/services-list/create-model/create-model.component';
+// import { DeleteModalComponent } from './views/services/services-list/delete-modal/delete-modal.component';
+import { NotificationComponent } from './shared/components/notification/notification.component';
@NgModule({
providers: [
@@ -116,7 +118,9 @@ import { CreateModelComponent } from './views/services/services-list/create-mode
FcapsComponent,
TestComponent,
TopCardComponent,
- CreateModelComponent
+ CreateModelComponent,
+ // DeleteModalComponent,
+ NotificationComponent
],
imports: [
BrowserModule,
diff --git a/usecaseui-portal/src/app/shared/components/notification/notification.component.html b/usecaseui-portal/src/app/shared/components/notification/notification.component.html
new file mode 100644
index 00000000..97f66ba5
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/components/notification/notification.component.html
@@ -0,0 +1,20 @@
+<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>
diff --git a/usecaseui-portal/src/app/shared/components/notification/notification.component.less b/usecaseui-portal/src/app/shared/components/notification/notification.component.less
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/components/notification/notification.component.less
diff --git a/usecaseui-portal/src/app/shared/components/notification/notification.component.spec.ts b/usecaseui-portal/src/app/shared/components/notification/notification.component.spec.ts
new file mode 100644
index 00000000..69192c5e
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/components/notification/notification.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NotificationComponent } from './notification.component';
+
+describe('NotificationComponent', () => {
+ let component: NotificationComponent;
+ let fixture: ComponentFixture<NotificationComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ NotificationComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(NotificationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/usecaseui-portal/src/app/shared/components/notification/notification.component.ts b/usecaseui-portal/src/app/shared/components/notification/notification.component.ts
new file mode 100644
index 00000000..031b161d
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/components/notification/notification.component.ts
@@ -0,0 +1,33 @@
+import { Component, OnInit, ViewChild, TemplateRef } from '@angular/core';
+import { NzNotificationService } from 'ng-zorro-antd';
+
+@Component({
+ selector: 'app-notification',
+ templateUrl: './notification.component.html',
+ styleUrls: ['./notification.component.less']
+})
+export class NotificationComponent implements OnInit {
+ @ViewChild('notificationModel')notificationModel: any;
+
+ notificationAttributes: object = null;
+
+ constructor(private notification: NzNotificationService) { }
+
+ ngOnInit() {
+ }
+
+ setNotification({ title, imgPath, action, status, name }):void{
+ this.notificationAttributes = { title, imgPath, action, status, name }
+ }
+ notificationSuccess(title: string, action: string, name: string): void {
+ this.notification.remove()
+ this.setNotification({ title, imgPath: "assets/images/execute-success.png", action, status: 'Success', name })
+ this.notification.template(this.notificationModel);
+ }
+ notificationFailed(title: string, action: string, name: string): void {
+ this.notification.remove()
+ this.setNotification({ title, imgPath: "assets/images/execute-faild.png", action, status: 'Failed', name })
+ this.notification.template(this.notificationModel)
+ }
+
+}
diff --git a/usecaseui-portal/src/app/views/management/customer/customer.component.html b/usecaseui-portal/src/app/views/management/customer/customer.component.html
index 4f532f8f..0f033e47 100644
--- a/usecaseui-portal/src/app/views/management/customer/customer.component.html
+++ b/usecaseui-portal/src/app/views/management/customer/customer.component.html
@@ -41,7 +41,7 @@
<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>
+ (click)="createNewCustomer()">{{"i18nTextDefine_Add" | translate}}</button>
</div>
<div class="customer_list">
<ul>
@@ -67,7 +67,7 @@
<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>
+ (click)="createNewServiceType()">{{"i18nTextDefine_Add" | translate}}</button>
</div>
<div class="services_list_content">
<div class="border_size"></div>
@@ -84,7 +84,7 @@
</div>
<nz-modal nzWidth="428" [(nzVisible)]="deleteCustomerModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} "
- (nzOnCancel)="deleteCustomerCancel()" (nzOnOk)="deleteCustomerOk(notificationModel)" nzClassName="deleteModel"
+ (nzOnCancel)="deleteCustomerCancel()" (nzOnOk)="deleteCustomerOk()" 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">
@@ -98,7 +98,7 @@
</nz-modal>
<nz-modal nzWidth="428" [(nzVisible)]="deleteServiceTypeModelVisible"
nzTitle=" {{'i18nTextDefine_delete' | translate}} " (nzOnCancel)="deleteServiceTypeCancel()"
- (nzOnOk)="deleteServiceTypeOk(notificationModel)" nzClassName="deleteModel deleteServiceTypeModel"
+ (nzOnOk)="deleteServiceTypeOk()" 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">
@@ -114,25 +114,5 @@
<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>
+ <app-notification #notification></app-notification>
</div> \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/management/customer/customer.component.ts b/usecaseui-portal/src/app/views/management/customer/customer.component.ts
index 39c42a0d..20cebccb 100644
--- a/usecaseui-portal/src/app/views/management/customer/customer.component.ts
+++ b/usecaseui-portal/src/app/views/management/customer/customer.component.ts
@@ -15,7 +15,6 @@
*/
import { Component, OnInit, ViewChild } from '@angular/core';
import { ManagemencsService } from '../../../core/services/managemencs.service';
-import { NzNotificationService } from 'ng-zorro-antd';
import { Observable } from 'rxjs';
@Component({
@@ -26,12 +25,12 @@ import { Observable } from 'rxjs';
export class CustomerComponent implements OnInit {
@ViewChild('chart') chart;
@ViewChild('pie') pie;
+ @ViewChild('notification')notification:any;
public chose = '';
resizeMark;
constructor(
private managemencs: ManagemencsService,
- private notification: NzNotificationService
) {
}
@@ -63,21 +62,6 @@ export class CustomerComponent implements OnInit {
addNewServiceType = null;
deleteCustomerModelVisible = false;
deleteServiceTypeModelVisible = false;
- //2019.08.14 add
- notificationAttributes = null;
- setNotification({ title, imgPath, action, status, name }):void{
- this.notificationAttributes = { title, imgPath, action, status, name }
- }
- notificationSuccess(notificationModel,title,action,name) {
- this.notification.remove()
- this.setNotification({ title, imgPath: "assets/images/execute-success.png", action, status: 'Success', name })
- this.notification.template(notificationModel);
- }
- notificationFailed(notificationModel,title,action,name) {
- this.notification.remove()
- this.setNotification({ title, imgPath: "assets/images/execute-faild.png", action, status: 'Failed', name })
- this.notification.template(notificationModel)
- }
getAllCustomers() {
this.managemencs.getAllCustomers().subscribe((data) => {
this.AllCustomersdata = data.map((item) => {
@@ -383,7 +367,7 @@ export class CustomerComponent implements OnInit {
})
}
- createNewCustomer(notificationModel) {
+ createNewCustomer(): void {
let createParams = {
customerId: this.addNewCustomer,
'global-customer-id': this.addNewCustomer,
@@ -392,10 +376,10 @@ export class CustomerComponent implements OnInit {
};
this.managemencs.createCustomer(this.addNewCustomer, createParams).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
- this.notificationSuccess(notificationModel,'Customer','Create',this.addNewCustomer);
+ this.notification.notificationSuccess('Customer','Create',this.addNewCustomer);
this.getAllCustomers();
} else {
- this.notificationFailed(notificationModel,'Customer','Create',this.addNewCustomer);
+ this.notification.notificationFailed('Customer','Create',this.addNewCustomer);
}
})
}
@@ -412,35 +396,35 @@ export class CustomerComponent implements OnInit {
deleteCustomerCancel() {
this.deleteCustomerModelVisible = false;
}
- deleteCustomerOk(notificationModel) {
+ deleteCustomerOk() {
this.deleteCustomerModelVisible = false;
- this.getCustomerVersion(this.thisdeleteCustomer, notificationModel);
+ this.getCustomerVersion(this.thisdeleteCustomer,);
}
- getCustomerVersion(thisdeleteCustomer, notificationModel) {
+ getCustomerVersion(thisdeleteCustomer) {
this.managemencs.getdeleteCustomerVersion(thisdeleteCustomer).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
let params = {
customerId: thisdeleteCustomer.id,
resourceVersion: data["result"]["resource-version"]
};
- this.deleteCustomer(params, notificationModel)
+ this.deleteCustomer(params)
} else {
console.error(data, "Interface returned error")
}
})
}
- deleteCustomer(paramsObj, notificationModel) {
+ deleteCustomer(paramsObj) {
this.managemencs.deleteSelectCustomer(paramsObj).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
- this.notificationSuccess(notificationModel,'Customer','delete',this.thisdeleteCustomer.name);
+ this.notification.notificationSuccess('Customer','delete',this.thisdeleteCustomer.name);
this.getAllCustomers();
} else {
- this.notificationFailed(notificationModel,'Customer','delete',this.thisdeleteCustomer.name);
+ this.notification.notificationFailed('Customer','delete',this.thisdeleteCustomer.name);
}
})
}
- createNewServiceType(notificationModel) {
+ createNewServiceType() {
let createParams = {
customer: this.selectCustomer,
ServiceType: this.addNewServiceType,
@@ -449,10 +433,10 @@ export class CustomerComponent implements OnInit {
};
this.managemencs.createServiceType(createParams).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
- this.notificationSuccess(notificationModel,'ServiceType','Create',this.addNewServiceType);
+ this.notification.notificationSuccess('ServiceType','Create',this.addNewServiceType);
this.getAllCustomers();
} else {
- this.notificationFailed(notificationModel,'ServiceType','Create',this.addNewServiceType);
+ this.notification.notificationFailed('ServiceType','Create',this.addNewServiceType);
}
})
}
@@ -468,11 +452,11 @@ export class CustomerComponent implements OnInit {
deleteServiceTypeCancel() {
this.deleteServiceTypeModelVisible = false;
}
- deleteServiceTypeOk(notificationModel) {
+ deleteServiceTypeOk() {
this.deleteServiceTypeModelVisible = false;
- this.getServiceTypeVersion(notificationModel);
+ this.getServiceTypeVersion();
}
- getServiceTypeVersion(notificationModel) {
+ getServiceTypeVersion() {
let paramss = {
customerId: this.selectCustomer,
ServiceType: this.thisdeleteServiceType["type"]
@@ -484,19 +468,19 @@ export class CustomerComponent implements OnInit {
ServiceType: this.thisdeleteServiceType["type"],
version: data["result"]["resource-version"]
};
- this.deleteServiceType(params, notificationModel);
+ this.deleteServiceType(params);
} else {
console.error(data, "Interface returned error")
}
})
}
- deleteServiceType(params, notificationModel) {
+ deleteServiceType(params) {
this.managemencs.deleteSelectServiceType(params).subscribe((data) => {
if (data["status"] == 'SUCCESS') {
- this.notificationSuccess(notificationModel,'ServiceType','delete',this.thisdeleteServiceType["type"]);
+ this.notification.notificationSuccess('ServiceType','delete',this.thisdeleteServiceType["type"]);
this.getAllCustomers();
} else {
- this.notificationFailed(notificationModel,'ServiceType','delete',this.thisdeleteServiceType["type"]);
+ this.notification.notificationFailed('ServiceType','delete',this.thisdeleteServiceType["type"]);
}
})
}