<p class="ant-upload-text">Click or drag file to this area to upload</p>
<p class="ant-upload-hint">Support for a single or bulk upload. Strictly prohibit from uploading company data or other band files</p>
</nz-upload>
- <button nz-button [nzLoading]="uploading" (click)="onClick(tab)" [disabled]="fileListNS.length == 0"
+ <button nz-button [nzLoading]="nsuploading" (click)="onClick(tab)" [disabled]="fileListNS.length == 0"
style="margin-top: 16px">
- {{ uploading ? 'Uploading' : 'Start Upload' }}
+ {{ nsuploading ? 'Uploading' : 'Start Upload' }}
</button>
<nz-table #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="true" [nzShowQuickJumper]="true"
[nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pageSize" [(nzPageIndex)]='pageIndex'
<td *ngIf="item.nsdVersion">{{item.nsdVersion}}</td>
<td *ngIf="item.version">{{ item.version }}</td>
<td>
- <span [ngClass]="{'onboarding':item.status=='Onboarding','onboarded':item.status=='Onboarded',
- 'updating':item.status=='Updating','deleting':item.status=='Deleting','invalid':item.status=='Invalid'}">{{item.nsdOnboardingState}}</span>
+ <span *ngIf="item.nsdOnboardingState">{{item.nsdOnboardingState}}</span>
+ <span *ngIf="item.uuid" data_id="i">{{status}}</span>
<!-- <nz-progress *ngIf="item.status!='Onboarded' && item.status!='Invalid'" [nzPercent]="item.progress"></nz-progress> -->
</td>
- <td>{{item.nsdOperationalState}}</td>
+ <td>{{item.nsdOperationalState}}</td>
<td>{{item.nsdUsageState}}</td>
<td>
<!-- <i class="anticon anticon-cloud-upload-o" (click)="updataService()"></i> -->
<i class="anticon anticon-upload upicon" #upload_icon (click)="updataNsService(item.uuid)" *ngIf="item.uuid"></i>
<!-- <i class="anticon anticon-download" (click)="downloadNsService(item.id)"></i> -->
- <i nzType="info" (click)="showConfirm(i, item.id)" class="anticon anticon-delete" *ngIf="item.id" ></i>
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" *ngIf="item.id"></i>
<!-- (click)="deleteNsService(i,item.id)" -->
<!-- <button nz-button nzType="info" (click)="showConfirm()">Confirm</button> -->
<!-- <i class="anticon anticon-delete" *ngIf="item.uuid" (click)="deleteNsSdcService(i,item.uuid)"></i> -->
<p class="ant-upload-text">Click or drag file to this area to upload</p>
<p class="ant-upload-hint">Support for a single or bulk upload. Strictly prohibit from uploading company data or other band files</p>
</nz-upload>
- <button nz-button [nzLoading]="uploading" (click)="onClick(tab)" [disabled]="fileListVNF.length == 0"
+ <button nz-button [nzLoading]="vnfuploading" (click)="onClick(tab)" [disabled]="fileListVNF.length == 0"
style="margin-top: 16px">
- {{ uploading ? 'Uploading' : 'Start Upload' }}
+ {{ vnfuploading ? 'Uploading' : 'Start Upload' }}
</button>
<nz-table #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="true" [nzShowQuickJumper]="true"
[nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pageSize" [(nzPageIndex)]='pageIndex'
<!-- <i class="anticon anticon-cloud-upload-o" (click)="updataService()"></i> -->
<i class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid)" *ngIf="item.uuid"></i>
<!-- <i class="anticon anticon-download" (click)="downloadVnfService()"></i> -->
- <i nzType="info" (click)="showVnfConfirm(i,item.id)" class="anticon anticon-delete" *ngIf="item.id"></i>
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" id="{{ item.id}}" *ngIf="item.id"></i>
<!-- <button nz-button nzType="info" (click)="showConfirm()">Confirm</button> -->
</td>
</tr>
<p class="ant-upload-text">Click or drag file to this area to upload</p>
<p class="ant-upload-hint">Support for a single or bulk upload. Strictly prohibit from uploading company data or other band files</p>
</nz-upload>
- <button nz-button [nzLoading]="uploading" (click)="onClick(tab)" [disabled]="fileListPNF.length == 0"
+ <button nz-button [nzLoading]="pnfuploading" (click)="onClick(tab)" [disabled]="fileListPNF.length == 0"
style="margin-top: 16px">
- {{ uploading ? 'Uploading' : 'Start Upload' }}
+ {{ pnfuploading ? 'Uploading' : 'Start Upload' }}
</button>
<nz-table #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="true" [nzShowQuickJumper]="true"
[nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pageSize" [(nzPageIndex)]='pageIndex'
<!-- <i class="anticon anticon-cloud-upload-o" (click)="updataService()"></i> -->
<!-- <i class="anticon anticon-upload upicon" #upload_icon (click)="updataService(item.id)" *ngIf="item.id"></i> -->
<!-- <i class="anticon anticon-download" (click)="downloadPnfService(item.id)"></i> -->
- <i nzType="info" (click)="showPnfConfirm(i,item.id)" class="anticon anticon-delete"></i>
- <!-- <button nz-button nzType="info" (click)="showConfirm()">Confirm</button> -->
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)"></i>
</td>
</tr>
<!-- </ng-template> -->
vnfPkgId ='';
pnfdInfoId = '';
tabTitle = "NS";
- uploading = false;
+ nsuploading = false;
+ vnfuploading = false;
+ pnfloading = false;
fileListNS: UploadFile[] = [];
fileListVNF: UploadFile[] = [];
fileListPNF: UploadFile[] = [];
- constructor(private myhttp: onboardService, private http: HttpClient, private msg: NzMessageService,private titleService: Title,private modal: NzModalService) { }
+ // onboard initial value
+ status = "Onboard Available";
+ constructor(private myhttp: onboardService, private http: HttpClient, private msg: NzMessageService,private titleService: Title,private modal: NzModalService, private modalService: NzModalService) { }
//default 默认调用ns数据
ngOnInit() {
- console.log("11111111111111")
this.getTableData();
}
pageIndex = 1;
pageSize = 10;
total;
- loading = false;
+ nsloading = false;
sortName = null;
sortValue = null;
tabs = ['NS', 'VNF', 'PNF'];
this.fileListNS.forEach((file: any) => {
formData.append('files[]', file);
});
+ this.nsuploading = true;
break
case "VNF":
this.fileListVNF.forEach((file: any) => {
formData.append('files[]', file);
});
+ this.vnfuploading = true;
break
case "PNF":
this.fileListPNF.forEach((file: any) => {
formData.append('files[]', file);
});
+ this.pnfloading = true;
break
}
- this.uploading = true;
+
+ // this.nsuploading = true;
// You can use any AJAX library you like
- const req = new HttpRequest('PUT', url, formData, {
+ const req = new HttpRequest('POST', url, formData, {
reportProgress: true,
withCredentials: true
});
.pipe(filter(e => e instanceof HttpResponse))
.subscribe(
(event: {}) => {
- this.uploading = false;
+ this.changeUploadingSta(tab)
console.log('upload successfully')
this.msg.success('upload successfully.');
},
err => {
- this.uploading = false;
+ this.changeUploadingSta(tab)
console.log('upload failed')
this.msg.error('upload failed.');
}
);
}
+// 控制uploading的状态
+changeUploadingSta(tab) {
+ switch(tab) {
+ case "NS":
+ this.nsuploading = false;
+ break
+ case "VNF":
+ this.vnfuploading = false;
+ break
+ case "PNF":
+ this.pnfloading = false;
+ }
+}
//----------------------------------------------------------------------------------------------
// console.log('dddd',reset)
// this.getTableData();
// }
-
-
+
/* onboard 上传按钮 */
// ns onboard
+
+ success(): void {
+ const modal = this.modalService.success({
+ nzTitle: 'This is an success message',
+ nzContent: 'Package Onboard Completed.'
+ });
+
+ window.setTimeout(() => modal.destroy(), 2000);
+ }
+
+ error(): void {
+ this.modalService.error({
+ nzTitle: 'This is an error message',
+ nzContent: 'Package Onboard Failed!'
+ });
+ }
updataNsService(id) {
console.log(id);
-
let requestBody = {
"csarId": id
}
this.myhttp.getNsonboard(requestBody)
.subscribe((data) => {
console.log('onboard ns sdc', data);
+ if(data["status"] == 200) {
+ this.success();
+
+ } else {
+ this.error();
+ }
this.getTableData();
}, (err) => {
console.log(err);
// vnf onboard
updataVnfService(id) {
+ this.status = "Onboarding";
console.log(id)
let requestBody = {
"csarId": id
this.myhttp.getVnfonboard(requestBody)
.subscribe((data) => {
console.log('onboard vnf sdc', data);
- this.getTableVnfData();
+ if(data["status"] == "200"){
+ this.success();
+ }else {
+ this.error();
+ }
}, (err) => {
console.log(err);
})
//--------------------------------------------------------------------------------
/* delete 删除按钮 */
// ns
- showConfirm(index, pkgid): void {
- console.log(index)
- console.log(pkgid)
+ showConfirm(index,pkgid,tab): void {
this.confirmModal = this.modal.confirm({
nzTitle: 'Do you Want to delete these items?',
- nzContent: 'When clicked the OK button, this dialog will be closed after 1 second',
- nzOnOk: () => new Promise((resolve, reject) => {
- this.deleteNsService(index,pkgid);
- setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
+ nzContent: 'Do you Want to delete these items?',
+ nzOkText : 'Yes',
+ nzCancelText: 'No',
+ nzOnOk: () => new Promise((resolve, reject) => {
+ switch (tab) {
+ case 'NS':
+ this.deleteNsService(index,pkgid);
+ setTimeout(Math.random() > 0.5 ? resolve : reject,1000);
+ break
+ case 'VNF':
+ this.deleteVnfService(index,pkgid);
+ setTimeout(Math.random() > 0.5 ? resolve : reject,1000);
+ break
+ case 'PNF':
+ this.deletePnfService(index,pkgid);
+ setTimeout(Math.random() > 0.5 ? resolve : reject,1000);
+ break
+ }
}).catch(() => console.log('Oops errors!'))
});
}
- //vnf
- showVnfConfirm(index, pkgid): void {
- console.log(index)
- console.log(pkgid)
- this.confirmModal = this.modal.confirm({
- nzTitle: 'Do you Want to delete these items?',
- nzContent: 'When clicked the OK button, this dialog will be closed after 1 second',
- nzOnOk: () => new Promise((resolve, reject) => {
- this.deleteVnfService(index,pkgid);
- setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
- }).catch(() => console.log('Oops errors!'))
- });
- }
- //vnf
- showPnfConfirm(index, pkgid): void {
- console.log(index)
- console.log(pkgid)
- this.confirmModal = this.modal.confirm({
- nzTitle: 'Do you Want to delete these items?',
- nzContent: 'When clicked the OK button, this dialog will be closed after 1 second',
- nzOnOk: () => new Promise((resolve, reject) => {
- this.deletePnfService(index,pkgid);
- setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
- }).catch(() => console.log('Oops errors!'))
- });
- }
+ /* delete 删除按钮 */
//delete nsItem
deleteNsService(index,pkgid) {
console.log(pkgid)
Code Review / usecase-ui.git / commitdiff