import { HomesService } from './core/services/homes.service';
import { onboardService } from './core/services/onboard.service';
import { networkHttpservice } from './core/services/networkHttpservice.service';
+// slicingTask service
+import { SlicingTaskServices } from './core/services/slicingTaskServices'
+
import { PerformanceDetailsComponent } from './shared/components/performance-details/performance-details.component';
import { E2eDetailComponent } from './views/services/services-list/e2e-detail/e2e-detail.component';
import { CustomerComponent } from './views/management/customer/customer.component';
import { SlicingTaskManagementComponent } from './views/services/slicing-management/slicing-task-management/slicing-task-management.component';
import { SlicingResourceManagementComponent } from './views/services/slicing-management/slicing-resource-management/slicing-resource-management.component';
import { SlicingTaskModelComponent } from './views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component';
-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 { 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'
@NgModule({
providers: [
onboardService,
networkHttpservice,
ManagemencsService,
- TextService
+ TextService,
+ SlicingTaskServices
],
declarations: [
AppComponent,
constructor(private http: HttpClient) { }
baseUrl = baseUrl.baseUrl;
- nsmfBaseUrl = '/api/uui-slicing/nsmf'
+
url = {
customers: this.baseUrl + "/uui-lcm/customers",
serviceType: this.baseUrl + "/uui-lcm/customers/" + "*_*" + "/service-subscriptions",
pnfDetail: this.baseUrl + "/uui-sotn/getPnfInfo/",
connectivity: this.baseUrl + "/uui-sotn/getConnectivityInfo/",
vpnBinding: this.baseUrl + "/uui-sotn/getPinterfaceByVpnId/",
- slicingTaskList: this.nsmfBaseUrl + "/task/business/pageNo/{pageNo}/pageSize/{pageSize}"
};
return this.http.get<any>(url);
}
- // Get slicing order task list
- getSlicingTaskList (pageNo, pageSize) {
- const url = this.url.slicingTaskList.replace("{pageNo}", pageNo).replace("{pageSize}", pageSize)
- return this.http.get<any>(url);
- }
}
--- /dev/null
+/*\r
+ Copyright (C) 2019 CMCC, Inc. and others. All rights reserved.\r
+\r
+ Licensed under the Apache License, Version 2.0 (the "License");\r
+ you may not use this file except in compliance with the License.\r
+ You may obtain a copy of the License at\r
+\r
+ http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+ Unless required by applicable law or agreed to in writing, software\r
+ distributed under the License is distributed on an "AS IS" BASIS,\r
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ See the License for the specific language governing permissions and\r
+ limitations under the License.\r
+*/\r
+import { Injectable } from '@angular/core';\r
+import { HttpClient, HttpHeaders, HttpParams, HttpResponse } from '@angular/common/http';\r
+import { Observable } from 'rxjs/Observable';\r
+\r
+@Injectable()\r
+export class SlicingTaskServices {\r
+ constructor(private http: HttpClient) { }\r
+ baseUrl: string = '/api/uui-slicing/nsmf';\r
+ url = {\r
+ slicingTaskList: this.baseUrl + "/task/business/pageNo/{pageNo}/pageSize/{pageSize}",\r
+ taskProcessingStatus: this.baseUrl + '/task/{processingStatus}/business/pageNo/{pageNo}/pageSize/{pageSize}',\r
+ auditInfo: this.baseUrl + '/task/{taskId}/auditInfo'\r
+ }\r
+\r
+\r
+ \r
+ // Get slicing order task list\r
+ getSlicingTaskList (pageNo: string, pageSize: string) {\r
+ const url = this.url.slicingTaskList\r
+ .replace("{pageNo}", pageNo)\r
+ .replace("{pageSize}", pageSize);\r
+ return this.http.get<any>(url);\r
+ }\r
+ // Get list based on task processing status\r
+ getTaskProcessingStatus (processingStatus: string, pageNo: string, pageSize: string) {\r
+ const url = this.url.taskProcessingStatus\r
+ .replace('{processingStatus}', processingStatus)\r
+ .replace("{pageNo}", pageNo)\r
+ .replace("{pageSize}", pageSize);\r
+ return this.http.get<any>(url);\r
+ }\r
+ // Get \r
+ getAuditInfo (taskId: string){\r
+ const url = this.url.auditInfo.replace('{taskId}', taskId);\r
+ return this.http.get<any>(url);\r
+ }\r
+}\r
+\r
+\r
--- /dev/null
+{\r
+ "result_header": {\r
+ "result_code": "200",\r
+ "result_message": "5G slicing task configure audit information result."\r
+ },\r
+ "result_body": {\r
+ "task_id": "b1bb0ce7-ebca-4fa7-95ed-4840d70a1177",\r
+ "task_name": "5G Slice service eMMB",\r
+ "create_timer": "1454171445000",\r
+ "processing_status": "Waiting to Confirm",\r
+ "business_demand_info": {\r
+ "service_name": "5G Slice eMMB",\r
+ "service_snssai": "1-010101",\r
+ "exp_data_rate_dl": "300",\r
+ "exp_data_rate_ul": "300",\r
+ "ue_mobility_level": "stageary",\r
+ "latency": "20",\r
+ "use_interval": "12",\r
+ "coverage_area_ta_list": [" xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx "],\r
+ "activity_factor": "60",\r
+ "resource_sharing_level": "shared",\r
+ "area_traffic_cap_ul": "300",\r
+ "area_traffic_cap_dl": "300",\r
+ "max_number_of_ues": "10000"\r
+ },\r
+ "nst_info": {\r
+ "nst_id": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "nst_name": "eMBBNST"\r
+ },\r
+ "nsi_nssi_info": {\r
+ "suggest_nsi_id": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "suggest_nsi_name": "eMBB instance1",\r
+ "an_suggest_nssi_id": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "an_suggest_nssi_name": "eMBB ANinstance1",\r
+ "an_latency": "10",\r
+ "an_5qi": "8",\r
+ "an_coverage_area_ta_list": [" xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx ", " xxxx;xxxxx;xxxxx "],\r
+ "tn_suggest_nssi_id": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "tn_suggest_nssi_name": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "tn_latency": "10",\r
+ "tn_bandwidth": "300",\r
+ "cn_suggest_nssi_id": "46da8cf8-0878-48ac-bea3-f2200959411a",\r
+ "cn_suggest_nssi_name": "eMBB CNinstance1",\r
+ "cn_service_snssai": "1-010101",\r
+ "cn_resource_sharing_level": "shared",\r
+ "cn_ue_mobility_level": "stageary",\r
+ "cn_latency": "10",\r
+ "cn_max_number_of_ues": "10000",\r
+ "cn_activity_factor": "60",\r
+ "cn_exp_data_rate_dl": "300",\r
+ "cn_exp_data_rate_ul": "300",\r
+ "cn_area_traffic_cap_dl": "300",\r
+ "cn_area_traffic_cap_ul": "300"\r
+ }\r
+\r
+ }\r
+}\r
{\r
"result_header": {\r
- "result_code": "200",\r
+ "result_code": "200",\r
"result_message": "5G slicing task query result."\r
},\r
"result_body": {\r
- "record_number": 2,\r
+ "record_number": 30,\r
"slicing_task_list": [\r
{\r
"task_id": "b1bb0ce7-ebca-4fa7-95ed-4840d70a1177",\r
--- /dev/null
+{\r
+ "result_header": {\r
+ "result_code": "200",\r
+ "result_message": "5G slicing task query based on status result."\r
+ },\r
+ "result_body": {\r
+ "record_number": 2,\r
+ "slicing_task_list": [\r
+ {\r
+ "task_id": "b1bb0ce7-ebca-4fa7-95ed-4840d70a1177",\r
+ "task_name": "5G Slice service eMMB",\r
+ "service_snssai": "1-010101",\r
+ "service_type": "eMMB",\r
+ "arrival_time": "1454171445000",\r
+ "processing_status": "Waiting to Confirm"\r
+ },\r
+ {\r
+ "task_id": "b1bb0de7-ebca-4fa7-95ed-4840d7041177",\r
+ "task_name": "5G Slice service eMMB",\r
+ "service_snssai": "1-010101",\r
+ "service_type": "eMMB",\r
+ "arrival_time": "1544471445000",\r
+ "processing_status": "Waiting to Confirm"\r
+ }\r
+ ]\r
+ }\r
+}
\ No newline at end of file
///////<-------------slicing-tesk-management--------->/////
"/uui-slicing/nsmf/task/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_task_list",
+ "/uui-slicing/nsmf/task/:processingStatus/business/pageNo/:pageNo/pageSize/:pageSize": "/slicing_task_processing_status",
+ "/uui-slicing/nsmf/task/:taskId/auditInfo": "/slicing_task_auditInfo",
///////<-------------general interface--------->/////
"/api/*": "/$1",
<div>
<div nz-row>
- <div nz-col nzSpan="6">
- <span>Status:</span>
- <nz-select nzShowSearch nzAllowClear nzPlaceHolder="Select a person" [(ngModel)]="selectedValue">
- <nz-option nzLabel="Jack" nzValue="jack"></nz-option>
- <nz-option nzLabel="Lucy" nzValue="lucy"></nz-option>
- <nz-option nzLabel="Tom" nzValue="tom"></nz-option>
+ <div nz-col nzSpan="12" class="task_status">
+ <span>Status : </span>
+ <nz-select nzShowSearch nzAllowClear nzPlaceHolder="Select a processing status" [(ngModel)]="selectedValue" (ngModelChange)="getListOfProcessingStatus()">
+ <nz-option *ngFor="let item of statusOptions" [nzLabel]="item.title" [nzValue]="item.value"></nz-option>
</nz-select>
</div>
</div>
<td>{{ data.arrival_time }}</td>
<td>{{ data.status }}</td>
<td>
- <span *ngIf="data.processing_status === 'Planning'">任务处理</span>
- <a (click)="showdetail(data)" *ngIf="data.processing_status === 'Waiting to Confirm'">任务处理</a>
- <a (click)="showdetail(data)" *ngIf="data.processing_status === 'Creating'">查看进度</a>
- <a (click)="showdetail(data)" *ngIf="data.processing_status === 'Completed'">查看结果</a>
+ <span *ngIf="data.processing_status === 'Planning'" class="task_operation_disabled">{{ data.operation }}</span>
+ <a (click)="showdetail(data)" *ngIf="data.processing_status !== 'Planning'">{{ data.operation }}</a>
</td>
</tr>
</tbody>
nz-select {
width: 200px;
-}
\ No newline at end of file
+}
+.task_status{
+ margin-bottom: 20px;
+ span{
+ margin-right: 5%;
+ }
+}
+.task_operation_disabled {
+ color: #A2ABCE;
+ cursor: default;
+}
import { Component, OnInit } from '@angular/core';
import * as moment from 'moment';
-import { ServiceListService } from '.././../../../core/services/serviceList.service'
+import { SlicingTaskServices } from '.././../../../core/services/slicingTaskServices';
+import { TASK_PROCESSING_STATUS } from '../../../../../constants/constants';
@Component({
selector: 'app-slicing-task-management',
})
export class SlicingTaskManagementComponent implements OnInit {
- constructor(private myhttp: ServiceListService) { }
+ constructor(private myhttp: SlicingTaskServices) { }
ngOnInit() {
this.getTaskList()
detailData: object = {};
moduleTitle: string = "";
listOfData = [];
+ statusOptions = TASK_PROCESSING_STATUS;
+
getTaskList (): void{
- this.myhttp.getSlicingTaskList(1,10).subscribe (res => {
+ this.myhttp.getSlicingTaskList('1', '10').subscribe (res => {
+ const { result_header: { result_code }, result_body: { slicing_task_list } } = res
+ if (+result_code === 200) {
+ this.dataFormatting(slicing_task_list)
+ }
+ })
+ }
+ getListOfProcessingStatus():void {
+ this.myhttp.getTaskProcessingStatus(this.selectedValue, '1', '10').subscribe (res => {
const { result_header: { result_code }, result_body: { slicing_task_list } } = res
if (+result_code === 200) {
- this.listOfData = slicing_task_list.map( item => {
- item.arrival_time = moment(+item.arrival_time).format('YYYY-MM-DD hh:mm')
- switch (item.processing_status){
- case 'Planning':
- item.status = '规划阶段';
- break;
- case 'Waiting to Confirm':
- item.status = '审核阶段';
- break;
- case 'Creating':
- item.status = '切片创建中';
- break;
- case 'Completed':
- item.status = '创建完成';
- break;
- }
- return item;
- })
+ this.dataFormatting(slicing_task_list)
}
})
}
+
+ dataFormatting(list: any):void{
+ this.listOfData = list.map( item => {
+ item.arrival_time = moment(+item.arrival_time).format('YYYY-MM-DD hh:mm')
+ switch (item.processing_status){
+ case 'Planning':
+ item.status = '规划阶段';
+ item.operation = '任务处理'
+ break;
+ case 'Waiting to Confirm':
+ item.status = '审核阶段';
+ item.operation = '任务处理'
+ break;
+ case 'Creating':
+ item.status = '切片创建中';
+ item.operation = '查看进度'
+ break;
+ case 'Completed':
+ item.status = '创建完成';
+ item.operation = '查看结果'
+ break;
+ }
+ return item;
+ })
+ }
+
showdetail(data: any) {
- console.log(data, this.showDetail)
this.detailData = data;
this.showDetail = true;
- this.moduleTitle = data.status === 0 ? "Check Configuration" : "View Progress";
+ this.moduleTitle = data.status;
}
}
--- /dev/null
+export const TASK_PROCESSING_STATUS = [\r
+ {\r
+ title: '规划阶段',\r
+ value: 'Planning'\r
+ },\r
+ {\r
+ title: '审核阶段',\r
+ value: 'Waiting to Confirm'\r
+ }, \r
+ {\r
+ title: '切片创建中',\r
+ value: 'Creating'\r
+ },\r
+ {\r
+ title: '创建完成',\r
+ value: 'Completed'\r
+ }\r
+ ]
\ No newline at end of file