summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal')
-rw-r--r--usecaseui-portal/src/app/app.module.ts4
-rw-r--r--usecaseui-portal/src/app/core/services/slicingTaskServices.ts29
-rw-r--r--usecaseui-portal/src/app/mock/json/csmfActivate.json9
-rw-r--r--usecaseui-portal/src/app/mock/json/csmfSlicingProgress.json11
-rw-r--r--usecaseui-portal/src/app/mock/json/csmfTerminate.json9
-rw-r--r--usecaseui-portal/src/app/mock/json/csmf_slicing_businessData.json66
-rw-r--r--usecaseui-portal/src/app/mock/json/csmf_slicing_purchase.json10
-rw-r--r--usecaseui-portal/src/app/mock/routes.js10
-rw-r--r--usecaseui-portal/src/app/mock/server.js17
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html3
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less0
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.spec.ts25
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts24
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.html30
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.less5
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.ts195
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html10
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.ts2
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html2
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.less3
-rw-r--r--usecaseui-portal/src/constants/constants.ts197
-rw-r--r--usecaseui-portal/src/styles.less4
22 files changed, 582 insertions, 83 deletions
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index 48b125de..d46f9f5e 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -97,6 +97,7 @@ import { SlicingBusinessModelComponent } from './views/services/slicing-manageme
import { NsiModelComponent } from './views/services/slicing-management/slicing-resource-management/nsi-management/nsi-model/nsi-model.component';
import { NssiModelComponent } from './views/services/slicing-management/slicing-resource-management/nssi-management/nssi-model/nssi-model.component';
import { CsmfSlicingBusinessManagementComponent } from './views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component';
+import { BusinessOrderComponent } from './views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component';
@NgModule({
providers: [
@@ -158,7 +159,8 @@ import { CsmfSlicingBusinessManagementComponent } from './views/services/slicing
SlicingBusinessModelComponent,
NsiModelComponent,
NssiModelComponent,
- CsmfSlicingBusinessManagementComponent
+ CsmfSlicingBusinessManagementComponent,
+ BusinessOrderComponent
],
imports: [
BrowserModule,
diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
index 7902f0d1..5a1e9110 100644
--- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
+++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
@@ -48,7 +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:"/api/uui-slicing/csmf/5gSlicing",
//monitor 5G
fetchTraffic: this.baseUrl + "/monitoring/queryTimestamp/{queryTimestamp}/trafficData",
fetchOnlineusers: this.baseUrl + "/monitoring/queryTimestamp/{queryTimestamp}/onlineUsers",
@@ -175,6 +180,28 @@ export class SlicingTaskServices {
.replace("{pageSize}", paramsObj.pageSize);
return this.http.get<any>(url);
}
+ // change CSMF slicing business activate status
+ csmfChangeActivate(paramsObj, activate: boolean) {
+ let url = this.url.csmfActivate.replace("{serviceId}", paramsObj.serviceId);
+ if (!activate) {
+ url = this.url.csmfDeactivate.replace("{serviceId}", paramsObj.serviceId)
+ }
+ return this.http.put<any>(url, paramsObj);
+ }
+ // terminate CSMF slicing business
+ csmfTerminate(paramsObj) {
+ const url = this.url.csmfTerminate.replace('{serviceId}', paramsObj.serviceId);
+ return this.http.delete<any>(url);
+ }
+ // query CSMF slicing business progress
+ csmfSlicingProgress(paramsObj) {
+ 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/csmfActivate.json b/usecaseui-portal/src/app/mock/json/csmfActivate.json
new file mode 100644
index 00000000..7b9810a4
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/csmfActivate.json
@@ -0,0 +1,9 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "Activate slicing service processing succeeded."
+ },
+ "result_body": {
+ "operation_id": "3b74758c-4a23-4c44-88bf-e5ed3baa395f"
+ }
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/mock/json/csmfSlicingProgress.json b/usecaseui-portal/src/app/mock/json/csmfSlicingProgress.json
new file mode 100644
index 00000000..d9370a42
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/csmfSlicingProgress.json
@@ -0,0 +1,11 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "Query operation process processing succeeded."
+ },
+ "result_body": {
+ "operation_id": "3b74758c-4a23-4c44-88bf-e5ed3baa395f",
+ "operation_type": "activation",
+ "operation_progress": 66
+ }
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/mock/json/csmfTerminate.json b/usecaseui-portal/src/app/mock/json/csmfTerminate.json
new file mode 100644
index 00000000..5c6d3e2a
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/csmfTerminate.json
@@ -0,0 +1,9 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "Terminate slicing service processing succeeded."
+ },
+ "result_body": {
+ "operation_id": "e227846c-daca-487a-9750-5d0ddb8a95d0"
+ }
+} \ No newline at end of file
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 420f017c..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,11 @@ 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",
///////<-------------monitor 5G--------->/////
"/POST/uui-slicing/nsmf/monitoring/queryTimestamp/:queryTimestamp/trafficData": "/fetchTrafficData",
"/POST/uui-slicing/nsmf/monitoring/queryTimestamp/:queryTimestamp/onlineUsers": "/fetchOnlineusersData",
diff --git a/usecaseui-portal/src/app/mock/server.js b/usecaseui-portal/src/app/mock/server.js
index 3c49777d..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);
@@ -119,6 +119,21 @@ server.delete(`${nsmfBaseUrl}/*`, (req, res, next) => {
req.url = '/DELETE'+req.url;
next();
})
+server.put(`${csmfBaseUrl}/*`, (req, res, next) => {
+ req.method = 'GET';
+ req.url = '/PUT'+req.url;
+ next();
+})
+server.post(`${csmfBaseUrl}/*`, (req, res, next) => {
+ req.method = 'GET';
+ req.url = '/POST'+req.url;
+ next();
+})
+server.delete(`${csmfBaseUrl}/*`, (req, res, next) => {
+ req.method = 'GET';
+ req.url = '/DELETE'+req.url;
+ next();
+})
server.listen(3002, () => {
console.log('Mock Server is successfully running on port 3002 😁')
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
new file mode 100644
index 00000000..d4914dd1
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
@@ -0,0 +1,3 @@
+<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.less b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.less
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.spec.ts
new file mode 100644
index 00000000..1d7a756d
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BusinessOrderComponent } from './business-order.component';
+
+describe('BusinessOrderComponent', () => {
+ let component: BusinessOrderComponent;
+ let fixture: ComponentFixture<BusinessOrderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ BusinessOrderComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BusinessOrderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
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
new file mode 100644
index 00000000..0647b76d
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.ts
@@ -0,0 +1,24 @@
+import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
+import {COMMUNICATION_FORM_ITEMS} from "../../../../../../constants/constants";
+@Component({
+ selector: 'app-business-order',
+ templateUrl: './business-order.component.html',
+ styleUrls: ['./business-order.component.less']
+})
+export class BusinessOrderComponent implements OnInit {
+
+ constructor() { }
+
+ 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 c3f2d631..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
@@ -1,4 +1,4 @@
-<div class="slicing-resource-table slicing-resource_tab">
+<div>
<div nz-row>
<div nz-col nzSpan="12" class="task_status">
<span>Status : </span>
@@ -7,6 +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" (click)="OrderModelShow()">Purchase</button>
</div>
<div class="slicing-resource-table-list">
<nz-table #basicTable [nzData]="listOfData" [nzFrontPagination]="false" nzShowSizeChanger
@@ -17,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>
@@ -27,37 +29,38 @@
<ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index">
<tr>
<td>{{i+1}}</td>
- <td>{{ data.service_id }}</td>
- <td>{{ data.service_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>
<span class="marginLeft10">
- <span *ngIf="data.last_operation_process && data.last_operation_process !== '100'">
- {{data.last_operation_process+'%'}}
+ <span *ngIf="data.last_operation_progress && data.last_operation_progress !== '100'">
+ {{data.last_operation_progress+'%'}}
</span>
<br>
- {{data.service_status}}
+ {{data.order_status}}
</span>
<br>
</td>
<td>
<div class="action-icon">
- <nz-switch [ngModel]="data.service_status==='activated'?true:false"
- [nzDisabled]="data.last_operation_type && data.last_operation_process && data.last_operation_process !== '100'"
+ <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
- *ngIf="data.last_operation_type && data.last_operation_process && data.last_operation_process !== '100' && data.last_operation_type !== 'DELETE'"
- [nzPercent]="data.last_operation_process" [nzShowInfo]="false" nzStatus="active">
+ *ngIf="data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && data.last_operation_type !== 'DELETE'"
+ [nzPercent]="data.last_operation_progress" [nzShowInfo]="false" nzStatus="active">
</nz-progress>
</div>
<div class="action-icon">
- <i [ngClass]="{'cannotclick': data.last_operation_type && data.last_operation_process && data.last_operation_process !== '100' && (data.last_operation_type !== 'DELETE' || data.service_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
- *ngIf="data.last_operation_type && data.last_operation_process && data.last_operation_process !== '100' && terminateStart"
- [nzPercent]="data.last_operation_process" [nzShowInfo]="false" nzStatus="active">
+ *ngIf="data.last_operation_type && data.last_operation_progress && data.last_operation_progress !== '100' && terminateStart"
+ [nzPercent]="data.last_operation_progress" [nzShowInfo]="false" nzStatus="active">
</nz-progress>
</div>
</td>
@@ -66,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.less b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.less
index b813e966..f52f4ad2 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.less
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/csmf-slicing-business-management.component.less
@@ -25,6 +25,7 @@ i.anticon {
color: #aaa;
opacity: 0.6;
}
-.slicing-resource-table{
- margin: 0 0 0 60px!important;
+.buy-button{
+ float: right;
+ margin-right: 2%;
} \ 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 8b844f5f..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
@@ -1,48 +1,76 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
import {BUSINESS_STATUS} from "../../../../../constants/constants";
-import { SlicingTaskServices } from '.././../../../core/services/slicingTaskServices';
+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',
- styleUrls: ['./csmf-slicing-business-management.component.less']
+ selector: 'app-csmf-slicing-business-management',
+ templateUrl: './csmf-slicing-business-management.component.html',
+ styleUrls: ['./csmf-slicing-business-management.component.less']
})
export class CsmfSlicingBusinessManagementComponent implements OnInit {
constructor(
- private myhttp: SlicingTaskServices
+ private myhttp: SlicingTaskServices,
+ private modalService: NzModalService,
+ private message: NzMessageService
) {
}
- ngOnInit() {
- this.getCSMFBusinessList()
- }
+
+ ngOnInit() {
+ this.getCSMFBusinessList()
+ }
+ ngOnDestroy() {
+ this.progressingTimer.forEach((item) => {
+ clearInterval(item.timer);
+ });
+ this.progressingTimer = [];
+ }
+
selectedValue: string = BUSINESS_STATUS[0];
listOfData: any[] = [];
pageIndex: number = 1;
pageSize: number = 10;
total: number = 0;
loading = false;
- isSelect: boolean = false;
statusOptions: any[] = BUSINESS_STATUS;
+ // isSelect: boolean = false;
+ progressingTimer: any[] = [];
terminateStart: boolean = false;
-
- getCSMFBusinessList(){
+ businessOrderShow: boolean = false;
+ getCSMFBusinessList() {
this.loading = true;
+ // this.isSelect = false;
this.listOfData = [];
let paramsObj = {
- status:this.selectedValue,
+ status: this.selectedValue,
pageNo: this.pageIndex,
pageSize: this.pageSize
};
+ // 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_service_list, record_number } } = 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_service_list !==null && slicing_service_list.length >0){
- this.listOfData = slicing_service_list.map((item, index) => {
- if (item.last_operation_process && item.last_operation_type && Number(item.last_operation_process) < 100) {
-
+ 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.order_id
+ };
if (item.last_operation_type === 'DELETE') this.terminateStart = true;
+ this.queryProgress(obj, index, updata).then((res) => {
+ item.last_operation_progress = '100';
+ this.getCSMFBusinessList();
+ })
}
return item
});
@@ -54,16 +82,143 @@ export class CsmfSlicingBusinessManagementComponent implements OnInit {
getListOfProcessingStatus() {
this.pageIndex = 1;
this.pageSize = 10;
+ this.progressingTimer.forEach((item) => {
+ clearInterval(item.timer);
+ });
+ this.progressingTimer = [];
this.getCSMFBusinessList();
}
+
searchData(reset: boolean = false) {
+ this.progressingTimer.forEach((item) => {
+ clearInterval(item.timer);
+ });
+ this.progressingTimer = [];
this.getCSMFBusinessList();
}
switchChange(slicing, i) {
- console.log(slicing,i,"slicing")
+ console.log(slicing, i, "slicing");
+ this.modalService.confirm({
+ nzTitle: '<i>Are you sure you want to perform this task?</i>',
+ nzContent: '<b>Name:' + slicing.order_name + '</b>',
+ nzOnOk: () => {
+ let paramsObj = {
+ serviceId: slicing.order_id
+ };
+ if (slicing.order_status === 'activated') {
+ this.changeActivate(paramsObj, false, slicing, "deactivate", "deactivated", i)
+ } else {
+ this.changeActivate(paramsObj, true, slicing, "activate", "activated", i);
+ }
+ },
+ nzCancelText: 'No',
+ nzOnCancel: () => {
+ let singleSlicing = Object.assign({}, this.listOfData[i]);
+ this.listOfData[i] = singleSlicing;
+ this.listOfData = [...this.listOfData];
+ }
+ });
}
+ changeActivate(paramsObj, isActivate, slicing, activateValue, finished, index) {
+ this.loading = true;
+ this.myhttp.changeActivateSlicingService(paramsObj, isActivate).subscribe(res => {
+ const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
+ this.loading = false;
+ if (+result_code === 200) {
+ this.getCSMFBusinessList();
+ } else {
+ let singleSlicing = Object.assign({}, this.listOfData[index]);
+ this.listOfData[index] = singleSlicing;
+ this.listOfData = [...this.listOfData];
+ this.getCSMFBusinessList();
+ }
+ this.getCSMFBusinessList();
+ }, () => {
+ this.loading = false;
+ let singleSlicing = Object.assign({}, this.listOfData[index]);
+ this.listOfData[index] = singleSlicing;
+ this.listOfData = [...this.listOfData];
+ this.getCSMFBusinessList();
+ })
+ }
+
terminate(slicing) {
- console.log(slicing,"slicing")
+ console.log(slicing, "slicing");
+ this.modalService.confirm({
+ nzTitle: 'Are you sure you want to terminate this task?',
+ nzContent: '<b>Name:&nbsp;</b>' + slicing.order_name,
+ nzOnOk: () => {
+ let paramsObj = { serviceId: slicing.order_id };
+ this.terminateStart = true;
+ this.loading = true;
+ this.myhttp.terminateSlicingService(paramsObj).subscribe(res => {
+ const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
+ this.loading = false;
+ if (+result_code === 200) {
+ this.getCSMFBusinessList();
+ } else {
+ this.terminateStart = false;
+ }
+ }, () => {
+ this.loading = false;
+ this.terminateStart = false;
+ })
+ },
+ nzCancelText: 'No',
+ nzOnCancel: () => {
+ console.info('Cancel termination')
+ }
+ });
+ }
+ queryProgress(obj, index, callback) {
+ return new Promise(res => {
+ let requery = () => {
+ this.myhttp.getSlicingBusinessProgress(obj)
+ .subscribe((data) => {
+ const { result_header: { result_code, result_message }, result_body: { operation_id } } = data;
+ if (+result_code === 200) {
+ if (data.result_body.operation_progress && Number(data.result_body.operation_progress) < 100) {
+ callback(data.result_body);
+ let progressSetTimeOut = setTimeout(() => {
+ requery();
+ }, 5000);
+ this.progressingTimer.push({
+ id: obj.serviceId,
+ timer: progressSetTimeOut
+ })
+ } else {
+ this.progressingTimer.forEach((item) => {
+ if (item.serviceId === obj.serviceId) {
+ clearInterval(item.timer);
+ }
+ });
+ res(data.result_body);
+ }
+ } else {
+ this.progressingTimer.forEach((item) => {
+ if (item.serviceId === obj.serviceId) {
+ clearInterval(item.timer);
+ }
+ });
+ this.getCSMFBusinessList();
+ this.message.error(result_message);
+ }
+ }, (err) => {
+ this.progressingTimer.forEach((item) => {
+ if (item.serviceId === obj.serviceId) {
+ clearInterval(item.timer);
+ }
+ });
+ this.getCSMFBusinessList();
+ this.message.error(err);
+ })
+ };
+ requery();
+ })
+ }
+
+ OrderModelShow(){
+ this.businessOrderShow = true;
}
}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html
index 965dca6a..1de13788 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html
@@ -1,4 +1,9 @@
<nz-tabset (nzSelectChange)="handleTabChange($event)" class="slicing">
+ <nz-tab nzTitle="communication Service">
+ <app-csmf-slicing-business-management
+ *ngIf="currentTab ==='communication Service'"
+ ></app-csmf-slicing-business-management>
+ </nz-tab>
<nz-tab nzTitle="Slicing Task Management">
<app-slicing-task-management
*ngIf="currentTab ==='Slicing Task Management'"
@@ -9,9 +14,4 @@
*ngIf="currentTab ==='Slicing Resource Management'"
></app-slicing-resource-management>
</nz-tab>
- <nz-tab nzTitle="CSMF Slicing Business Management">
- <app-csmf-slicing-business-management
- *ngIf="currentTab ==='CSMF Slicing Business Management'"
- ></app-csmf-slicing-business-management>
- </nz-tab>
</nz-tabset> \ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.ts
index e2ca18e2..597e4ee9 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.ts
@@ -15,7 +15,7 @@ export class SlicingManagementComponent implements OnInit {
ngOnInit() {
}
- currentTab = 'Slicing Task Management';
+ currentTab = 'communication Service';
handleTabChange($event): void {
console.log($event,"$event");
this.currentTab = $event.tab._title;
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
index d7cb2f8d..415f5241 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.html
@@ -1,4 +1,4 @@
-<div>
+<div class="slicing-task-resource-table">
<div nz-row>
<div nz-col nzSpan="12" class="task_status">
<span>Status : </span>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.less
index 78ae9c6e..17951f40 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.less
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-management.component.less
@@ -21,4 +21,7 @@ nz-select {
.task_operation_disabled {
color: #A2ABCE;
cursor: default;
+}
+.slicing-task-resource-table{
+ margin: 0 0 0 50px!important;
} \ No newline at end of file
diff --git a/usecaseui-portal/src/constants/constants.ts b/usecaseui-portal/src/constants/constants.ts
index 68c5c2e9..8973f184 100644
--- a/usecaseui-portal/src/constants/constants.ts
+++ b/usecaseui-portal/src/constants/constants.ts
@@ -244,4 +244,201 @@ export const ADDRESS = [
]
export const BUSINESS_STATUS = [
"All", "activated", "deactivated"
+]
+
+export const COMMUNICATION_FORM_ITEMS = [
+ {
+ title: 'Slicing Business Name',
+ key: 'name'
+ },
+ {
+ title: 'Max Number of UEs',
+ key: 'maxNumberofUEs'
+ },
+ {
+ title: 'Data Rate Downlink (Mbps)',
+ key: 'expDataRateDL'
+ },
+ {
+ title: 'Latency',
+ key: 'latency'
+ },
+ {
+ title: 'Data Rate Uplink (Mbps)',
+ key: 'expDataRateUL'
+ },
+ {
+ title: 'Resource Sharing Level',
+ key: 'resourceSharingLevel',
+ options: [
+ {
+ title: 'Shared',
+ key: 'shared'
+ },
+ {
+ title: 'Non-shared',
+ key: 'no-shared'
+ }
+ ]
+ },
+ {
+ title: 'Mobility',
+ key: 'uEMobilityLevel',
+ options: [
+ {
+ title: 'Stationary',
+ key: 'stationary'
+ },
+ {
+ title: 'Nomadic',
+ key: 'nomadic'
+ },
+ {
+ title: 'Spatially Restricted Mobility',
+ key: 'spatially restricted mobility'
+ },
+ {
+ title: 'Fully Mobility',
+ key: 'fully mobility'
+ }
+ ]
+ },
+ {
+ title: 'Use Interval (Month)',
+ key: 'useInterval'
+ },
+ {
+ title: 'Area',
+ key: 'coverageArea'
+ }
+]
+
+export const COMMUNICATION_FORM_ADDRESS = [
+ {
+ "id": "1",
+ "name": "Beijing",
+ "city": [
+ {
+ "id": "101",
+ "name": "Beijing",
+ "county": [
+ {
+ "id": "1001",
+ "name": "Haiding District",
+ "street": [
+ {
+ "id": "100101",
+ "name": "Wanshoulu Street"
+ },
+ {
+ "id": "100102",
+ "name": "Zhongguancun Street"
+ },
+ {
+ "id": "100103",
+ "name": "Haidian Street"
+ },
+ {
+ "id": "100104",
+ "name": "Xisanqi Street"
+ }
+ ]
+ },
+ {
+ "id": "1002",
+ "name": "Xicheng District",
+ "street": [
+ {
+ "id": "100201",
+ "name": "Guang'anmenwai Street"
+ },
+ {
+ "id": "100202",
+ "name": "Xuanwumen Street"
+ },
+ {
+ "id": "100203",
+ "name": "West Changan Street"
+ },
+ {
+ "id": "100204",
+ "name": "Financial Street"
+ }
+ ]
+ },
+ {
+ "id": "1003",
+ "name": "Changping District",
+ "street": [
+ {
+ "id": "100301",
+ "name": "Chengbei Street"
+ },
+ {
+ "id": "100302",
+ "name": "Chengnan Street"
+ },
+ {
+ "id": "100303",
+ "name": "Tiantongyuan North Street"
+ },
+ {
+ "id": "100304",
+ "name": "Tiantongyuan South Street"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+ },
+ {
+ "id": "2",
+ "name": "Shanghai",
+ "city": [{
+ "id": "201",
+ "name": "Shanghai City",
+ "county": [{
+ "id": "2001",
+ "name": "udongxin District",
+ "street": [
+ {
+ "id": "200101",
+ "name": "Lujiazui Street"
+ },
+ {
+ "id": "200102",
+ "name": "Zhoujiadu Street"
+ },
+ {
+ "id": "200103",
+ "name": "Tangqiao Street"
+ },
+ {
+ "id": "200104",
+ "name": "Nanquanlu Street"
+ }
+ ]
+ },
+ {
+ "id": "2002",
+ "name": "Jingan District",
+ "street": [
+ {
+ "id": "200201",
+ "name": "Jiangning Lu Street"
+ },
+ {
+ "id": "200202",
+ "name": "Jing'an Temple Street"
+ },
+ {
+ "id": "200203",
+ "name": "Nanjing West Road Street"
+ }
+ ]
+ }
+ ]
+ }]
+ }
] \ No newline at end of file
diff --git a/usecaseui-portal/src/styles.less b/usecaseui-portal/src/styles.less
index 6f10e362..bd3a6b79 100644
--- a/usecaseui-portal/src/styles.less
+++ b/usecaseui-portal/src/styles.less
@@ -816,8 +816,8 @@ nz-notification-container .ant-notification{
}
}
.slicing-resource_tab {
- width: 104%;
- margin-left: 20px!important;
+ width: 103%;
+ margin-left: 60px!important;
margin-top: -35px!important;
.ant-tabs-content.ant-tabs-content-animated{
padding: 20px 0!important;