feat: Encapsulates the common parameter dialog components and completes the initial display

Change-Id: I11b6e8f5c21345c7eb7f31c4101f7db424e7a525
Issue-ID: USECASEUI-352
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>

4 files changed, 87 insertions, 7 deletions

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 b9c7827e..5e6fd988 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
@@ -109,14 +109,10 @@ export class SlicingTaskModelComponent implements OnInit {
           service_instance_name: this.selectedServiceName
         }];
         // 子网实例
-       
         let subnetData = { an_suggest_nssi_id, an_suggest_nssi_name, tn_suggest_nssi_id, tn_suggest_nssi_name, cn_suggest_nssi_id, cn_suggest_nssi_name};
         this.subnetDataFormatting(subnetData);
         this.slicingSubnet[0].params = { an_latency, an_5qi, an_coverage_area_ta_list } 
-       
         this.slicingSubnet[1].params = { tn_latency, tn_bandwidth };
-
-       
         this.slicingSubnet[2].params = { 
           cn_service_snssai,
           cn_resource_sharing_level,
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
index 04042d7f..4d8e54b2 100644
--- 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
@@ -1,2 +1,42 @@
-<nz-modal [(nzVisible)]="showModel" [nzTitle]="title" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" nzWidth="750px">
+<nz-modal [(nzVisible)]="showModel" [nzTitle]="title + '参数'" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" nzWidth="700px">
+    <div class="subnet_params_container">
+        <form nz-form *ngIf="title === '无线域'">
+            <nz-form-item *ngFor="let item of wirelessFormItems">
+                <nz-form-label  [nzSpan]="5" nzRequired [nzFor]="item.key">{{item.title}}</nz-form-label>
+                <nz-form-control [nzSpan]="10"  *ngIf="item.key !== 'an_coverage_area_ta_list'">
+                    <input nz-input [(ngModel)]="detailData[item.key]" [name]="item.key" [id]="item.key"/>
+                </nz-form-control>
+                <div *ngIf="item.key === 'an_coverage_area_ta_list'">
+                    <div *ngFor="let area of areaList; let i = index">
+                        <nz-form-control [nzSpan]="4" [nzOffset]=" i && !ind ? 5 : 0"  class="subnet_params_area" *ngFor="let item of area; let ind = index">
+                            <nz-select [(ngModel)]="item.selected" [name]="'areaList'+i+'_'+ind"> 
+                                <nz-option [nzValue]="op.name" *ngFor="let op of item.options" [nzLabel]="op.name" ></nz-option>
+                            </nz-select>
+                        </nz-form-control>
+                        <button nz-button nzType="primary" nzSize="small" *ngIf="!i && !ind" class="subnet_params_button" (click)="creatAreaList()">
+                            <i nz-icon class="anticon anticon-plus subnet_params_icon"></i>
+                        </button>
+                    </div>
+                    
+                </div>
+            </nz-form-item>
+        </form>
+        <form nz-form *ngIf="title === '传输域'">
+            <nz-form-item *ngFor="let item of transferFormItems">
+                <nz-form-label  [nzSpan]="7" nzRequired [nzFor]="item.key">{{item.title}}</nz-form-label>
+                <nz-form-control [nzSpan]="12">
+                    <input nz-input [(ngModel)]="detailData[item.key]" [name]="item.key" [id]="item.key"/>
+                </nz-form-control>
+            </nz-form-item>
+        </form>
+        <form nz-form *ngIf="title === '核心域'">
+                <nz-form-item *ngFor="let item of coreFormItems">
+                    <nz-form-label  [nzSpan]="10" nzRequired [nzFor]="item.key">{{item.title}}</nz-form-label>
+                    <nz-form-control [nzSpan]="10">
+                        <input nz-input [(ngModel)]="detailData[item.key]" [name]="item.key" [id]="item.key"/>
+                    </nz-form-control>
+                </nz-form-item>
+            </form>
+
+    </div>
 </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
index e69de29b..814d2f0d 100644
--- 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
@@ -0,0 +1,19 @@
+.subnet_params_container{

+    padding-left: 3%;

+    .subnet_params_area{

+        margin-right: 5px;

+    }

+    .ant-btn-icon-only{

+        padding: 0 5px !important;

+    }

+    .subnet_params_button{

+        margin-top: 7px;

+        margin-left: 10px;

+    }

+    .subnet_params_icon{

+        font-size: 14px;

+    }

+}

+.ant-form-item-label {

+    text-align: left;

+}
\ No newline at end of file
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
index ec8790ab..1a3a194e 100644
--- 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
@@ -1,5 +1,5 @@
 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
-import { WIRELESS_FORM_ITEMS, TRANSFRER_FORM_ITEMS } from '../.../../../../../../../../constants/constants'
+import { WIRELESS_FORM_ITEMS, TRANSFRER_FORM_ITEMS, CORE_FORM_ITEMS } from '../.../../../../../../../../constants/constants'
 
 @Component({
 	selector: 'app-subnet-params-model',
@@ -14,11 +14,36 @@ export class SubnetParamsModelComponent implements OnInit {
 	@Output() cancel = new EventEmitter<boolean>();
 
 	transferFormItems = TRANSFRER_FORM_ITEMS;
+	coreFormItems = CORE_FORM_ITEMS;
+	wirelessFormItems = WIRELESS_FORM_ITEMS;
+	areaList: any[] = [];
 
 	constructor() { }
 
-	ngOnInit() {
+	ngOnInit() { }
 
+	ngOnChanges() {
+		if (this.title === '无线域') {
+		  	this.AreaFormatting();
+		}
+	}
+
+	AreaFormatting () {
+		let areaList = [...this.detailData.an_coverage_area_ta_list];
+		this.areaList = areaList.map ( (item: any) => {
+			let arr = item.split(';');
+			item = arr.map( ite => {
+				let obj: any = {};
+				obj.selected = ite
+				obj.options = [{name: ite, id: ite}]
+				return obj
+			})
+			return item;
+		})
+	}
+
+	creatAreaList () {
+		
 	}
 
 	handleCancel() {