feat: add slicing nssi page basic business code

Change-Id: I5d5034a7038b628db4fa94ec13ec6361b83839f9
Issue-ID: USECASEUI-369
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>

13 files changed, 175 insertions, 18 deletions

diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index 5b2fae93..37556131 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -95,6 +95,8 @@ import { SlicingBusinessTableComponent } from './views/services/slicing-manageme
 import { BasicInfoComponent } from './shared/components/basic-info/basic-info.component';
 import { CheckProcessModelComponent } from './views/services/slicing-management/slicing-task-management/check-process-model/check-process-model.component'
 import { NsiTableComponent } from './views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component'
+import { NssiTableComponent } from './views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component'
+
 @NgModule({
   providers: [
     { provide: LocationStrategy, useClass: HashLocationStrategy },
@@ -153,7 +155,8 @@ import { NsiTableComponent } from './views/services/slicing-management/slicing-r
     SlicingBusinessTableComponent,
     BasicInfoComponent,
     CheckProcessModelComponent,
-      NsiTableComponent
+      NsiTableComponent,
+      NssiTableComponent
   ],
   imports: [
     BrowserModule,
diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
index 19006acd..98be0117 100644
--- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
+++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
@@ -43,6 +43,10 @@ export class SlicingTaskServices {
         slicingNsiList:this.baseUrl+"/resource/nsi/instances/pageNo/{pageNo}/pageSize/{pageSize}",

         slicingNsiQueryOfStatus:this.baseUrl+"/resource/nsi/{instanceStatus}/instances/pageNo/{pageNo}/pageSize/{pageSize}",

         slicingNsiDetail:this.baseUrl+"/resource/nsi/{nsiId}/details",

+        //slicing-nssi-management

+        slicingNssiList:this.baseUrl+"/resource/nssi/instances/pageNo/{pageNo}/pageSize/{pageSize}",

+        slicingNssiQueryOfStatus:this.baseUrl+"/resource/nssi/{instanceStatus}/instances/pageNo/{pageNo}/pageSize/{pageSize}",

+        slicingNssiDetail:this.baseUrl+"/resource/nssi/{nssiId}/details",

     }

 

 

@@ -125,12 +129,21 @@ export class SlicingTaskServices {
         return this.http.get<any>(url);

     }

     // Get slicing nsi list

-    // Get slicing business list

     getSlicingNsiList (paramsObj,isSelect: boolean) {

         let url = this.url.slicingNsiList .replace("{pageNo}", paramsObj.pageNo)

             .replace("{pageSize}", paramsObj.pageSize);

         if(isSelect){

-            url = this.url.slicingNsiQueryOfStatus.replace("{instanceStatus}", paramsObj.businessStatus).replace("{pageNo}", paramsObj.pageNo)

+            url = this.url.slicingNsiQueryOfStatus.replace("{instanceStatus}", paramsObj.instanceStatus).replace("{pageNo}", paramsObj.pageNo)

+                .replace("{pageSize}", paramsObj.pageSize);

+        }

+        return this.http.get<any>(url);

+    }

+    // Get slicing nssi list

+    getSlicingNssiList (paramsObj,isSelect: boolean) {

+        let url = this.url.slicingNssiList .replace("{pageNo}", paramsObj.pageNo)

+            .replace("{pageSize}", paramsObj.pageSize);

+        if(isSelect){

+            url = this.url.slicingNssiQueryOfStatus.replace("{instanceStatus}", paramsObj.instanceStatus).replace("{pageNo}", paramsObj.pageNo)

                 .replace("{pageSize}", paramsObj.pageSize);

         }

         return this.http.get<any>(url);

diff --git a/usecaseui-portal/src/app/mock/routes.js b/usecaseui-portal/src/app/mock/routes.js
index d57d9982..56ff27c3 100644
--- a/usecaseui-portal/src/app/mock/routes.js
+++ b/usecaseui-portal/src/app/mock/routes.js
@@ -109,8 +109,10 @@ module.exports =
         "/uui-slicing/nsmf/resource/:serviceId": "/slicing_business_activate",
         "/uui-slicing/nsmf/resource/:serviceId/progress":"/getSlicingBusinessProgress",
         ///////<-------------slicing_nsi--------->/////
-        // "/uui-slicing/nsmf/resource/nsi/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nsi_list",
         "/uui-slicing/nsmf/resource/nsi/:instanceStatus/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nsi_list_activated",
+        ///////<-------------slicing_nssi--------->/////
+        "/uui-slicing/nsmf/resource/nssi/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nssi_list",
+        "/uui-slicing/nsmf/resource/nssi/:instanceStatus/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nssi_list_activated",
         ///////<-------------general interface--------->/////
         "/api/*": "/$1",
         "/*/*": "/$1_$2",
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.html
index 3196f8fe..f6291624 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.html
@@ -8,9 +8,9 @@
             </nz-select>
         </div>
     </div>
-    <div>
+    <div class="slicing-resource-table-list">
         <nz-table
-                #nsiTable
+                #nssiTable
                 [nzData]="listOfData"
                 [nzFrontPagination]="false"
                 nzShowSizeChanger
@@ -32,7 +32,7 @@
             </tr>
             </thead>
             <tbody>
-            <ng-template ngFor let-data [ngForOf]="nsiTable.data" let-i="index">
+            <ng-template ngFor let-data [ngForOf]="nssiTable.data" let-i="index">
                 <tr>
                     <td>{{ data.service_instance_id }}</td>
                     <td>{{ data.service_instance_name }}</td>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.less
index 66da35df..ad777025 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.less
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.less
@@ -1,9 +1,3 @@
 nz-select {
   width: 200px;
 }
-.task_status{
-  margin-bottom: 20px;
-  span{
-    margin-right: 5%;
-  }
-}
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
index a1511b18..a88d1618 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nsi-management/nsi-table/nsi-table.component.ts
@@ -1,6 +1,5 @@
 import { Component, OnInit } from '@angular/core';
 import {BUSINESS_STATUS} from '../../../../../../../constants/constants';
-import { NzModalService } from 'ng-zorro-antd';
 import {SlicingTaskServices} from "../../../../../../core/services/slicingTaskServices";
 @Component({
   selector: 'app-nsi-table',
@@ -10,8 +9,7 @@ import {SlicingTaskServices} from "../../../../../../core/services/slicingTaskSe
 export class NsiTableComponent implements OnInit {
 
     constructor(
-        private myhttp: SlicingTaskServices,
-        private modalService: NzModalService
+        private myhttp: SlicingTaskServices
     ) {
     }
 
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-management.component.html
index dde0abcc..1e81aa39 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-management.component.html
@@ -1,3 +1,3 @@
 <p>
-  nssi-management works!
+  <app-nssi-table></app-nssi-table>
 </p>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.html
new file mode 100644
index 00000000..c2408a81
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.html
@@ -0,0 +1,51 @@
+<div class="slicing-resource-table">
+  <div nz-row>
+    <div nz-col nzSpan="12" class="task_status">
+      <span>Status : </span>
+      <nz-select nzShowSearch nzPlaceHolder="Select a processing status" [(ngModel)]="selectedValue"
+                 (ngModelChange)="getListOfProcessingStatus()">
+        <nz-option *ngFor="let item of statusOptions" [nzLabel]="item" [nzValue]="item"></nz-option>
+      </nz-select>
+    </div>
+  </div>
+  <div class="slicing-resource-table-list">
+    <nz-table
+            #nsiTable
+            [nzData]="listOfData"
+            [nzFrontPagination]="false"
+            nzShowSizeChanger
+            [nzPageSizeOptions]="[5,10,15,20]"
+            [nzTotal]='total'
+            [(nzPageSize)]="pageSize"
+            [(nzPageIndex)]='pageIndex'
+            [nzLoading]="loading"
+            (nzPageIndexChange)="searchData()"
+            (nzPageSizeChange)="searchData(true)"
+    >
+      <thead>
+      <tr>
+        <th>Service Instance Id</th>
+        <th>Service Instance Name</th>
+        <th>Service Type</th>
+        <th>Context</th>
+        <th>Status</th>
+        <th width="140px">Detail</th>
+      </tr>
+      </thead>
+      <tbody>
+      <ng-template ngFor let-data [ngForOf]="nsiTable.data" let-i="index">
+        <tr>
+          <td>{{ data.service_instance_id }}</td>
+          <td>{{ data.service_instance_name }}</td>
+          <td>{{ data.service_type }}</td>
+          <td>{{data.environment_context}}</td>
+          <td>{{data.orchestration_status}}</td>
+          <td>
+            <a (click)="showdetail(data)">detail</a>
+          </td>
+        </tr>
+      </ng-template>
+      </tbody>
+    </nz-table>
+  </div>
+</div>
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.less
new file mode 100644
index 00000000..3a7c3d0a
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.less
@@ -0,0 +1,3 @@
+nz-select {
+  width: 200px;
+}
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.spec.ts
new file mode 100644
index 00000000..b90e60ac
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NssiTableComponent } from './nssi-table.component';
+
+describe('NssiTableComponent', () => {
+  let component: NssiTableComponent;
+  let fixture: ComponentFixture<NssiTableComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ NssiTableComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NssiTableComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts
new file mode 100644
index 00000000..926350b9
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/nssi-management/nssi-table/nssi-table.component.ts
@@ -0,0 +1,59 @@
+import { Component, OnInit } from '@angular/core';
+import {BUSINESS_STATUS} from '../../../../../../../constants/constants';
+import {SlicingTaskServices} from "../../../../../../core/services/slicingTaskServices";
+@Component({
+  selector: 'app-nssi-table',
+  templateUrl: './nssi-table.component.html',
+  styleUrls: ['./nssi-table.component.less']
+})
+export class NssiTableComponent implements OnInit {
+
+    constructor(
+        private myhttp: SlicingTaskServices
+    ) {
+    }
+
+  ngOnInit() {
+      this.getNssiList()
+  }
+    selectedValue:string = BUSINESS_STATUS[0];
+    listOfData: any[] = [];
+    pageIndex: number = 1;
+    pageSize: number = 10;
+    total: number = 100;
+    loading = false;
+    isSelect: boolean = false;
+    statusOptions: any[] = BUSINESS_STATUS;
+
+    getNssiList (): void{
+        this.loading = true;
+        this.isSelect = false;
+        let paramsObj = {
+            pageNo: this.pageIndex,
+            pageSize: this.pageSize
+        };
+        if(this.selectedValue !== BUSINESS_STATUS[0]){
+            paramsObj["instanceStatus"] = this.selectedValue;
+            this.isSelect = true;
+        }
+        this.myhttp.getSlicingNssiList(paramsObj,this.isSelect).subscribe (res => {
+            const { result_header: { result_code }, result_body: { nssi_service_instances } } = res;
+            if (+result_code === 200) {
+                this.total = nssi_service_instances.length;
+                this.loading = false;
+                this.listOfData = nssi_service_instances;
+            }
+        })
+    }
+    getListOfProcessingStatus(){
+        this.pageIndex = 1;
+        this.pageSize = 10;
+        this.getNssiList();
+    }
+    searchData(reset: boolean = false) {
+        this.getNssiList();
+    }
+    showdetail(data){
+
+    }
+}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html
index a5ef19b7..80fcc763 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html
@@ -8,7 +8,7 @@
             </nz-select>
         </div>
     </div>
-    <div>
+    <div class="slicing-resource-table-list">
         <nz-table
                 #basicTable
                 [nzData]="listOfData"
diff --git a/usecaseui-portal/src/styles.less b/usecaseui-portal/src/styles.less
index 336c9150..5d372eb3 100644
--- a/usecaseui-portal/src/styles.less
+++ b/usecaseui-portal/src/styles.less
@@ -809,6 +809,12 @@ nz-notification-container .ant-notification{
   background:#313449!important;
 }
 // slicing-resource-management
+.task_status{
+  margin-bottom: 20px;
+  span{
+    margin-right: 5%;
+  }
+}
 .slicing-resource_tab {
   width: 104%;
   margin-left: 20px!important;
@@ -819,4 +825,7 @@ nz-notification-container .ant-notification{
 }
 .slicing-resource-table{
   padding: 20px!important;
+}
+.slicing-resource-table-list{
+  padding: 0 20px 0 0!important;
 }
\ No newline at end of file