summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/services/onboard-vnf-vm
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-10-11 11:21:34 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-10-11 11:21:45 +0800
commit3a32288d1a4053e3bf561766c35cf27d5a938b38 (patch)
treea0178d79b5a6f339222769c6aed9fc716a306744 /usecaseui-portal/src/app/views/services/onboard-vnf-vm
parent8bc1e72e2874e5734965fd4647dc7fb682d4dd98 (diff)
feat: extract the notification bar of the onboard page
Change-Id: I4fcc0a1a5d4372d8b95127e2baa125e95d2c006d Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/views/services/onboard-vnf-vm')
-rw-r--r--usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.html32
-rw-r--r--usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.ts59
2 files changed, 25 insertions, 66 deletions
diff --git a/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.html b/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.html
index d4429c0b..374afe0d 100644
--- a/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.html
+++ b/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.html
@@ -81,9 +81,9 @@
<td>{{item.nsdUsageState}}</td>
<td>
<i [ngClass]="{'cannotclick': isUpdate}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid,notificationModel)"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
*ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id,notificationModel)"
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
*ngIf="item.id"></i>
</td>
</tr>
@@ -98,9 +98,9 @@
<td>{{item.usageState}}</td>
<td>
<i [ngClass]="{'cannotclick': isUpdate}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid,notificationModel)"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.uuid)"
*ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id,notificationModel)"
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"
*ngIf="item.id"></i>
</td>
</tr>
@@ -113,31 +113,11 @@
<td>{{item.pnfdOnboardingState}}</td>
<td>{{item.pnfdUsageState}}</td>
<td>
- <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id,notificationModel)"></i>
+ <i class="anticon anticon-delete" (click)="showDeleteConfirm(item.id)"></i>
</td>
</tr>
</tbody>
</nz-table>
</nz-spin>
</div>
-<ng-template #notificationModel >
- <div class="ant-notification-notice-content">
- <div class="ant-notification-notice-with-icon">
- <span class="ant-notification-notice-icon">
- <img src="{{notificationAttributes.imgPath}}" alt="{{notificationAttributes.status}}">
- </span>
- <div class="ant-notification-notice-message">
- {{notificationAttributes.title}}&nbsp;
- {{"i18nTextDefine_"+notificationAttributes.action | translate}}&nbsp;&nbsp;{{"i18nTextDefine_"+notificationAttributes.status | translate}}
- </div>
- <div class="ant-notification-notice-description">
- <div class="notificationlist">
- <p>{{notificationAttributes.title}} id:&nbsp;</p>
- <span>{{ notificationAttributes.id }}</span>
- </div>
- </div>
- <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div>
- </div>
- </div>
-</ng-template>
-
+<app-notification #notification></app-notification> \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.ts b/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
index b57eab6a..3d312c5c 100644
--- a/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
+++ b/usecaseui-portal/src/app/views/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
@@ -14,8 +14,7 @@
limitations under the License.
*/
import { HttpClient, HttpRequest, HttpResponse } from '@angular/common/http';
-import { Component, OnInit, HostBinding, TemplateRef } from '@angular/core';
-import { NzNotificationService } from 'ng-zorro-antd';
+import { Component, OnInit, HostBinding, TemplateRef, ViewChild } from '@angular/core';
import { onboardService } from '../../../core/services/onboard.service';
import { slideToRight } from '../../../shared/utils/animates';
import { NzMessageService, UploadFile, NzModalRef, NzModalService } from 'ng-zorro-antd';
@@ -29,6 +28,7 @@ import { filter } from 'rxjs/operators';
})
export class OnboardVnfVmComponent implements OnInit {
@HostBinding('@routerAnimate') routerAnimateState;
+ @ViewChild('notification') notification: any;
// upload
tabs: string[] = ['NS', 'VNF', 'PNF'];
@@ -70,8 +70,7 @@ export class OnboardVnfVmComponent implements OnInit {
private myhttp: onboardService,
private http: HttpClient,
private msg: NzMessageService,
- private modalService: NzModalService,
- private notification: NzNotificationService
+ private modalService: NzModalService
) { }
//default Call ns data by default
@@ -79,26 +78,6 @@ export class OnboardVnfVmComponent implements OnInit {
this.getTableData();
}
- notificationAttributes: {
- title: string,
- imgPath: string,
- action: string,
- status: string,
- id: string
- }
- setNotification({ imgPath, action, status, id }):void{
- this.notificationAttributes = { title: this.currentTab, imgPath, action, status, id }
- }
-
- notificationSuccess(notificationModel: TemplateRef<{}>, action: string, id: string): void {
- this.setNotification({ imgPath:"assets/images/execute-success.png", action, status:"Success", id })
- this.notification.template(notificationModel);
- }
- notificationFailed(notificationModel: TemplateRef<{}>, action: string ,id: string): void{
- this.setNotification({ imgPath:"assets/images/execute-faild.png", action, status:"Failed", id })
- this.notification.template(notificationModel);
- }
-
// Handling tab switching request data
handleTabChange(tab: string): void {
this.currentTab = tab;
@@ -266,7 +245,7 @@ export class OnboardVnfVmComponent implements OnInit {
}
// confirm
- showConfirm(requestBody: object, notificationModel: TemplateRef<{}>, id: string): void{
+ showConfirm(requestBody: object, id: string): void{
let API = this.currentTab === 'NS'? 'getNsonboard' : 'getVnfonboard';
this.modalService.confirm({
nzTitle: '<p>Are you sure you want to do this?</p>',
@@ -276,16 +255,16 @@ export class OnboardVnfVmComponent implements OnInit {
if (data.status == "success") {
if(this.currentTab === 'NS'){
this.isUpdate = false;
- this.notificationSuccess(notificationModel, "OnboardingState", id);
+ this.notification.notificationSuccess(this.currentTab, "OnboardingState", id);
this.getTableData();
}else{
this.jobId = data.jobId;
- this.queryProgress(this.jobId, notificationModel,id);
+ this.queryProgress(this.jobId, id);
this.getTableVnfData();
}
} else {
this.isUpdate = false;
- this.notificationFailed(notificationModel, "OnboardingState", id);
+ this.notification.notificationFailed(this.currentTab, "OnboardingState", id);
return false
}
}, (err) => {
@@ -297,36 +276,36 @@ export class OnboardVnfVmComponent implements OnInit {
// ns onboard Upload button
- updataService(id: string, notificationModel: TemplateRef<{}>) {
+ updataService(id: string) {
this.isUpdate = true;
let requestBody = { "csarId": id };
- this.showConfirm(requestBody, notificationModel, id)
+ this.showConfirm(requestBody, id)
}
//Progress Progress inquiry
- queryProgress(jobId: string, notificationModel: TemplateRef<{}>, id: string): any{
+ queryProgress(jobId: string, id: string): any{
let mypromise = new Promise((res) => {
this.myhttp.getProgress(jobId, 0)
.subscribe((data) => {
if (data.responseDescriptor == null || data.responseDescriptor == "null" || data.responseDescriptor.progress == undefined || data.responseDescriptor.progress == null) {
this.isUpdate = true;
setTimeout(() => {
- this.queryProgress(this.jobId, notificationModel, id);
+ this.queryProgress(this.jobId, id);
}, 10000)
return false
}
if (data.responseDescriptor.progress > 100) {
this.isUpdate = false;
- this.notificationFailed(notificationModel, 'OnboardingState', id);
+ this.notification.notificationFailed(this.currentTab, 'OnboardingState', id);
}else if (data.responseDescriptor.progress < 100) {
this.isUpdate = true;
setTimeout(() => {
- this.queryProgress(this.jobId, notificationModel,id);
+ this.queryProgress(this.jobId, id);
}, 5000)
} else {
res(data);
this.isUpdate = false;
- this.notificationSuccess(notificationModel, 'OnboardingState', id);
+ this.notification.notificationSuccess(this.currentTab, 'OnboardingState', id);
}
return false
})
@@ -335,20 +314,20 @@ export class OnboardVnfVmComponent implements OnInit {
}
/* delete button */
- showDeleteConfirm(pkgid: string, notificationModel: TemplateRef<{}>): void {
+ showDeleteConfirm(pkgid: string): void {
this.modalService.confirm({
nzTitle: 'Do you Want to delete these items?',
nzContent: 'Do you Want to delete these items?',
nzOkText: 'Yes',
nzCancelText: 'No',
nzOnOk: () => new Promise((resolve) => {
- this.deleteService(pkgid, notificationModel,resolve);
+ this.deleteService(pkgid, resolve);
}).catch(() => console.log('Oops errors!'))
});
}
//delete nsItem
- deleteService(pkgid, notificationModel,resolve) {
+ deleteService(pkgid, resolve) {
let API: string;
if(this.currentTab === 'NS'){
API = 'deleteNsIdData';
@@ -359,7 +338,7 @@ export class OnboardVnfVmComponent implements OnInit {
}
this.myhttp[API](pkgid)
.subscribe((data) => {
- this.notificationSuccess(notificationModel, 'OnboardingState', pkgid);
+ this.notification.notificationSuccess(this.currentTab, 'OnboardingState', pkgid);
resolve()
//refresh list after successful deletion
switch(this.currentTab){
@@ -375,7 +354,7 @@ export class OnboardVnfVmComponent implements OnInit {
}
}, (err) => {
console.log(err);
- this.notificationFailed(notificationModel, 'OnboardingState', pkgid);
+ this.notification.notificationFailed(this.currentTab, 'OnboardingState', pkgid);
})
}
}