From 655cdc196cf2355aae018575682ba85ec1bda33e Mon Sep 17 00:00:00 2001 From: cyuamber Date: Fri, 29 Nov 2019 16:07:21 +0800 Subject: feat: Completed the interaction logic in the task processing component Change-Id: Ia3b6a4adb00a3c4b1d51ba6e2f63e7713881090e Issue-ID: USECASEUI-352 Signed-off-by: cyuamber --- .../slicing-task-model.component.html | 27 ++-- .../slicing-task-model.component.ts | 152 ++++++++++++++++++--- .../subnet-params-model.component.html | 2 + .../subnet-params-model.component.less | 0 .../subnet-params-model.component.spec.ts | 25 ++++ .../subnet-params-model.component.ts | 33 +++++ 6 files changed, 210 insertions(+), 29 deletions(-) create mode 100644 usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html create mode 100644 usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.less create mode 100644 usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.spec.ts create mode 100644 usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.ts (limited to 'usecaseui-portal/src/app/views') diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html index 89d64f51..3aca68fb 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html @@ -55,15 +55,19 @@
切片实例 ID： - - + +
- 切片实例名称：{{selectedServiceName}} + 切片实例名称：{{ selectedServiceName }}
-
@@ -74,23 +78,26 @@
切片子网实例 ID： - - + +
切片子网实例名称：{{item.slicingName}}
- - + +
+ \ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts index 8d61029e..88eb586a 100644 --- a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts @@ -26,24 +26,36 @@ export class SlicingTaskModelComponent implements OnInit { // 共享切片实例 selectedServiceId: string; selectedServiceName: string; + slicingInstances: any[]; + loading: boolean = false; // 子网实例 slicingSubnet: any[] = [ { title: '无线域', + context: 'an', slicingId: '', - slicingName: '' + slicingName: '', + instances: [] }, { title: '传输域', + context: 'tn', slicingId: '', - slicingName: '' + slicingName: '', + instances: [] }, { title: '核心网域', + context: 'cn', slicingId: '', - slicingName: '' + slicingName: '', + instances: [] } ] + // 子网参数 + isShowParams: boolean; + paramsTitle: string; + params: any; ngOnInit() { } @@ -66,7 +78,23 @@ export class SlicingTaskModelComponent implements OnInit { tn_suggest_nssi_id, tn_suggest_nssi_name, cn_suggest_nssi_id, - cn_suggest_nssi_name } = nsi_nssi_info; + cn_suggest_nssi_name, + an_latency, + an_5qi, + an_coverage_area_ta_list, + tn_latency, + tn_bandwidth, + cn_service_snssai, + cn_resource_sharing_level, + cn_ue_mobility_level, + cn_latency, + cn_max_number_of_ues, + cn_activity_factor, + cn_exp_data_rate_dl, + cn_exp_data_rate_ul, + cn_area_traffic_cap_dl, + cn_area_traffic_cap_ul + } = nsi_nssi_info; // 处理配置审核详情数据 this.checkDetail = [{ task_id, task_name, create_timer, processing_status, service_snssai }]; // 业务需求信息数据 @@ -75,38 +103,124 @@ export class SlicingTaskModelComponent implements OnInit { // 共享切片实例 this.selectedServiceId = suggest_nsi_id; this.selectedServiceName = suggest_nsi_name; + this.slicingInstances = [{ + service_instance_id: this.selectedServiceId, + service_instance_name: this.selectedServiceName + }]; // 子网实例 this.slicingSubnet[0].slicingId = an_suggest_nssi_id; this.slicingSubnet[0].slicingName = an_suggest_nssi_name; + this.slicingSubnet[0].instances = [{ + service_instance_id: an_suggest_nssi_id, + service_instance_name: an_suggest_nssi_name + }]; + this.slicingSubnet[0].params = { an_latency, an_5qi, an_coverage_area_ta_list } + this.slicingSubnet[1].slicingId = tn_suggest_nssi_id; this.slicingSubnet[1].slicingName = tn_suggest_nssi_name; + this.slicingSubnet[1].instances = [{ + service_instance_id: tn_suggest_nssi_id, + service_instance_name: tn_suggest_nssi_name + }]; + this.slicingSubnet[1].params = { tn_latency, tn_bandwidth }; + this.slicingSubnet[2].slicingId = cn_suggest_nssi_id; this.slicingSubnet[2].slicingName = cn_suggest_nssi_name; + this.slicingSubnet[2].instances = [{ + service_instance_id: cn_suggest_nssi_id, + service_instance_name: cn_suggest_nssi_name + }]; + this.slicingSubnet[2].params = { + cn_service_snssai, + cn_resource_sharing_level, + cn_ue_mobility_level, + cn_latency, + cn_max_number_of_ues, + cn_activity_factor, + cn_exp_data_rate_dl, + cn_exp_data_rate_ul, + cn_area_traffic_cap_dl, + cn_area_traffic_cap_ul + }; } }) } + getSlicingData ( bool: boolean): void { + this.loading = true + if (bool && this.slicingInstances.length === 1) { + this.http.getSlicingInstance('1', '10').subscribe ( res => { + this.loading = false; + const { result_header: { result_code }, result_body: { nsi_service_instances } } = res + if (+result_code === 200) { + this.slicingInstances = nsi_service_instances; + } + }) + } + } + slicingInstanceChange ():void { + // 获取切片子网实例数据 + this.http.getSlicingSubnetInstance(this.selectedServiceId).subscribe( res => { + const { result_header: { result_code }, result_body} = res; + if (+result_code === 200) { + const { an_suggest_nssi_id, an_suggest_nssi_name, tn_suggest_nssi_id, tn_suggest_nssi_name, cn_suggest_nssi_id, cn_suggest_nssi_name } = result_body; + this.slicingSubnet[0].slicingId = an_suggest_nssi_id; + this.slicingSubnet[0].slicingName = an_suggest_nssi_name; + this.slicingSubnet[1].slicingId = tn_suggest_nssi_id; + this.slicingSubnet[1].slicingName = tn_suggest_nssi_name; + this.slicingSubnet[2].slicingId = cn_suggest_nssi_id; + this.slicingSubnet[2].slicingName = cn_suggest_nssi_name; + } + }) + this.slicingInstances.forEach (item => { + if (item.service_instance_id === this.selectedServiceId) { + this.selectedServiceName = item.service_instance_name; + } + }) + } + resetSlicingInstance (): void { + this.selectedServiceId = ''; + this.selectedServiceName = ''; + this.slicingSubnet.map( item => { + item.slicingId = ''; + item.slicingName = ''; + }) + } + getSubnetInstances (bool: boolean, instance: any): void { + if(bool && instance.instances.length === 1) { + this.http.getSubnetInContext(instance.context, '1', '10').subscribe( res => { + const { result_header: { result_code }, result_body } = res; + if (+result_code === 200) { + this.slicingSubnet.map (item => { + if (item.context === instance.context) { + item.instances = result_body.nssi_service_instances; + } + }) + } + }) + } + } + slicingSubnetChange (instance: any): void { + instance.instances.forEach( item => { + if (instance.slicingId === item.service_instance_id) { + instance.slicingName = item.service_instance_name; + } + }) + } - serviceId = ['46da8cf8-0878-48ac-bea3-f2200959411a', '46da8cf8-0878-48ac-bea3-f2200959411b', '46da8cf8-0878-48ac-bea3-f2200959411c']; - serviceData: {} = { - "46da8cf8-0878-48ac-bea3-f2200959411a": "eMBB instancela", - "46da8cf8-0878-48ac-bea3-f2200959411b": "eMBB instancelb", - "46da8cf8-0878-48ac-bea3-f2200959411c": "eMBB instancelc", - }; - - - - serviceIdChange(value: string): void { - this.selectedServiceName = this.serviceData[value]; - console.log(this.selectedServiceName, "=====") + restSubnetInstance (instance: any): void { + instance.slicingId = ''; + instance.slicingName = ''; } - resetService() { - this.selectedServiceId = ""; - this.serviceIdChange(this.selectedServiceId); + + showParamsModel (item: any): void { + this.isShowParams = true; + this.paramsTitle = item.title; + this.params = item.params } handleCancel() { diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html new file mode 100644 index 00000000..04042d7f --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html @@ -0,0 +1,2 @@ + + diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.less b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.less new file mode 100644 index 00000000..e69de29b diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.spec.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.spec.ts new file mode 100644 index 00000000..b5325d85 --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SubnetParamsModelComponent } from './subnet-params-model.component'; + +describe('SubnetParamsModelComponent', () => { + let component: SubnetParamsModelComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SubnetParamsModelComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SubnetParamsModelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.ts b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.ts new file mode 100644 index 00000000..ec8790ab --- /dev/null +++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.ts @@ -0,0 +1,33 @@ +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { WIRELESS_FORM_ITEMS, TRANSFRER_FORM_ITEMS } from '../.../../../../../../../../constants/constants' + +@Component({ + selector: 'app-subnet-params-model', + templateUrl: './subnet-params-model.component.html', + styleUrls: ['./subnet-params-model.component.less'] +}) +export class SubnetParamsModelComponent implements OnInit { + + @Input() showModel: boolean; + @Input() detailData: any; + @Input() title: string; + @Output() cancel = new EventEmitter(); + + transferFormItems = TRANSFRER_FORM_ITEMS; + + constructor() { } + + ngOnInit() { + + } + + handleCancel() { + this.showModel = false + this.cancel.emit(this.showModel) + } + + handleOk(): void { + this.handleCancel() + } + +} -- cgit 1.2.3-korg