diff options
Diffstat (limited to 'usecaseui-portal/src')
23 files changed, 620 insertions, 20 deletions
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts index f618acdf..b08f339f 100644 --- a/usecaseui-portal/src/app/app.module.ts +++ b/usecaseui-portal/src/app/app.module.ts @@ -90,7 +90,8 @@ import { SlicingTaskModelComponent } from './views/services/slicing-management/s import { SlicingBusinessManagementComponent } from './views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component' import { NsiManagementComponent } from './views/services/slicing-management/slicing-resource-management/nsi-management/nsi-management.component' import { NssiManagementComponent } from './views/services/slicing-management/slicing-resource-management/nssi-management/nssi-management.component'; -import { SubnetParamsModelComponent } from './views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component' +import { SubnetParamsModelComponent } from './views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component'; +import { SlicingBusinessTableComponent } from './views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component' @NgModule({ providers: [ @@ -146,7 +147,8 @@ import { SubnetParamsModelComponent } from './views/services/slicing-management/ SlicingBusinessManagementComponent, NsiManagementComponent, NssiManagementComponent, - SubnetParamsModelComponent + SubnetParamsModelComponent, + SlicingBusinessTableComponent ], imports: [ BrowserModule, diff --git a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts index 165bb80e..fffa5801 100644 --- a/usecaseui-portal/src/app/core/services/slicingTaskServices.ts +++ b/usecaseui-portal/src/app/core/services/slicingTaskServices.ts @@ -28,6 +28,13 @@ export class SlicingTaskServices { slicingInstance: this.baseUrl + '/resource/nsi/instances/pageNo/{pageNo}/pageSize/{pageSize}',
slicingSubnetInstance: this.baseUrl + '/resource/nsi/{nsiId}/nssiInstances',
subnetInContext: this.baseUrl + '/resource/nssi/{environmentContext}/instances/pageNo/{pageNo}/pageSize/{pageSize}',
+ //slicing-business-management
+ slicingBusinessList:this.baseUrl+"/resource/business/pageNo/{pageNo}/pageSize/{pageSize}",
+ slicingBusinesQueryOfStatus:this.baseUrl+"/resource/{businessStatus}/business/pageNo/{pageNo}/pageSize/{pageSize}",
+ activateSlicingService:this.baseUrl+"/resource/{serviceId}/activate",
+ deactivateSlicingService:this.baseUrl+"/resource/{serviceId}/deactivate",
+ terminateSlicingService:this.baseUrl+"/resource/{serviceId}",
+ queryOperationProgress:this.baseUrl+"resource/{serviceId}/progress",
}
@@ -69,6 +76,34 @@ export class SlicingTaskServices { .replace('{pageSize}', pageSize);
return this.http.get<any>(url);
}
+
+ // Get slicing business list
+ getSlicingBusinessList (paramsObj,isSelect: boolean) {
+ let url = this.url.slicingBusinessList .replace("{pageNo}", paramsObj.pageNo)
+ .replace("{pageSize}", paramsObj.pageSize);
+ 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);
+ if(activate){
+ url = this.url.deactivateSlicingService.replace("{serviceId}", paramsObj.serviceId)
+ }
+ 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/activateSlicingService.json b/usecaseui-portal/src/app/mock/json/activateSlicingService.json new file mode 100644 index 00000000..988577bf --- /dev/null +++ b/usecaseui-portal/src/app/mock/json/activateSlicingService.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/deactivateSlicingService.json b/usecaseui-portal/src/app/mock/json/deactivateSlicingService.json new file mode 100644 index 00000000..4d98ffff --- /dev/null +++ b/usecaseui-portal/src/app/mock/json/deactivateSlicingService.json @@ -0,0 +1,9 @@ +{ + "result_header": { + "result_code": "200", + "result_message": "5G slicing service has been deactivated." + }, + "result_body": { + "operation_id": "123456" + } +}
\ No newline at end of file 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 new file mode 100644 index 00000000..8291efbf --- /dev/null +++ b/usecaseui-portal/src/app/mock/json/slicing_business_list.json @@ -0,0 +1,146 @@ +{ + "result_header": { + "result_code": "200", + "result_message": "5G slicing service instances query result." + }, + "result_body": { + "record_number": 2, + "slicing_business_list": [ + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9265", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "activated", + "last_operation_type": "activate", + "last_operation_progress": 80 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9266", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "activated", + "last_operation_type": "activate", + "last_operation_progress": 99 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9267", + "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", + "service_snssai": "1-010101", + "orchestration_status": "activated", + "last_operation_type": "activate", + "last_operation_progress": 100 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9271", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "deactivated", + "last_operation_type": "deactivate", + "last_operation_progress": 100 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9272", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "deactivated", + "last_operation_type": "deactivate", + "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": "deactivated", + "last_operation_type": "deactivate", + "last_operation_progress": 50 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9274", + "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-d094159b9275", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "deactivated", + "last_operation_type": "deactivate", + "last_operation_progress": 100 + }, + { + "service_instance_id": "23edd22b-a0b2-449f-be87-d094159b9276", + "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-d094159b9277", + "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-d094159b9278", + "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-d094159b9279", + "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-d094159b9280", + "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-d094159b9281", + "service_instance_name": "slicing-01-eMBB", + "service_type": "eMMB", + "service_snssai": "1-010101", + "orchestration_status": "activated", + "last_operation_type": "activate", + "last_operation_progress": 70 + } + ] + } +}
\ No newline at end of file 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 4f91b651..5bc81fbd 100644 --- a/usecaseui-portal/src/app/mock/routes.js +++ b/usecaseui-portal/src/app/mock/routes.js @@ -98,7 +98,13 @@ module.exports = "/uui-slicing/nsmf/resource/nsi/instances/pageNo/:pageNo/pageSize/:pageSize": "/slicing_instance", "/uui-slicing/nsmf/resource/nsi/:nsiId/nssiInstances": "/slicing_subnet_instance", "/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-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.html index 59401e02..2c8db58d 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,8 +1,12 @@ -<nz-tabset> +<nz-tabset (nzSelectChange)="handleTabChange($event)"> <nz-tab nzTitle="Slicing Task Management"> - <app-slicing-task-management></app-slicing-task-management> + <app-slicing-task-management + *ngIf="currentTab ==='Slicing Task Management'" + ></app-slicing-task-management> </nz-tab> - <nz-tab nzTitle="Slicing Resource Management"> - <app-slicing-resource-management></app-slicing-resource-management> + <nz-tab nzTitle="Slicing Resource Management" > + <app-slicing-resource-management + *ngIf="currentTab ==='Slicing Resource Management'" + ></app-slicing-resource-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.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.less index e69de29b..46ef8be6 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.less +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-management.component.less @@ -0,0 +1,3 @@ +.slicing-content{ + padding: 20px; +}
\ 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 ae2133de..4b33db12 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 @@ -11,5 +11,9 @@ export class SlicingManagementComponent implements OnInit { ngOnInit() { } - + currentTab = 'Slicing Task Management'; + handleTabChange($event): void { + console.log($event,"$event"); + this.currentTab = $event.tab._title; + } } diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.html index 6ea00aa1..7626b040 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.html @@ -1,3 +1,3 @@ <h3> - slicing-business-management + <app-slicing-business-table></app-slicing-business-table> </h3>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.less index e69de29b..8fe39e97 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.less +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-management.component.less @@ -0,0 +1,3 @@ +.slicing-content{ + padding: 0!important; +}
\ No newline at end of file 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 new file mode 100644 index 00000000..07bdc07e --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.html @@ -0,0 +1,76 @@ +<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> + <nz-table + #basicTable + [nzData]="listOfData" + [nzFrontPagination]="false" + [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>S-NSSAI</th> + <th>Orchestration_status</th> + <th width="130px">Aciton</th> + <th width="100px">Detail</th> + </tr> + </thead> + <tbody> + <ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index"> + <tr> + <td>{{ data.service_instance_id }}</td> + <td>{{ data.service_instance_name }}</td> + <td>{{ data.service_type }}</td> + <td>{{ data.service_snssai }}</td> + <td> + + <span class="marginLeft10"> + {{ data.last_operation_progress !== 100?data.last_operation_type+' '+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]="data.orchestration_status==='activated'?true:false" + [nzDisabled]="data.last_operation_progress !== 100" + (ngModelChange)="switchChange(data,i)" + ></nz-switch> + <i [ngClass]="{'cannotclick':data.last_operation_progress !== 100}" + nz-icon + nzType="poweroff" + nzTheme="outline" + class="anticon anticon-poweroff" + (click)="terminate(data)" + ></i> + </td> + <td> + <!--<i [ngClass]="{'cannotclick':data.last_operation_progress !== 100}"--> + <!--class="anticon anticon-bars"--> + <!--(click)="showdetail(data)">--> + <!--</i>--> + <a (click)="showdetail(data)" [ngClass]="{'cannotclick':data.last_operation_progress !== 100}">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/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 new file mode 100644 index 00000000..e13747ee --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.less @@ -0,0 +1,23 @@ +nz-select { + width: 200px; +} +.task_status{ + margin-bottom: 20px; + span{ + margin-right: 5%; + } +} +i.anticon { + cursor: pointer; + font-size: 18px; + padding: 2px 15px; + vertical-align: inherit!important; + &:hover{ + color: #147dc2; + } +} +.cannotclick { + pointer-events: none; + color: #aaa; + opacity: 0.6; +}
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.spec.ts new file mode 100644 index 00000000..200a0fb3 --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SlicingBusinessTableComponent } from './slicing-business-table.component'; + +describe('SlicingBusinessTableComponent', () => { + let component: SlicingBusinessTableComponent; + let fixture: ComponentFixture<SlicingBusinessTableComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SlicingBusinessTableComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SlicingBusinessTableComponent); + 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/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 new file mode 100644 index 00000000..884a3be4 --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-business-management/slicing-business-table/slicing-business-table.component.ts @@ -0,0 +1,178 @@ +import {Component, OnInit} from '@angular/core'; +import {SlicingTaskServices} from '.././../../../../../core/services/slicingTaskServices'; +import {BUSINESS_STATUS} from '../../../../../../../constants/constants'; +import { NzModalService } from 'ng-zorro-antd'; + +@Component({ + selector: 'app-slicing-business-table', + templateUrl: './slicing-business-table.component.html', + styleUrls: ['./slicing-business-table.component.less'] +}) +export class SlicingBusinessTableComponent implements OnInit { + + constructor( + private myhttp: SlicingTaskServices, + private modalService: NzModalService + ) { + } + + ngOnInit() { + this.getBusinessList() + } + + 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 + }; + 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.total = slicing_business_list.length; + 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(slicing,i){ + this.modalService.confirm({ + 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:slicing.service_instance_id + }; + if(slicing.orchestration_status === 'activated'){ + this.changeActivate(paramsObj,false,slicing,"deactivate","deactivated") + }else { + this.changeActivate(paramsObj,true,slicing,"activate","activated"); + } + }, + nzCancelText: 'No', + nzOnCancel: () => { + let singleSlicing = Object.assign({},this.listOfData[i]); + this.listOfData[i] = singleSlicing; + this.listOfData = [...this.listOfData]; + } + }); + } + 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: </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){ + + } + 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(); + }) + } +} diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.html index a6a06298..7e6856b6 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.html @@ -1,11 +1,17 @@ -<nz-tabset class="slicing-resource_tab"> +<nz-tabset class="slicing-resource_tab" (nzSelectChange)="handleTabChange($event)"> <nz-tab nzTitle="Slicing Business Management"> - <app-slicing-business-management></app-slicing-business-management> + <app-slicing-business-management + *ngIf="currentTab ==='Slicing Business Management'" + ></app-slicing-business-management> </nz-tab> <nz-tab nzTitle="Slicing Instance Management"> - <app-nsi-management></app-nsi-management> + <app-nsi-management + *ngIf="currentTab ==='Slicing Instance Management'" + ></app-nsi-management> </nz-tab> <nz-tab nzTitle="Slicing Subnet Instance Management"> - <app-nssi-management></app-nssi-management> + <app-nssi-management + *ngIf="currentTab ==='Slicing Subnet Instance Management'" + ></app-nssi-management> </nz-tab> </nz-tabset>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.less index b3180ba2..e69de29b 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.less +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.less @@ -1,5 +0,0 @@ -.slicing-resource_tab { - width: 104%; - margin-left: 20px; - margin-top: -35px; -}
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.ts index 38dc48c8..b88b9073 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-resource-management/slicing-resource-management.component.ts @@ -11,5 +11,9 @@ export class SlicingResourceManagementComponent implements OnInit { ngOnInit() { } - + currentTab = 'Slicing Business Management'; + handleTabChange($event): void { + console.log($event,"$event"); + this.currentTab = $event.tab._title; + } } diff --git a/usecaseui-portal/src/constants/constants.ts b/usecaseui-portal/src/constants/constants.ts index b9e4ac8d..11bcb9f3 100644 --- a/usecaseui-portal/src/constants/constants.ts +++ b/usecaseui-portal/src/constants/constants.ts @@ -282,4 +282,7 @@ export const ADDRESS = { }
]
}
-}
\ No newline at end of file +}
+export const BUSINESS_STATUS = [
+ "All","activated","deactivated"
+]
\ No newline at end of file diff --git a/usecaseui-portal/src/styles.less b/usecaseui-portal/src/styles.less index 63c911e3..336c9150 100644 --- a/usecaseui-portal/src/styles.less +++ b/usecaseui-portal/src/styles.less @@ -807,4 +807,16 @@ nz-notification-container .ant-notification{ } .ant-menu-dark .ant-menu-inline.ant-menu-sub{ background:#313449!important; +} +// slicing-resource-management +.slicing-resource_tab { + width: 104%; + margin-left: 20px!important; + margin-top: -35px!important; + .ant-tabs-content.ant-tabs-content-animated{ + padding: 20px 0!important; + } +} +.slicing-resource-table{ + padding: 20px!important; }
\ No newline at end of file |