<i [ngClass]="{'cannotclick':onboardData.status == 'onboarding' && i == currentIndex}"
class="anticon anticon-upload upicon" #upload_icon (click)="updataNsService(item.uuid,i)" *ngIf="item.uuid"></i>
<i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" *ngIf="item.id"></i>
- </td>
+
+ <span *ngIf="item.id && item.sameid == undefined">
+ <nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">
+ <i class="anticon anticon-file" type="upload" (click)="onClickId(item.id,tab)"></i>
+ </nz-upload>
+ <button nz-button [nzLoading]="nsuploading" (click)="onClick(tab)" [disabled]="fileList.length == 0" style="margin-top: 16px" *ngIf="item.id==nsdInfoId">
+ {{ nsuploading ? 'Uploading' : 'Start Upload' }}
+ </button>
+ </span>
+
+ </td>
</tr>
</tbody>
</nz-table>
</nz-spin>
- <!-- <div style="margin-top:8px;">
- Loading state：
- <nz-switch [(ngModel)]="isSpinning"></nz-switch>
- </div> -->
-
</div>
<!-- VNFList -->
<div class="list" *ngIf="tab === 'VNF'">
<td>{{item.usageState}}</td>
<td>{{item.operationalState}}</td>
<td>
- <i [ngClass]="{'cannotclick':onboardData.status == 'onboarding' && i == currentIndex}"
- class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid,i)" *ngIf="item.uuid"></i>
- <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" *ngIf="item.id"></i>
+ <i [ngClass]="{'cannotclick':onboardData.status == 'onboarding' && i == currentIndex}"
+ class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid,i)" *ngIf="item.uuid"></i>
+ <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" *ngIf="item.id"></i>
+ <span *ngIf="item.id && item.sameid == undefined">
+ <nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">
+ <i class="anticon anticon-file" type="upload" (click)="onClickId(item.id,tab)"></i>
+ </nz-upload>
+ <button nz-button [nzLoading]="nsuploading" (click)="onClick(tab)" [disabled]="fileList.length == 0" style="margin-top: 16px" *ngIf="item.id==vnfPkgId">
+ {{ nsuploading ? 'Uploading' : 'Start Upload' }}
+ </button>
+ </span>
</td>
</tr>
</tbody>
<td>{{item.pnfdUsageState}}</td>
<td>
<i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)"></i>
+ <span *ngIf="item.id">
+ <nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload">
+ <i class="anticon anticon-file" type="upload" (click)="onClickId(item.id,tab)"></i>
+ </nz-upload>
+ <button nz-button [nzLoading]="nsuploading" (click)="onClick(tab)" [disabled]="fileList.length == 0" style="margin-top: 16px" *ngIf="item.id==vnfPkgId">
+ {{ nsuploading ? 'Uploading' : 'Start Upload' }}
+ </button>
+ </span>
</td>
</tr>
</tbody>
nsuploading = false;
vnfuploading = false;
pnfloading = false;
+ fileList: UploadFile[] = [];
fileListNS: UploadFile[] = [];
fileListVNF: UploadFile[] = [];
fileListPNF: UploadFile[] = [];
//url
url = {
// line up
- ns: '/api/nsd/v1/ns_descriptors/'+this.nsdInfoId +'/nsd_content',
- vnf: '/api/vnfpkgm/v1/vnf_packages/'+this.vnfPkgId+'/package_content',
- pnf: '/api/nsd/v1/pnf_descriptors/'+this.pnfdInfoId+'/pnfd_content'
+ //ns: '/api/nsd/v1/ns_descriptors/'+this.nsdInfoId +'/nsd_content',
+ //vnf: '/api/vnfpkgm/v1/vnf_packages/'+this.vnfPkgId+'/package_content',
+ //pnf: '/api/nsd/v1/pnf_descriptors/'+this.pnfdInfoId+'/pnfd_content'
// 本地
- // ns: 'https://jsonplaceholder.typicode.com/posts/',
- // vnf: 'https://jsonplaceholder.typicode.com/posts/',
- // pnf: 'https://jsonplaceholder.typicode.com/posts/',
+ ns: 'https://jsonplaceholder.typicode.com/posts/',
+ 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) { }
sortValue = null;
tabs = ['NS', 'VNF', 'PNF'];
isSpinning = false;
- isVisible = false;
- isOkLoading = false;
- showModal(): void {
- this.isVisible = true;
- }
-
- handleCancel(): void {
- this.isVisible = false;
- }
// 处理tab切换 请求数据
handleTabChange(tab) {
case 'NS':
this.nstableData = [];
this.getTableData();
+ this.fileList = []; //切换时清空上传的文件
break
case 'VNF':
this.vnftableData = [];
this.getTableVnfData()
+ this.fileList = [];
break
case 'PNF':
this.pnftableData = [];
this.getTablePnfData()
+ this.fileList = [];
break
}
}
"additionalProp3": ""
}
}
- // requestBody = {};
+
+ //NS/VNF列表添加文件
+ beforeUpload = (file: UploadFile): boolean => {
+ this.fileList.push(file);
+ console.log('fileList' + this.fileList)
+ return false;
+ }
+
// ns beforeUpload
beforeUploadNS = (file: UploadFile): boolean => {
this.fileListNS.push(file);
})
return false;
}
+
+ //获取列表单条id
+ onClickId(id,tab){
+ switch (tab) {
+ case 'NS':
+ this.nsdInfoId = id;
+ console.log(this.nsdInfoId);
+ break
+ case 'VNF':
+ this.vnfPkgId = id;
+ console.log(this.vnfPkgId);
+ break
+ case 'PNF':
+ this.pnfdInfoId = id;
+ console.log(this.pnfdInfoId);
+ break
+ }
+ }
+
//拖拽后点击上传按钮
onClick (tab) {
switch (tab) {
case 'NS':
- console.log(this.nsdInfoId);
- this.handleUpload('/api/nsd/v1/ns_descriptors/'+this.nsdInfoId+'/nsd_content',tab);
- // this.handleUpload(this.url.ns, tab);
+ console.log(this.nsdInfoId);
+ // this.handleUpload('/api/nsd/v1/ns_descriptors/'+this.nsdInfoId+'/nsd_content',tab);
+ this.handleUpload(this.url.ns, tab);
this.getTableData();
break
case 'VNF':
console.log(this.vnfPkgId);
- this.handleUpload('/api/vnfpkgm/v1/vnf_packages/'+this.vnfPkgId+'/package_content',tab);
- // this.handleUpload(this.url.vnf, tab);
+ // this.handleUpload('/api/vnfpkgm/v1/vnf_packages/'+this.vnfPkgId+'/package_content',tab);
+ this.handleUpload(this.url.vnf, tab);
this.getTableVnfData()
break
case 'PNF':
console.log(this.pnfdInfoId);
- this.handleUpload('/api/nsd/v1/pnf_descriptors/'+this.pnfdInfoId+'/pnfd_content',tab);
- // this.handleUpload(this.url.pnf, tab);
+ // this.handleUpload('/api/nsd/v1/pnf_descriptors/'+this.pnfdInfoId+'/pnfd_content',tab);
+ this.handleUpload(this.url.pnf, tab);
this.getTablePnfData();
break
}
});
console.log('req--->'+ JSON.stringify(req));
console.log('formData--->'+ JSON.stringify(formData));
+ //上传前置空数组
+ this.fileList = [];
+ this.fileListNS = [];
+ this.fileListVNF = [];
+ this.fileListPNF = [];
this.http
.request(req)
.pipe(filter(e => e instanceof HttpResponse))
.subscribe(
(event: {}) => {
- this.changeUploadingSta(tab)
+ this.changeUploadingSta(tab)
console.log('upload successfully')
this.msg.success('upload successfully.');
},
}
);
}
+
// 控制uploading的状态
changeUploadingSta(tab) {
switch(tab) {
console.log("NSlist-length-vfc-->",data.length);
this.nsvfcData = data;
this.nstableData = this.nsvfcData;
+
+
//ns sdc list
this.myhttp.getSDC_NSTableData()
.subscribe((data) => {
console.log('NSlist-sdc-->',data);
console.log("NSlist-length-vfc-->",data.length);
this.nssdcData = data;
- if (this.nsvfcData.length != 0 && this.nssdcData.length != 0){
- this.nstableData = this.MergeArray(this.nsvfcData, this.nssdcData) //Array deduplication
- }else if(this.nsvfcData.length === 0 && this.nssdcData.length != 0){
- this.nstableData = this.nsvfcData.concat(this.nssdcData); //Array concat
- }else if(this.nsvfcData.length != 0 && this.nssdcData.length === 0){
- this.nstableData = this.nsvfcData.concat(this.nssdcData); //Array concat
- }
+
+ this.nsvfcData.map((nsvfc)=>{ nsvfc.sameid = this.nssdcData.find((nssdc)=>{ return nsvfc.id == nssdc.uuid }) && nsvfc.id; return nsvfc;});
+ console.log(this.nsvfcData);
+ let sameData = this.nssdcData.filter((nssdc)=>{ return !this.nsvfcData.find((nsvfc)=>{ return nsvfc.id == nssdc.uuid})});
+ this.nstableData = this.nstableData.concat(sameData);
+
+
+ // if (this.nsvfcData.length != 0 && this.nssdcData.length != 0){
+ // this.nstableData = this.MergeArray(this.nsvfcData, this.nssdcData) //Array deduplication
+ // }else if(this.nsvfcData.length === 0 && this.nssdcData.length != 0){
+ // this.nstableData = this.nsvfcData.concat(this.nssdcData); //Array concat
+ // }else if(this.nsvfcData.length != 0 && this.nssdcData.length === 0){
+ // this.nstableData = this.nsvfcData.concat(this.nssdcData); //Array concat
+ // }
}, (err) => {
console.log(err);
})
console.log('vnfList-sdc-->', data)
console.log('vnfList-sdc-->', data.length)
this.vnfsdcData = data;
- if (this.vnfvfcData.length != 0 && this.vnfsdcData.length != 0){
- this.vnftableData = this.MergeArray(this.vnfvfcData, this.vnfsdcData) //Array deduplication
- }else if(this.vnfvfcData.length === 0 && this.vnfsdcData.length != 0){
- this.vnftableData = this.vnfvfcData.concat(this.vnfsdcData); //Array concat
- }else if(this.vnfvfcData.length != 0 && this.vnfsdcData.length === 0){
- this.vnftableData = this.vnfvfcData.concat(this.vnfsdcData); //Array concat
- console.log(this.vnftableData);
- }
+
+ this.vnfvfcData.map((vnfvfc)=>{ vnfvfc.sameid = this.vnfsdcData.find((nssdc)=>{ return vnfvfc.id == nssdc.uuid }) && vnfvfc.id; return vnfvfc;});
+ console.log(this.nsvfcData);
+ let sameData = this.vnfsdcData.filter((vnfsdc)=>{ return !this.vnfvfcData.find((vnfvfc)=>{ return vnfvfc.id == vnfsdc.uuid})});
+ this.vnftableData = this.vnftableData.concat(sameData);
+
+ // if (this.vnfvfcData.length != 0 && this.vnfsdcData.length != 0){
+ // this.vnftableData = this.MergeArray(this.vnfvfcData, this.vnfsdcData) //Array deduplication
+ // }else if(this.vnfvfcData.length === 0 && this.vnfsdcData.length != 0){
+ // this.vnftableData = this.vnfvfcData.concat(this.vnfsdcData); //Array concat
+ // }else if(this.vnfvfcData.length != 0 && this.vnfsdcData.length === 0){
+ // this.vnftableData = this.vnfvfcData.concat(this.vnfsdcData); //Array concat
+ // console.log(this.vnftableData);
+ // }
}, (err) => {
console.log(err);
})
}
//合并并去重
- MergeArray(arr1, arr2) {
- var _arr = new Array();
- for (var i = 0; i < arr1.length; i++) {
- if (arr1[i] != "") {
- _arr.push(arr1[i]);
- }
- }
- for (var i = 0; i < arr2.length; i++) {
- var flag = true;
- for (var j = 0; j < arr1.length; j++) {
- // 根据vfc列表arr1的id和sdc列表arr2的uuid去重
- if (arr2[i].uuid == arr1[j].id) {
- flag = false;
- break;
- }
- }
- if (flag && arr2[i] != "") {
- _arr.push(arr2[i]);
- }
- }
- return _arr;
- }
+ // MergeArray(arr1, arr2) {
+ // var _arr = new Array();
+ // for (var i = 0; i < arr1.length; i++) {
+ // if (arr1[i] != "") {
+ // _arr.push(arr1[i]);
+ // }
+ // }
+ // for (var i = 0; i < arr2.length; i++) {
+ // var flag = true;
+ // for (var j = 0; j < arr1.length; j++) {
+ // // 根据vfc列表arr1的id和sdc列表arr2的uuid去重
+ // if (arr2[i].uuid == arr1[j].id) {
+ // flag = false;
+ // break;
+ // }
+ // }
+ // if (flag && arr2[i] != "") {
+ // _arr.push(arr2[i]);
+ // }
+ // }
+ // return _arr;
+ // }
//-----------------------------------------------------------------------------------
/* onboard */
progress: 0,
}
currentIndex = 0;
-
// ns onboard 上传按钮
updataNsService(id,index) {
this.currentIndex = index;
- this.onboardData.status = "onboarding";
+ this.onboardData.status = "onboarding"; //置灰
this.onboardData.progress = 0;
console.log("NS-onboard-id-->" + id);
let requestBody = {
Code Review / usecase-ui.git / commitdiff