summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.html31
-rw-r--r--usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.ts108
2 files changed, 114 insertions, 25 deletions
diff --git a/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.html b/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.html
index 81b77fbb..70ee81c0 100644
--- a/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.html
+++ b/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.html
@@ -100,9 +100,9 @@
<td>{{item.nsdUsageState}}</td>
<td>
<i [ngClass]="{'cannotclick':onboardData.status == 'onboarding' && i == currentIndex}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataNsService(item.uuid,i)"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataNsService(item.uuid,i,notificationModel)"
*ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)"
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab,notificationModel)"
*ngIf="item.id"></i>
<!--<span *ngIf="item.id" [ngClass]="{'fileIcon':OnboardFile == 'disNone'}">-->
<!--<span *ngIf="item.id && item.sameid == undefined">-->
@@ -199,9 +199,9 @@
<td>{{item.usageState}}</td>
<td>
<i [ngClass]="{'cannotclick':onboardData.status == 'onboarding' && i == currentIndex}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid,i)"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid,i,notificationModel)"
*ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)"
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab,notificationModel)"
*ngIf="item.id"></i>
<!--<span *ngIf="item.id && item.sameid == undefined">-->
<!--<nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">-->
@@ -289,7 +289,7 @@
<td>{{item.pnfdOnboardingState}}</td>
<td>{{item.pnfdUsageState}}</td>
<td>
- <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)"></i>
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab,notificationModel)"></i>
<!--<span *ngIf="item.id" [ngClass]="{'fileIcon':OnboardFile == 'disNone'}">-->
<!--<nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">-->
<!--<i class="anticon anticon-file" type="upload" (click)="onClickId(item.id,tab)"></i>-->
@@ -308,5 +308,26 @@
</div>
</nz-tab>
+ <!--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="{{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>
</nz-tabset>
diff --git a/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.ts b/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
index ac880f4a..f65a9560 100644
--- a/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
+++ b/usecaseui-portal/src/app/services/onboard-vnf-vm/onboard-vnf-vm.component.ts
@@ -14,7 +14,8 @@
limitations under the License.
*/
import { HttpClient, HttpRequest, HttpResponse } from '@angular/common/http';
-import { Component, OnInit, HostBinding } from '@angular/core';
+import {Component, OnInit, HostBinding, TemplateRef} from '@angular/core';
+import { NzNotificationService } from 'ng-zorro-antd';
// import { MyhttpService } from '../../myhttp.service';
import { onboardService } from '../../onboard.service';
import { slideToRight } from '../../animates';
@@ -22,7 +23,6 @@ import { NzMessageService, UploadFile, NzModalRef, NzModalService } from 'ng-zor
import { filter } from 'rxjs/operators';
import { Title } from '@angular/platform-browser';
import * as $ from 'jquery';
-import { NzNotificationService } from 'ng-zorro-antd';
@Component({
@@ -61,8 +61,15 @@ export class OnboardVnfVmComponent implements OnInit {
//vnf: 'https://jsonplaceholder.typicode.com/posts/',
//pnf: 'https://jsonplaceholder.typicode.com/posts/',
};
- constructor(private myhttp: onboardService, private http: HttpClient, private msg: NzMessageService,private titleService: Title,private modal: NzModalService, private modalService: NzModalService) { }
-
+ constructor(
+ private myhttp: onboardService,
+ private http: HttpClient,
+ private msg: NzMessageService,
+ private titleService: Title,
+ private modal: NzModalService,
+ private modalService: NzModalService,
+ private notification: NzNotificationService
+ ) { }
//default Call ns data by default
ngOnInit() {
this.getTableData();
@@ -90,6 +97,28 @@ export class OnboardVnfVmComponent implements OnInit {
tabs = ['NS', 'VNF', 'PNF'];
isSpinning = false;
+ //2019.08.14 add
+ notificationAttributes = {
+ "title":this.tabs[0],
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"OnboardingState",
+ "status":"InProgress",
+ "id":null
+ };
+ 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);
+ }
// Handling tab switching request data
handleTabChange(tab) {
this.tabTitle = tab;
@@ -571,25 +600,35 @@ changeUploadingSta(tab) {
}
currentIndex = 0;
// ns onboard Upload button
- updataNsService(id,index) {
+ updataNsService(id,index,notificationModel) {
this.currentIndex = index;
this.onboardData.status = "onboarding"; //Disabled
this.onboardData.progress = 0;
console.log("NS-onboard-id-->" + id);
let requestBody = {
"csarId": id
- }
+ };
+ this.notificationAttributes = {
+ "title":this.tabs[0],
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"OnboardingState",
+ "status":"InProgress",
+ "id":id
+ };
+ this.notificationModelShow(notificationModel);
this.myhttp.getNsonboard(requestBody)
.subscribe((data) => {
console.log('onboard ns sdc-->', data);
if(data.status == "failed"){
console.log("Package Onboard Failed")
this.onboardData.status = "Failed";
+ this.notificationFailed(notificationModel);
this.error();
return false
}else if(data.status == "success"){
this.success("NS");
this.onboardData.status = "onboarded";
+ this.notificationSuccess(notificationModel);
}
}, (err) => {
console.log(err);
@@ -597,7 +636,7 @@ changeUploadingSta(tab) {
}
// vnf onboard Upload button
- updataVnfService(id,index) {
+ updataVnfService(id,index,notificationModel) {
this.currentIndex = index;
this.onboardData.status = "onboarding"; //Disabled button
this.onboardData.progress = 0;
@@ -605,13 +644,21 @@ changeUploadingSta(tab) {
console.log("VNF-onboard-id-->" + id)
let requestBody = {
"csarId": id
- }
+ };
+ this.notificationAttributes = {
+ "title":this.tabs[1],
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"OnboardingState",
+ "status":"InProgress",
+ "id":id
+ };
+ this.notificationModelShow(notificationModel);
this.myhttp.getVnfonboard(requestBody)
.subscribe((data) => {
console.log('onboard vnf sdc-->', data);
this.jobId = data.jobId;
console.log('onboard vnf sdc jobId-->'+ data.jobId);
- this.queryProgress(this.jobId,0); //vnf Need to query progress interface
+ this.queryProgress(this.jobId,0,notificationModel); //vnf Need to query progress interface
}, (err) => {
console.log(err);
})
@@ -623,7 +670,7 @@ changeUploadingSta(tab) {
// }
//Progress Progress inquiry
- queryProgress(jobId,responseId){
+ queryProgress(jobId,responseId,notificationModel){
let mypromise = new Promise((res)=>{
this.myhttp.getProgress(jobId,responseId)
.subscribe((data)=>{
@@ -633,7 +680,7 @@ changeUploadingSta(tab) {
console.log("progress == undefined");
this.onboardData.status = "onboarding";
setTimeout(()=>{
- this.queryProgress(this.jobId,0);
+ this.queryProgress(this.jobId,0,notificationModel);
},10000)
return false
}
@@ -641,6 +688,7 @@ changeUploadingSta(tab) {
console.log("progress-->",data.responseDescriptor.progress)
console.log("Package Onboard Failed")
this.onboardData.status = "Failed";
+ this.notificationFailed(notificationModel);
this.error();
return false
}
@@ -648,7 +696,7 @@ changeUploadingSta(tab) {
this.onboardData.status = "onboarding";
console.log("progress < 100")
setTimeout(()=>{
- this.queryProgress(this.jobId,0);
+ this.queryProgress(this.jobId,0,notificationModel);
},5000)
}else if(data.responseDescriptor.progress == 100){
res(data);
@@ -656,7 +704,8 @@ changeUploadingSta(tab) {
console.log(data);
this.success("VNF");
this.onboardData.status = "onboarded";
- }
+ this.notificationSuccess(notificationModel);
+ }
return false
})
})
@@ -665,7 +714,14 @@ changeUploadingSta(tab) {
//--------------------------------------------------------------------------------
/* delete button */
- showConfirm(index,pkgid,tab): void {
+ showConfirm(index,pkgid,tab,notificationModel): void {
+ this.notificationAttributes = {
+ "title":this.tabs[0],
+ "imgPath":"../../../../assets/images/execute-inproess.png",
+ "action":"OnboardingState",
+ "status":"InProgress",
+ "id":pkgid
+ };
this.confirmModal = this.modal.confirm({
nzTitle: 'Do you Want to delete these items?',
nzContent: 'Do you Want to delete these items?',
@@ -674,15 +730,21 @@ changeUploadingSta(tab) {
nzOnOk: () => new Promise((resolve, reject) => {
switch (tab) {
case 'NS':
- this.deleteNsService(index,pkgid);
+ this.notificationAttributes.title = this.tabs[0];
+ this.notificationModelShow(notificationModel);
+ this.deleteNsService(index,pkgid,notificationModel);
setTimeout(Math.random() > 0.5 ? resolve : reject,2000);
break
case 'VNF':
- this.deleteVnfService(index,pkgid);
+ this.notificationAttributes.title = this.tabs[1];
+ this.notificationModelShow(notificationModel);
+ this.deleteVnfService(index,pkgid,notificationModel);
setTimeout(Math.random() > 0.5 ? resolve : reject,2000);
break
case 'PNF':
- this.deletePnfService(index,pkgid);
+ this.notificationAttributes.title = this.tabs[2];
+ this.notificationModelShow(notificationModel);
+ this.deletePnfService(index,pkgid,notificationModel);
setTimeout(Math.random() > 0.5 ? resolve : reject,2000);
break
}
@@ -691,44 +753,50 @@ changeUploadingSta(tab) {
}
//delete nsItem
- deleteNsService(index,pkgid) {
+ deleteNsService(index,pkgid,notificationModel) {
console.log(pkgid)
console.log("deleteService!");
this.myhttp.deleteNsIdData(pkgid)
.subscribe((data) => {
console.log("nsdel--->", data);
+ this.notificationSuccess(notificationModel);
//refresh list after successful deletion
this.getTableData();
}, (err) => {
console.log(err);
+ this.notificationFailed(notificationModel);
})
}
//delete vnfItem
- deleteVnfService(index,pkgid) {
+ deleteVnfService(index,pkgid,notificationModel) {
console.log(pkgid)
console.log("deleteVnfService!");
this.myhttp.deleteVnfIdData(pkgid)
.subscribe((data) => {
console.log('vnfdel--->', data);
+ this.notificationSuccess(notificationModel);
//refresh list after successful deletion
this.getTableVnfData()
}, (err) => {
console.log(err);
+ this.notificationFailed(notificationModel);
})
}
//delete PnfItem
- deletePnfService(index,pkgid) {
+ deletePnfService(index,pkgid,notificationModel) {
console.log(pkgid)
console.log("deletePnfService!");
this.myhttp.deletePnfIdData(pkgid)
.subscribe((data) => {
console.log('pnfdel--->', data);
//refresh list after successful deletion
+ this.notificationSuccess(notificationModel);
this.getTablePnfData()
}, (err) => {
console.log(err);
+ this.notificationFailed(notificationModel);
})
}