summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/services/slicing-management
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-11-29 16:07:21 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-11-29 16:07:28 +0800
commit655cdc196cf2355aae018575682ba85ec1bda33e (patch)
tree3edbd48a1d29e4919ab40f0fe394269092e67f44 /usecaseui-portal/src/app/views/services/slicing-management
parentab3256d731b6c439f16869c3f193483532d57e23 (diff)
feat: Completed the interaction logic in the task processing component
Change-Id: Ia3b6a4adb00a3c4b1d51ba6e2f63e7713881090e Issue-ID: USECASEUI-352 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/views/services/slicing-management')
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.html27
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/slicing-task-model.component.ts152
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html2
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.less0
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.spec.ts25
-rw-r--r--usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.ts33
6 files changed, 210 insertions, 29 deletions
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 @@
<nz-list-item nz-row nzType="flex" nzJustify="start" [nzGutter]="8">
<div nz-col nzSpan="12">
切片实例 ID:
- <nz-select nzShowSearch [(ngModel)]="selectedServiceId" (ngModelChange)="serviceIdChange($event)">
- <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
+ <nz-select nzShowSearch
+ [(ngModel)]="selectedServiceId"
+ (ngModelChange)="slicingInstanceChange()"
+ (nzOpenChange)="getSlicingData($event)"
+ >
+ <nz-option *ngFor="let item of slicingInstances" [nzValue]="item.service_instance_id" [nzLabel]="item.service_instance_id"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="8">
- 切片实例名称:{{selectedServiceName}}
+ 切片实例名称:{{ selectedServiceName }}
</div>
<div nz-col nzSpan="4">
- <button nz-button nzType="primary" (click)="resetService()">
+ <button nz-button nzType="primary" (click)="resetSlicingInstance()">
<i nz-icon class="anticon anticon-plus"></i>
</button>
</div>
@@ -74,23 +78,26 @@
<div nz-row [nzGutter]="8">
<div nz-col nzSpan="12">
切片子网实例 ID:
- <nz-select nzShowSearch [(ngModel)]="item.slicingId" (ngModelChange)="serviceIdChange($event)">
- <nz-option *ngFor="let p of serviceId" [nzValue]="p" [nzLabel]="p"></nz-option>
+ <nz-select nzShowSearch [(ngModel)]="item.slicingId" (ngModelChange)="slicingSubnetChange(item)" (nzOpenChange)="getSubnetInstances($event, item)">
+ <nz-option *ngFor="let item of item.instances" [nzValue]="item.service_instance_id" [nzLabel]="item.service_instance_id"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="8">
切片子网实例名称:{{item.slicingName}}
</div>
<div nz-col nzSpan="4">
- <button nz-button nzType="primary" (click)="resetService()"> <i nz-icon
- class="anticon anticon-plus"></i></button>
- <button nz-button nzType="primary"> <i nz-icon class="anticon anticon-setting"
- nzTheme="outline"></i></button>
+ <button nz-button nzType="primary" (click)="restSubnetInstance(item)">
+ <i nz-icon class="anticon anticon-plus"></i>
+ </button>
+ <button nz-button nzType="primary" (click)="showParamsModel(item)">
+ <i nz-icon class="anticon anticon-setting" nzTheme="outline"></i>
+ </button>
</div>
</div>
</nz-card>
</nz-list-item>
</nz-list>
</div>
+ <app-subnet-params-model [showModel]="isShowParams" [detailData]="params" [title]="paramsTitle" (cancel)="isShowParams=$event"></app-subnet-params-model>
</nz-modal> \ 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 @@
+<nz-modal [(nzVisible)]="showModel" [nzTitle]="title" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" nzWidth="750px">
+</nz-modal>
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
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.less
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<SubnetParamsModelComponent>;
+
+ 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<boolean>();
+
+ transferFormItems = TRANSFRER_FORM_ITEMS;
+
+ constructor() { }
+
+ ngOnInit() {
+
+ }
+
+ handleCancel() {
+ this.showModel = false
+ this.cancel.emit(this.showModel)
+ }
+
+ handleOk(): void {
+ this.handleCancel()
+ }
+
+}