feat: Optimize slice business management

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

9 files changed, 99 insertions, 66 deletions

diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
index 05cf188c..5a1e9110 100644
--- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
+++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
@@ -48,12 +48,12 @@ export class SlicingTaskServices {
         slicingNssiQueryOfStatus: this.baseUrl + "/resource/nssi/instanceStatus/{instanceStatus}/instances/pageNo/{pageNo}/pageSize/{pageSize}",

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

         //csmf

-        csmfSlicingBusinessList:"/api/usecaseui/csmf/5gSlicing/services/status/{status}/pageNo/{pageNo}/pageSize/{pageSize}",

+        csmfSlicingBusinessList:"/api/uui-slicing/csmf/5gSlicing/orders/status/{status}/pageNo/{pageNo}/pageSize/{pageSize}",

         csmfActivate:"/api/usecaseui/csmf/5gSlicing/service/{serviceId}/activate",

         csmfDeactivate:"/api/usecaseui/csmf/5gSlicing/service/{serviceId}/deactivate",

         csmfTerminate:"/api/usecaseui/csmf/5gSlicing/service/{serviceId}",

         csmfGetProgress:"/api/usecaseui/csmf/5gSlicing/service/{serviceId}/progress",

-        csmfPurchase:"/uui-slicing/csmf/5gSlicing ",

+        csmfPurchase:"/api/uui-slicing/csmf/5gSlicing",

         //monitor 5G

         fetchTraffic: this.baseUrl + "/monitoring/queryTimestamp/{queryTimestamp}/trafficData",

         fetchOnlineusers: this.baseUrl + "/monitoring/queryTimestamp/{queryTimestamp}/onlineUsers",

@@ -198,6 +198,10 @@ export class SlicingTaskServices {
         let url = this.url.csmfGetProgress.replace("{serviceId}", paramsObj.serviceId);

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

     }

+    csmfSlicingPurchase(paramsObj){

+        let url = this.url.csmfPurchase;

+        return this.http.post<any>(url, paramsObj);

+    }

 

     //monitor 5G

     getFetchTraffic(service_list, time) {

diff --git a/usecaseui-portal/src/app/mock/json/csmf_slicing_businessData.json b/usecaseui-portal/src/app/mock/json/csmf_slicing_businessData.json
index 4ec93450..15a0ee8a 100644
--- a/usecaseui-portal/src/app/mock/json/csmf_slicing_businessData.json
+++ b/usecaseui-portal/src/app/mock/json/csmf_slicing_businessData.json
@@ -5,84 +5,84 @@
   },
   "result_body": {
     "record_number": 8,
-    "slicing_service_list": [
+    "slicing_order_list": [
       {
-        "service_id": "5G-777",
-        "service_name": "eMBB_e2e_Slice_Service_5GCustomer",
+        "order_id": "5G-777",
+        "order_name": "eMBB_e2e_Slice_Service_5GCustomer",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-010101",
-        "service_status": "activated",
-        "last_operation_id": "8401c767-4fe9-43c3-82b5-707c1aaf5caf",
+        "order_status": "activated",
         "last_operation_type": "activation",
         "last_operation_process": 100
       },
       {
-        "service_id": "8c681037-75c9-444c-a665-34a66372e13e",
-        "service_name": "test_0203",
+        "order_id": "8c681037-75c9-444c-a665-34a66372e13e",
+        "order_name": "test_0203",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-1370889D",
-        "service_status": "deactivated",
-        "last_operation_id": null,
+        "order_status": "deactivated",
         "last_operation_type": null,
         "last_operation_process": null
       },
       {
-        "service_id": "dfa76a2f-6416-4070-9024-355d0d210234",
-        "service_name": "CSMFService",
+        "order_id": "dfa76a2f-6416-4070-9024-355d0d210234",
+        "order_name": "CSMFService",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-485C16B6",
-        "service_status": "deactivated",
-        "last_operation_id": "06258836-8152-43ad-9c8e-e2a1783b1996",
+        "order_status": "deactivated",
         "last_operation_type": "activation",
         "last_operation_process": 0
       },
       {
-        "service_id": "1e6a6a4b-8efb-4211-b583-b2e8567c5950",
-        "service_name": "CSMFService",
+        "order_id": "1e6a6a4b-8efb-4211-b583-b2e8567c5950",
+        "order_name": "CSMFService",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-6C572676",
-        "service_status": "deactivated",
-        "last_operation_id": null,
+        "order_status": "deactivated",
         "last_operation_type": null,
         "last_operation_process": null
       },
       {
-        "service_id": "9941305e-311f-4a88-bd9e-431252a46337",
-        "service_name": "CSMFService",
+        "order_id": "9941305e-311f-4a88-bd9e-431252a46337",
+        "order_name": "CSMFService",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-D38E2F0",
-        "service_status": "deactivated",
-        "last_operation_id": null,
+        "order_status": "deactivated",
         "last_operation_type": null,
         "last_operation_process": null
       },
       {
-        "service_id": "4876265d-e4bb-4240-bcda-7b4b00481e4a",
-        "service_name": "test_0205",
+        "order_id": "4876265d-e4bb-4240-bcda-7b4b00481e4a",
+        "order_name": "test_0205",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-6A345C48",
-        "service_status": "deactivated",
-        "last_operation_id": null,
+        "order_status": "deactivated",
         "last_operation_type": null,
         "last_operation_process": null
       },
       {
-        "service_id": "6c52086a-e9b6-4f31-bc7a-7b34d66c69c0",
-        "service_name": "test_0204",
+        "order_id": "6c52086a-e9b6-4f31-bc7a-7b34d66c69c0",
+        "order_name": "test_0204",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-774F54FC",
-        "service_status": "deactivated",
-        "last_operation_id": null,
+        "order_status": "deactivated",
         "last_operation_type": null,
         "last_operation_process": null
       },
       {
-        "service_id": "1cab507a-3422-46f8-8520-9b46c95b7f9d",
-        "service_name": "aaa",
+        "order_id": "1cab507a-3422-46f8-8520-9b46c95b7f9d",
+        "order_name": "aaa",
+        "order_creation_time":"1454171445000",
         "service_type": "embb",
         "service_snssai": "01-44AA4085",
-        "service_status": "deactivated",
-        "last_operation_id": "012c888a-a46f-4ebc-bcde-7f7c769769b7",
+        "order_status": "deactivated",
         "last_operation_type": "DELETE",
         "last_operation_process": 100
       }
diff --git a/usecaseui-portal/src/app/mock/json/csmf_slicing_purchase.json b/usecaseui-portal/src/app/mock/json/csmf_slicing_purchase.json
new file mode 100644
index 00000000..1893f80d
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/csmf_slicing_purchase.json
@@ -0,0 +1,10 @@
+{
+  "result_header": {
+    "result_code": "200",
+    "result_message": "5G slicing order created normally."
+  },
+  "result_body": {
+    "service_id": "service123456",
+    "operation_id": "operation123456"
+  }
+}
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/mock/routes.js b/usecaseui-portal/src/app/mock/routes.js
index c454d5ba..85cb6fdd 100644
--- a/usecaseui-portal/src/app/mock/routes.js
+++ b/usecaseui-portal/src/app/mock/routes.js
@@ -20,8 +20,8 @@ module.exports =
         ///////<-------------api proxy--------->/////
         "/usecaseui-server/v1/*": "/$1",
         "/usecaseui-server/v1/*?:param": "/$1",
-        "/usecaseui/csmf/*": "/$1",
-        "/usecaseui/csmf/*?:param": "/$1",
+        "/uui-slicing/csmf/*": "/$1",
+        "/uui-slicing/csmf/*?:param": "/$1",
         ///////////////
 
         //text interface
@@ -120,7 +120,8 @@ module.exports =
         "/uui-slicing/nsmf/resource/nssi/instanceStatus/:instanceStatus/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_nssi_list_activated",
         "/uui-slicing/nsmf/resource/nssi/:nssiId/details":"/getSlicingNssiDetail",
         ///////<-------------CSMF slicing_business--------->/////
-        "/5gSlicing/services/status/:status/pageNo/:pageNo/pageSize/:pageSize": "/csmf_slicing_businessData",
+        "/5gSlicing/orders/status/:status/pageNo/:pageNo/pageSize/:pageSize": "/csmf_slicing_businessData",
+        "/POST/uui-slicing/csmf/5gSlicing": "/csmf_slicing_purchase",
         "/PUT/usecaseui/csmf/5gSlicing/service/:serviceId/activate": "/csmfActivate",
         "/DELETE/usecaseui/csmf/5gSlicing/service/:serviceId": "/csmfTerminate",
         "/5gSlicing/service/:serviceId/progress": "/csmfSlicingProgress",
diff --git a/usecaseui-portal/src/app/mock/server.js b/usecaseui-portal/src/app/mock/server.js
index 6dc00815..63e6167c 100644
--- a/usecaseui-portal/src/app/mock/server.js
+++ b/usecaseui-portal/src/app/mock/server.js
@@ -20,7 +20,7 @@ const middlewares = jsonServer.defaults();
 const customersRouters = require('./routes');
 const baseUrl = "/usecaseui-server/v1";
 const nsmfBaseUrl = "/uui-slicing/nsmf"; 
-const csmfBaseUrl = "/usecaseui/csmf";
+const csmfBaseUrl = "/uui-slicing/csmf";
 
 // Set default middlewares (logger, static, cors and no-cache)
 server.use(middlewares);
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
index 606d9e15..d4914dd1 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
@@ -1,3 +1,3 @@
-<p>
-  business-order works!
-</p>
+<nz-modal [(nzVisible)]="showModel" nzTitle="Create Slicing Business Order" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()"
+          nzWidth="900px">
+</nz-modal>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
index bf95a83c..0647b76d 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
 import {COMMUNICATION_FORM_ITEMS} from "../../../../../../constants/constants";
 @Component({
   selector: 'app-business-order',
@@ -11,5 +11,14 @@ export class BusinessOrderComponent implements OnInit {
 
   ngOnInit() {
   }
+    @Input() showModel: boolean;
+    @Output() cancel = new EventEmitter<boolean>();
 
+    handleCancel() {
+        this.showModel = false;
+        this.cancel.emit(this.showModel)
+    }
+    handleOk() {
+        console.log(1)
+    }
 }
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
index c260de77..818fc136 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html
@@ -7,7 +7,7 @@
         <nz-option *ngFor="let item of statusOptions" [nzLabel]="item" [nzValue]="item"></nz-option>
       </nz-select>
     </div>
-    <button nz-button nzType="primary" class="buy-button">Purchase</button>
+    <button nz-button nzType="primary" class="buy-button" (click)="OrderModelShow()">Purchase</button>
   </div>
   <div class="slicing-resource-table-list">
     <nz-table #basicTable [nzData]="listOfData" [nzFrontPagination]="false" nzShowSizeChanger
@@ -18,6 +18,7 @@
         <th width=100>No</th>
         <th width=280>Service Instance Id</th>
         <th width=200>Service Instance Name</th>
+        <th width=200>Creation Time</th>
         <th width=110>Service Type</th>
         <th width=110>S-NSSAI</th>
         <th width=110>Status</th>
@@ -28,8 +29,9 @@
       <ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index">
         <tr>
           <td>{{i+1}}</td>
-          <td>{{ data.service_instance_id }}</td>
-          <td>{{ data.service_instance_name }}</td>
+          <td>{{ data.order_id }}</td>
+          <td>{{ data.order_name }}</td>
+          <td>{{ data.order_creation_time }}</td>
           <td>{{ data.service_type?data.service_type:'--' }}</td>
           <td>{{ data.service_snssai }}</td>
           <td>
@@ -38,13 +40,13 @@
                                     {{data.last_operation_progress+'%'}}
                                 </span>
                                 <br>
-                                {{data.orchestration_status}}
+                                {{data.order_status}}
                             </span>
             <br>
           </td>
           <td>
             <div class="action-icon">
-              <nz-switch [ngModel]="data.orchestration_status==='activated'?true:false"
+              <nz-switch [ngModel]="data.order_status==='activated'?true:false"
                          [nzDisabled]="data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100'"
                          (ngModelChange)="switchChange(data,i)"></nz-switch>
               <nz-progress
@@ -53,7 +55,7 @@
               </nz-progress>
             </div>
             <div class="action-icon">
-              <i [ngClass]="{'cannotclick': data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && (data.last_operation_type !== 'DELETE' || data.orchestration_status==='activated')}"
+              <i [ngClass]="{'cannotclick': data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && (data.last_operation_type !== 'DELETE' || data.order_status==='activated')}"
                  nz-icon nzType="poweroff" nzTheme="outline" class="anticon anticon-poweroff"
                  (click)="terminate(data)"></i>
               <nz-progress
@@ -67,4 +69,5 @@
       </tbody>
     </nz-table>
   </div>
+  <app-business-order [showModel]="businessOrderShow" (cancel)="businessOrderShow=$event"></app-business-order>
 </div>
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
index fac4e0cf..76f0bcdf 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts
@@ -2,6 +2,7 @@ import {Component, OnInit} from '@angular/core';
 import {BUSINESS_STATUS} from "../../../../../constants/constants";
 import {SlicingTaskServices} from '.././../../../core/services/slicingTaskServices';
 import { NzModalService, NzMessageService } from 'ng-zorro-antd';
+import *as moment from 'moment';
 @Component({
     selector: 'app-csmf-slicing-business-management',
     templateUrl: './csmf-slicing-business-management.component.html',
@@ -33,36 +34,37 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
     total: number = 0;
     loading = false;
     statusOptions: any[] = BUSINESS_STATUS;
-    isSelect: boolean = false;
+    // isSelect: boolean = false;
     progressingTimer: any[] = [];
     terminateStart: boolean = false;
-
+    businessOrderShow: boolean = false;
     getCSMFBusinessList() {
         this.loading = true;
-        this.isSelect = false;
+        // this.isSelect = false;
         this.listOfData = [];
         let paramsObj = {
             status: this.selectedValue,
             pageNo: this.pageIndex,
             pageSize: this.pageSize
         };
-        if (this.selectedValue !== BUSINESS_STATUS[0]) {
-            paramsObj["businessStatus"] = this.selectedValue;
-            this.isSelect = true;
-        }
-        this.myhttp.getSlicingBusinessList(paramsObj, this.isSelect).subscribe(res => {
-            const {result_header: {result_code}, result_body: {slicing_business_list, record_number}} = res;
+        // if (this.selectedValue !== BUSINESS_STATUS[0]) {
+        //     paramsObj["businessStatus"] = this.selectedValue;
+        //     this.isSelect = true;
+        // }
+        this.myhttp.getCSMFSlicingBusinessList(paramsObj).subscribe(res => {
+            const {result_header: {result_code}, result_body: {slicing_order_list, record_number}} = res;
             this.loading = false;
             if (+result_code === 200) {
                 this.total = record_number;
-                if (slicing_business_list !== null && slicing_business_list.length > 0) {
-                    this.listOfData = slicing_business_list.map((item, index) => {
+                if (slicing_order_list !== null && slicing_order_list.length > 0) {
+                    this.listOfData = slicing_order_list.map((item, index) => {
+                        item.order_creation_time =  moment(Number(item.order_creation_time)).format('YYYY-MM-DD');
                         if (item.last_operation_progress && item.last_operation_type && Number(item.last_operation_progress) < 100) {
                             let updata = (prodata: { operation_progress: string }) => {
                                 item.last_operation_progress = prodata.operation_progress || item.last_operation_progress;
                             };
                             let obj = {
-                                serviceId: item.service_instance_id
+                                serviceId: item.order_id
                             };
                             if (item.last_operation_type === 'DELETE') this.terminateStart = true;
                             this.queryProgress(obj, index, updata).then((res) => {
@@ -99,12 +101,12 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
         console.log(slicing, i, "slicing");
         this.modalService.confirm({
             nzTitle: '<i>Are you sure you want to perform this task?</i>',
-            nzContent: '<b>Name:' + slicing.service_instance_name + '</b>',
+            nzContent: '<b>Name:' + slicing.order_name + '</b>',
             nzOnOk: () => {
                 let paramsObj = {
-                    serviceId: slicing.service_instance_id
+                    serviceId: slicing.order_id
                 };
-                if (slicing.orchestration_status === 'activated') {
+                if (slicing.order_status === 'activated') {
                     this.changeActivate(paramsObj, false, slicing, "deactivate", "deactivated", i)
                 } else {
                     this.changeActivate(paramsObj, true, slicing, "activate", "activated", i);
@@ -145,9 +147,9 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
         console.log(slicing, "slicing");
         this.modalService.confirm({
             nzTitle: 'Are you sure you want to terminate this task?',
-            nzContent: '<b>Name:&nbsp;</b>' + slicing.service_instance_name,
+            nzContent: '<b>Name:&nbsp;</b>' + slicing.order_name,
             nzOnOk: () => {
-                let paramsObj = { serviceId: slicing.service_instance_id };
+                let paramsObj = { serviceId: slicing.order_id };
                 this.terminateStart = true;
                 this.loading = true;
                 this.myhttp.terminateSlicingService(paramsObj).subscribe(res => {
@@ -215,4 +217,8 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
             requery();
         })
     }
+
+    OrderModelShow(){
+        this.businessOrderShow = true;
+    }
 }