summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-12-05 00:29:23 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-12-05 00:29:30 +0800
commite53295bc15043f9d343897f3c8a4b6848cdf0c44 (patch)
tree0e1c4186516f8c7db78422aaefed910957b107e6 /usecaseui-portal
parent7a7b81477be87698d847f9424fa58d4cdf64a143 (diff)
feat:Add progress interface query of slicing business page
Change-Id: I8a974d5fa75546a937ad9755a33dee75374fb59d Issue-ID: USECASEUI-352 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal')
-rw-r--r--usecaseui-portal/src/app/core/services/slicingTaskServices.ts21
-rw-r--r--usecaseui-portal/src/app/mock/json/getSlicingBusinessProgress.json10
-rw-r--r--usecaseui-portal/src/app/mock/json/slicing_business_activate.json9
-rw-r--r--usecaseui-portal/src/app/mock/json/slicing_business_list.json54
-rw-r--r--usecaseui-portal/src/app/mock/json/slicing_business_list_activated.json38
-rw-r--r--usecaseui-portal/src/app/mock/routes.js5
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html11
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less3
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts146
9 files changed, 201 insertions, 96 deletions
diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
index 9d2d1280..fffa5801 100644
--- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
+++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts
@@ -78,11 +78,15 @@ export class SlicingTaskServices {
}
// Get slicing business list
- getSlicingBusinessList (paramsObj) {
- const url = this.url.slicingBusinessList
- .replace("{pageNo}", paramsObj.pageNo)
+ getSlicingBusinessList (paramsObj,isSelect: boolean) {
+ let url = this.url.slicingBusinessList .replace("{pageNo}", paramsObj.pageNo)
.replace("{pageSize}", paramsObj.pageSize);
- return this.http.get<any>(url);
+ if(isSelect){
+ url = this.url.slicingBusinesQueryOfStatus.replace("{businessStatus}", paramsObj.businessStatus).replace("{pageNo}", paramsObj.pageNo)
+ .replace("{pageSize}", paramsObj.pageSize);
+ }
+ let params = new HttpParams({ fromObject: paramsObj });
+ return this.http.get<any>(url,{params});
}
changeActivateSlicingService(paramsObj, activate: boolean){
let url = this.url.activateSlicingService.replace("{serviceId}", paramsObj.serviceId);
@@ -91,6 +95,15 @@ export class SlicingTaskServices {
}
return this.http.put<any>(url,paramsObj);
}
+ terminateSlicingService(paramsObj){
+ const url = this.url.terminateSlicingService.replace('{serviceId}', paramsObj.serviceId);
+ return this.http.delete<any>(url);
+ }
+ getSlicingBusinessProgress(paramsObj) {
+ let params = new HttpParams({ fromObject: paramsObj });
+ let url = this.url.queryOperationProgress.replace("{serviceId}", paramsObj.serviceId);
+ return this.http.get<any>(url,{params});
+ }
}
diff --git a/usecaseui-portal/src/app/mock/json/getSlicingBusinessProgress.json b/usecaseui-portal/src/app/mock/json/getSlicingBusinessProgress.json
new file mode 100644
index 00000000..b14111fe
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/getSlicingBusinessProgress.json
@@ -0,0 +1,10 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "5G slicing service operation progress."
+ },
+ "result_body": {
+ "operation_type": "activate",
+ "operation_progress": 99
+ }
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/mock/json/slicing_business_activate.json b/usecaseui-portal/src/app/mock/json/slicing_business_activate.json
new file mode 100644
index 00000000..988577bf
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/slicing_business_activate.json
@@ -0,0 +1,9 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "5G slicing service has been activated."
+ },
+ "result_body": {
+ "operation_id": "123456"
+ }
+} \ No newline at end of file
diff --git a/usecaseui-portal/src/app/mock/json/slicing_business_list.json b/usecaseui-portal/src/app/mock/json/slicing_business_list.json
index 45fa0260..8291efbf 100644
--- a/usecaseui-portal/src/app/mock/json/slicing_business_list.json
+++ b/usecaseui-portal/src/app/mock/json/slicing_business_list.json
@@ -7,51 +7,6 @@
"record_number": 2,
"slicing_business_list": [
{
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9269",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 10
- },
- {
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9261",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 20
- },
- {
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9262",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 30
- },
- {
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9263",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 50
- },
- {
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9264",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 70
- },
- {
"service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9265",
"service_instance_name": "slicing-01-eMBB",
"service_type": "eMMB",
@@ -79,15 +34,6 @@
"last_operation_progress": 100
},
{
- "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9268",
- "service_instance_name": "slicing-01-eMBB",
- "service_type": "eMMB",
- "service_snssai": "1-010101",
- "orchestration_status": "activated",
- "last_operation_type": "activate",
- "last_operation_progress": 100
- },
- {
"service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9270",
"service_instance_name": "slicing-01-eMBB",
"service_type": "eMMB",
diff --git a/usecaseui-portal/src/app/mock/json/slicing_business_list_activated.json b/usecaseui-portal/src/app/mock/json/slicing_business_list_activated.json
new file mode 100644
index 00000000..bc3172af
--- /dev/null
+++ b/usecaseui-portal/src/app/mock/json/slicing_business_list_activated.json
@@ -0,0 +1,38 @@
+{
+ "result_header": {
+ "result_code": "200",
+ "result_message": "5G slicing service instances query based on status result ."
+ },
+ "result_body": {
+ "record_number": 2,
+ "slicing_business_list": [
+ {
+ "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9260",
+ "service_instance_name": "slicing-01-eMBB",
+ "service_type": "eMMB",
+ "service_snssai": "1-010101",
+ "orchestration_status": "activated",
+ "last_operation_type": "activate",
+ "last_operation_progress": 10
+ },
+ {
+ "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9272",
+ "service_instance_name": "slicing-01-eMBB",
+ "service_type": "eMMB",
+ "service_snssai": "1-010101",
+ "orchestration_status": "activated",
+ "last_operation_type": "activate",
+ "last_operation_progress": 70
+ },
+ {
+ "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9273",
+ "service_instance_name": "slicing-01-eMBB",
+ "service_type": "eMMB",
+ "service_snssai": "1-010101",
+ "orchestration_status": "activated",
+ "last_operation_type": "activate",
+ "last_operation_progress": 100
+ }
+ ]
+ }
+} \ 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 dbc9fec3..5bc81fbd 100644
--- a/usecaseui-portal/src/app/mock/routes.js
+++ b/usecaseui-portal/src/app/mock/routes.js
@@ -100,6 +100,11 @@ module.exports =
"/uui-slicing/nsmf/resource/nssi/:environmentContext/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_subnet_context",
///////<-------------slicing_business--------->/////
"/uui-slicing/nsmf/resource/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_business_list",
+ "/uui-slicing/nsmf/resource/:businessStatus/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_business_list_activated",
+ "/PUT/uui-slicing/nsmf/resource/:serviceId/activate": "/slicing_business_activate",
+ "/PUT/uui-slicing/nsmf/resource/:serviceId/deactivate": "/slicing_business_activate",
+ "/DELETE/uui-slicing/nsmf/resource/:serviceId": "/slicing_business_activate",
+ "/uui-slicing/nsmf/resource/:serviceId/progress":"/getSlicingBusinessProgress",
///////<-------------general interface--------->/////
"/api/*": "/$1",
"/*/*": "/$1_$2",
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 fde155a5..07bdc07e 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
@@ -28,8 +28,8 @@
<th>Service_type</th>
<th>S-NSSAI</th>
<th>Orchestration_status</th>
- <th>Aciton</th>
- <th>Detail</th>
+ <th width="130px">Aciton</th>
+ <th width="100px">Detail</th>
</tr>
</thead>
<tbody>
@@ -42,14 +42,14 @@
<td>
<span class="marginLeft10">
- {{ data.last_operation_progress!==100?data.last_operation_type+'&nbsp;&nbsp;&nbsp;'+data.last_operation_progress+'%':data.orchestration_status }}
+ {{ data.last_operation_progress !== 100?data.last_operation_type+'&nbsp;&nbsp;&nbsp;'+data.last_operation_progress+'%':data.orchestration_status }}
</span>
<nz-progress *ngIf="data.last_operation_progress !== 100"
[nzPercent]="data.last_operation_progress"
[nzShowInfo]="false" nzStatus="active"></nz-progress>
</td>
<td>
- <nz-switch [ngModel]="switchStatusAll[i]==='activated'?true:false"
+ <nz-switch [ngModel]="data.orchestration_status==='activated'?true:false"
[nzDisabled]="data.last_operation_progress !== 100"
(ngModelChange)="switchChange(data,i)"
></nz-switch>
@@ -57,6 +57,7 @@
nz-icon
nzType="poweroff"
nzTheme="outline"
+ class="anticon anticon-poweroff"
(click)="terminate(data)"
></i>
</td>
@@ -65,7 +66,7 @@
<!--class="anticon anticon-bars"-->
<!--(click)="showdetail(data)">-->
<!--</i>-->
- <i (click)="showdetail(data)" [ngClass]="{'cannotclick':data.last_operation_progress !== 100}">Detail</i>
+ <a (click)="showdetail(data)" [ngClass]="{'cannotclick':data.last_operation_progress !== 100}">detail</a>
</td>
</tr>
</ng-template>
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less
index b95d55e0..e13747ee 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less
@@ -10,7 +10,8 @@ nz-select {
i.anticon {
cursor: pointer;
font-size: 18px;
- padding: 2px;
+ padding: 2px 15px;
+ vertical-align: inherit!important;
&:hover{
color: #147dc2;
}
diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
index 0397de9c..884a3be4 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts
@@ -20,77 +20,159 @@ export class SlicingBusinessTableComponent implements OnInit {
this.getBusinessList()
}
- selectedValue = null;
- switchStatusAll: any[] = [];
+ 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;
+ progressingTimer :any;
getBusinessList (): void{
this.loading = true;
+ this.isSelect = false;
let paramsObj = {
pageNo: this.pageIndex,
pageSize: this.pageSize
};
- this.myhttp.getSlicingBusinessList(paramsObj).subscribe (res => {
+ 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 } } = res;
if (+result_code === 200) {
- this.listOfData = slicing_business_list;
this.total = slicing_business_list.length;
- this.switchStatusAll = slicing_business_list.map((item)=>{
- return item.orchestration_status
- });
this.loading = false;
+ this.listOfData = slicing_business_list.map((item)=>{
+ if(item.last_operation_progress < 100){
+ let updata = (prodata) => {
+ item.last_operation_progress = prodata.operation_progress || item.last_operation_progress;
+ };
+ let obj = {
+ serviceId: item.service_instance_id
+ };
+ this.queryProgress(obj, updata).then((res) => {
+ item.last_operation_progress = 100;
+ item.orchestration_status = item.last_operation_type === 'activate'?'activated':item.last_operation_type === 'deactivated'?'deactivated':'terminated';
+ })
+ }
+ return item
+ });
}
})
}
+ getListOfProcessingStatus(){
+ this.pageIndex = 1;
+ this.pageSize = 10;
+ this.getBusinessList();
+ }
searchData(reset: boolean = false) {
this.getBusinessList();
}
- switchChange(data,i){
- console.log(data,i,"----- switchChange");
+ switchChange(slicing,i){
this.modalService.confirm({
- nzTitle: '<i>Do you Want to'+(data.orchestration_status === 'activated'?'deactivated':'activated')+ 'slicing business?</i>',
- nzContent: '<b>service_instance_id:'+data.service_instance_id+'</b>',
+ nzTitle: '<i>Do you Want to'+(slicing.orchestration_status === 'activated'?'deactivated':'activated')+ 'slicing business?</i>',
+ nzContent: '<b>service_instance_id:'+slicing.service_instance_id+'</b>',
nzOnOk: () => {
let paramsObj = {
- serviceId:data.service_instance_id
+ serviceId:slicing.service_instance_id
};
- if(data.orchestration_status === 'activated'){
- this.myhttp.changeActivateSlicingService(paramsObj,false).subscribe (res => {
- const { result_header: { result_code }, result_body: { operation_id } } = res;
- if (+result_code === 200) {
- this.switchStatusAll[i] = 'deactivated';
- console.log(operation_id,"operation_id")
- }
- })
+ if(slicing.orchestration_status === 'activated'){
+ this.changeActivate(paramsObj,false,slicing,"deactivate","deactivated")
}else {
- this.myhttp.changeActivateSlicingService(paramsObj,true).subscribe (res => {
- const { result_header: { result_code, result_message }} = res;
- if (+result_code === 200) {
- this.switchStatusAll[i] = 'activated';
- console.log(result_message,"result_message")
- }
- })
+ this.changeActivate(paramsObj,true,slicing,"activate","activated");
}
},
nzCancelText: 'No',
nzOnCancel: () => {
- this.switchStatusAll[i] = data.orchestration_status
+ let singleSlicing = Object.assign({},this.listOfData[i]);
+ this.listOfData[i] = singleSlicing;
+ this.listOfData = [...this.listOfData];
}
});
}
- terminate(data){
-
+ changeActivate(paramsObj,isActivate,slicing,activateValue,finished){
+ this.myhttp.changeActivateSlicingService(paramsObj,isActivate).subscribe (res => {
+ const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
+ if (+result_code === 200) {
+ slicing.last_operation_progress = 0;
+ slicing.orchestration_status = activateValue;
+ console.log(operation_id,"operation_id");
+ let obj = {
+ serviceId: slicing.service_instance_id
+ }
+ let updata = (prodata) => {
+ slicing.last_operation_progress = prodata.progress;
+ slicing.orchestration_status = prodata.operation_type;
+ this.queryProgress(obj, updata).then(() => {
+ slicing.last_operation_progress = 100;
+ slicing.orchestration_status = finished;
+ })
+ }
+ }else {
+ console.error(result_message)
+ }
+ })
+ }
+ terminate(slicing){
+ this.modalService.confirm({
+ nzTitle: 'Do you Want to Terminate slicing business?',
+ nzContent: '<b>service_instance_id:&nbsp;</b>'+slicing.service_instance_id,
+ nzOnOk: () => {
+ let paramsObj = {
+ serviceId:slicing.service_instance_id
+ };
+ this.myhttp.terminateSlicingService(paramsObj).subscribe (res => {
+ const { result_header: { result_code, result_message }, result_body: { operation_id } } = res;
+ if (+result_code === 200) {
+ slicing.last_operation_progress = 0;
+ slicing.orchestration_status = 'deactivate';
+ console.log(operation_id,"operation_id");
+ let obj = {
+ serviceId: slicing.service_instance_id
+ };
+ let updata = (prodata) => {
+ slicing.last_operation_progress = prodata.progress;
+ slicing.orchestration_status = prodata.operation_type;
+ this.queryProgress(obj, updata).then(() => {
+ slicing.last_operation_progress = 100;
+ slicing.orchestration_status = "terminated";
+ })
+ }
+ }else {
+ console.error(result_message)
+ }
+ })
+ },
+ nzCancelText: 'No',
+ nzOnCancel: () => {
+ console.info('Cancel termination')
+ }
+ });
}
showdetail(data){
}
- getListOfProcessingStatus(){
-
+ queryProgress(obj, callback) {
+ return new Promise( res => {
+ let requery = () => {
+ this.myhttp.getSlicingBusinessProgress(obj)
+ .subscribe((data) => {
+ if (data.result_body.operation_progress < 100) {
+ callback(data.result_body);
+ this.progressingTimer = setTimeout(()=>{
+ requery();
+ },5000);
+ } else {
+ res(data.result_body);
+ }
+ })
+ };
+ requery();
+ })
}
}