Support NS Package Upload for VF-C

Change-Id: If5c9e4d2de4d552805a74e9225a416bacdcbd354
Issue-ID: USECASEUI-156
Signed-off-by: zhangab <zhanganbing@chinamobile.com>

2 files changed, 60 insertions, 43 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 6a605bfa..105f399f 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
@@ -14,7 +14,7 @@
     limitations under the License.
 -->
 <nz-tabset [nzTabPosition]="'top'" [nzType]="'card'">
-        <nz-tab *ngFor="let tab of tabs" [nzTitle]="tab" (nzClick)="handleTabChange(tab, id, url)">
+        <nz-tab *ngFor="let tab of tabs" [nzTitle]="tab" (nzClick)="handleTabChange(tab)">
             <!-- nsList -->
             <div class="list" *ngIf="tab === 'NS'">
                 <h3 class="title"> Onboard {{tabTitle}} </h3>
@@ -30,7 +30,7 @@
                     {{ 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'
+                    [nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="nspageSize" [(nzPageIndex)]='nspageIndex'
                     [nzLoading]="loading" nzSize="middle">
                     <thead (nzSortChange)="sort($event)" nzSingleSort>
                         <tr>
@@ -45,16 +45,18 @@
                     </thead>
                     <tbody>
                         <tr *ngFor="let item of nzTable.data; let i = index; ">
-                            <td *ngIf="item.nsdId">{{item.nsdId}}</td>
+                            <td *ngIf="item.id">{{item.id}}</td>
                             <td *ngIf="item.uuid">{{item.uuid}}</td>
             
                             <td *ngIf="item.nsdName">{{item.nsdName}}</td>
-                            <td *ngIf="item.nsdName===''">无</td>
+                            <td *ngIf="item.nsdName === null">无</td>
                             <td *ngIf="item.name">{{item.name}}</td>
                             <td *ngIf="item.nsdVersion">{{item.nsdVersion}}</td>
+                            <td *ngIf="item.nsdVersion === null">无</td>
                             <td *ngIf="item.version">{{ item.version }}</td>
                             <td>
                                 <span *ngIf="item.nsdOnboardingState">{{item.nsdOnboardingState}}</span>
+                                <span *ngIf="item.nsdOnboardingState === null">无</span>
                                 <span *ngIf="item.uuid" data_id="i">{{status}}</span>
                             </td>
                             <td>{{item.nsdOperationalState}}</td> 
@@ -82,7 +84,7 @@
                     {{ 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'
+                    [nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="vnfpageSize" [(nzPageIndex)]='vnfpageIndex'
                     [nzLoading]="loading" nzSize="middle">
                     <thead (nzSortChange)="sort($event)" nzSingleSort>
                         <tr>
@@ -100,15 +102,17 @@
                             <td *ngIf="item.id">{{item.id}}</td>
                             <td *ngIf="item.uuid">{{item.uuid}}</td>
                             <td *ngIf="item.vnfProductName">{{item.vnfProductName}}</td>
+                            <td *ngIf="item.vnfProductName === null">无</td>
                             <td *ngIf="item.name">{{item.name}}</td>
                             <td *ngIf="item.vnfdVersion">{{item.vnfdVersion}}</td>
+                            <td *ngIf="item.vnfdVersion === null">无</td>
                             <td *ngIf="item.version">{{item.version}}</td>
                             <td>{{item.onboardingState}}</td>
                             <td>{{item.usageState}}</td>
                             <td>{{item.operationalState}}</td>
                             <td>
                                 <i class="anticon anticon-upload upicon" #upload_icon (click)="updataVnfService(item.uuid)" *ngIf="item.uuid"></i>
-                                <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" id="{{ item.id}}" *ngIf="item.id"></i>
+                                <i class="anticon anticon-delete" nzType="info" (click)="showConfirm(i,item.id,tab)" *ngIf="item.id"></i>
                             </td>
                         </tr>
                     </tbody>
@@ -129,7 +133,7 @@
                     {{ 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'
+                    [nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pnfpageSize" [(nzPageIndex)]='pnfpageIndex'
                     [nzLoading]="loading" nzSize="middle">
                     <thead (nzSortChange)="sort($event)" nzSingleSort>
                         <tr>
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 5e5495e2..4e57fc64 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
@@ -34,9 +34,9 @@ export class OnboardVnfVmComponent implements OnInit {
   //url
   url = {
     // line up
-    ns: 'http://172.30.3.100:30280/api/nsd/v1/ns_descriptors/'+this.nsdInfoId+'/nsd_content',
-    vnf: 'http://172.30.3.100:30280/api/vnfpkgm/v1/vnf_packages/'+this.vnfPkgId+'/package_content',
-    pnf: 'http://172.30.3.100:30280/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/',
@@ -53,8 +53,12 @@ export class OnboardVnfVmComponent implements OnInit {
   tableData:any;
   sdcData:any;
   vfcData:any;
-  pageIndex = 1;
-  pageSize = 10;
+  nspageIndex = 1;
+  nspageSize = 10;
+  vnfpageIndex = 1;
+  vnfpageSize = 10;
+  pnfpageIndex = 1;
+  pnfpageSize = 10;
   total;
   nsloading = false;
   sortName = null;
@@ -72,10 +76,12 @@ export class OnboardVnfVmComponent implements OnInit {
   }
 
   // 处理tab切换 请求数据
-  handleTabChange(tab,nsdInfoId,url) {
+  handleTabChange(tab) {
     this.tabTitle = tab;
     console.log(tab);
-    console.log(nsdInfoId);
+    console.log('nsdInfoId--->'+ this.nsdInfoId);
+    console.log('vnfPkgId--->'+ this.vnfPkgId);
+    console.log('pnfdInfoId--->'+ this.pnfdInfoId);
     console.log(this.url);
     switch (tab) {
       case 'NS':
@@ -91,12 +97,12 @@ export class OnboardVnfVmComponent implements OnInit {
   }
 
 
-  //before put 创建--上传之前将文件拖拽到页面时
+  //before put create--Drag and drop files to the page before uploading
     requestBody = {
            "userDefinedData": {
-                "additionalProp1": "string",
-                "additionalProp2": "string",
-                "additionalProp3": "string"
+                "additionalProp1": "",
+                "additionalProp2": "",
+                "additionalProp3": ""
            }
       }
     //  requestBody = {};
@@ -104,12 +110,14 @@ export class OnboardVnfVmComponent implements OnInit {
   beforeUploadNS = (file: UploadFile): boolean => {
     this.fileListNS.push(file);
     console.log('beforeUpload');
-      // this.myhttp.getCreatensData("createNetworkServiceData",requestBody)//线上
-      this.myhttp.getCreatensData("creatensDataNS",this.requestBody)  //本地
+    console.log('fileListNS' + this.fileListNS);
+    console.log('fileListNS' + JSON.stringify(this.fileListNS));
+      this.myhttp.getCreatensData("createNetworkServiceData",this.requestBody)//on-line
+      // this.myhttp.getCreatensData("creatensDataNS")  //local
         .subscribe((data) => {
-          console.log("拖拽文件后返回的数据NS-->", data);
+          console.log("Data returned after dragging a file NS-->", data);
           this.nsdInfoId = data["id"];
-          console.log("拖拽文件后返回的数据的id-->",this.nsdInfoId);
+          console.log("Data returned after dragging a file id-->",this.nsdInfoId);
         }, (err) => {
           console.log(err);
         })
@@ -120,12 +128,14 @@ export class OnboardVnfVmComponent implements OnInit {
   beforeUploadVNF = (file: UploadFile): boolean => {
     this.fileListVNF.push(file);
     console.log('beforeUpload');
-      // this.myhttp.getCreatensData("createVnfData",requestBody)//线上
-      this.myhttp.getCreatensData("creatensDataVNF",this.requestBody) //本地
+    console.log('fileListVNF--->' + this.fileListVNF);
+    console.log('fileListVNF--->' + JSON.stringify(this.fileListVNF));
+      this.myhttp.getCreatensData("createVnfData",this.requestBody)//on-line
+      // this.myhttp.getCreatensData("creatensDataVNF") //local
         .subscribe((data) => {
-          console.log("拖拽文件后返回的数据VNF-->", data);
+          console.log("Data returned after dragging a file VNF-->", data);
           this.vnfPkgId = data["id"];
-          console.log("拖拽文件后返回的数据的id-->",this.vnfPkgId);
+          console.log("Data returned after dragging a file id-->",this.vnfPkgId);
         }, (err) => {
           console.log(err);
         })
@@ -136,12 +146,13 @@ export class OnboardVnfVmComponent implements OnInit {
   beforeUploadPNF = (file: UploadFile): boolean => {
     this.fileListPNF.push(file);
     console.log('beforeUpload');
-      // this.myhttp.getCreatensData("createPnfData",requestBody)  //线上
-      this.myhttp.getCreatensData("creatensDataPNF",this.requestBody)  //本地
+    console.log('fileListPNF--->' + this.fileListPNF);
+      this.myhttp.getCreatensData("createPnfData",this.requestBody)  //on-line
+      // this.myhttp.getCreatensData("creatensDataPNF")  //local
         .subscribe((data) => {
-          console.log("拖拽文件后返回的数据PNF-->", data);
+          console.log("Data returned after dragging a file PNF-->", data);
           this.pnfdInfoId = data["id"];
-          console.log("拖拽文件后返回的数据的id-->",this.pnfdInfoId);
+          console.log("Data returned after dragging a file id-->",this.pnfdInfoId);
         }, (err) => {
           console.log(err);
         })
@@ -152,20 +163,20 @@ export class OnboardVnfVmComponent implements OnInit {
     switch (tab) {
       case 'NS':
       console.log(this.nsdInfoId);
-      // this.handleUpload('http://ip:port/api/nsd/v1/ns_descriptors/{nsdInfoId}/nsd_content');
-        this.handleUpload(this.url.ns, tab);
+      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('http://ip:port/api/vnfpkgm/v1/vnf_packages/{vnfPkgId}/package_content'); 
-        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('http://ip:port/api/nsd/v1/pnf_descriptors/{pnfdInfoId}/pnfd_content');
-        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
     }
@@ -208,6 +219,8 @@ export class OnboardVnfVmComponent implements OnInit {
       reportProgress: true,
       withCredentials: true
     });
+    console.log('req--->'+ JSON.stringify(req));
+    console.log('formData--->'+ JSON.stringify(formData));
     this.http
       .request(req)
       .pipe(filter(e => e instanceof HttpResponse))
@@ -286,7 +299,7 @@ changeUploadingSta(tab) {
   }
 
   // 获取pnf列表
-  getTablePnfData() {
+  getTablePnfData() {   
     this.myhttp.getOnboardTablePnfData()
       .subscribe((data) => {
         console.log("pnfList-->", data);
@@ -396,13 +409,13 @@ changeUploadingSta(tab) {
     console.log("deleteService!");
     this.myhttp.deleteNsIdData(pkgid)
       .subscribe((data) => {
-        console.log(44, data);
+        console.log("nsdel--->", data);
       }, (err) => {
         console.log(err);
       })
       console.log(index)
     this.tableData.splice(index, 1)
-    console.log('数组长度',this.tableData.length)
+    console.log('tableData.length NS--->',this.tableData.length)
 	  this.getTableData()
    }
 
@@ -412,13 +425,13 @@ changeUploadingSta(tab) {
     console.log("deleteVnfService!");
     this.myhttp.deleteVnfIdData(pkgid)
       .subscribe((data) => {
-        console.log(44, data);
+        console.log('vnfdel--->', data);
       }, (err) => {
         console.log(err);
       })
       console.log(index)
     this.tableData.splice(index, 1)
-    console.log(this.tableData.length)
+    console.log('tableData.length VNF--->'+ this.tableData.length)
     this.getTableVnfData()
   }
 
@@ -428,13 +441,13 @@ changeUploadingSta(tab) {
     console.log("deletePnfService!");
     this.myhttp.deletePnfIdData(pkgid)
       .subscribe((data) => {
-        console.log(44, data);
+        console.log('pnfdel--->', data);
       }, (err) => {
         console.log(err);
       })
       console.log(index)
     this.tableData.splice(index, 1)
-    console.log(this.tableData.length)
+    console.log('tableData.length PNF--->'+this.tableData.length)
     this.getTablePnfData()
   }