fix: fix the bug of enter, add prompt text for every area selector, add hot module replacement

Change-Id: Id0c8810ea3c062acf1f731e93c31b30ea941d1a6
Signed-off-by: wangyuerg <wangyuerg@chinamobile.com>
Issue-ID: USECASEUI-444

3 files changed, 35 insertions, 27 deletions

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 6a49cc67..c4f377f1 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
@@ -71,7 +71,7 @@
 				</nz-form-control>
 				<div *ngIf="title === 'An' && item.key === 'an_coverage_area_ta_list'">
 					<div *ngFor="let area of areaList; let i = index">
-						<nz-form-control [nzSpan]="!ind ? 4 : 5" [nzOffset]="i && !ind ? 7 : 0" class="subnet_params_area"
+						<nz-form-control [nzSpan]="!ind ? 4 : 4" [nzOffset]="i && !ind ? 7 : 0" class="subnet_params_area"
 										 *ngFor="let item of area; let ind = index">
 							<nz-select [(ngModel)]="item.selected" [name]="'area' + i + ind"
 									   (nzOpenChange)="handleChange(area, item)"
@@ -80,18 +80,20 @@
 								</nz-option>
 							</nz-select>
 						</nz-form-control>
-						<nz-form-control [nzSpan]="1" [nzOffset]="1">
-							<button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="!i"
+						<nz-form-control [nzSpan]="1">
+							<div class="validation_alert_area">{{checkArea(area)}}</div>
+						</nz-form-control>
+						<nz-form-control [nzSpan]="1" [nzOffset]="2">
+							<button nz-button nzType="primary" type="button" nzSize="small" class="subnet_params_button" *ngIf="!i"
 									(click)="creatAreaList()">
 								<i nz-icon class="anticon anticon-plus subnet_params_icon"></i>
 							</button>
-							<button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="i"
+							<button nz-button nzType="primary" type="button" nzSize="small" class="subnet_params_button" *ngIf="i"
 									(click)="deleteAreaList(i)">
 								<i nz-icon class="anticon anticon-minus subnet_params_icon"></i>
 							</button>
 						</nz-form-control>
 					</div>
-					<div class="validation_alert_area">{{checkArea()}}</div>
 				</div>
 			</nz-form-item>
 		</form>
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 25093399..d8cad111 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
@@ -25,10 +25,7 @@
 }

 .validation_alert_area {

     color: red;

-    position: absolute;

-    top: 0;

-    margin-top: 35px;

-    margin-left: 15px;

+    margin-left: 6px;

 }

 .endpoint_input {

     position: relative;

@@ -37,11 +34,12 @@
         color: red;

         top: 0;

         margin-top: 30px;

+        margin-left: 6px;

     }

     .end_alert_logical {

         position: absolute;

         color: red;

         top: 0;

-        margin: 30px 0 0 120px;

+        margin: 30px 0 0 126px;

     }

 }
\ 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 41e63c81..145a03e7 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
@@ -72,8 +72,8 @@ export class SubnetParamsModelComponent implements OnInit {
 				return '';
 			}
 		} else if (key === 'logical_link') {
-			if (isNaN(value)){
-				return 'number only'
+			if (!this.isInteger(value)){
+				return 'integer only'
 			} else {
 				return ''
 			}
@@ -182,18 +182,14 @@ export class SubnetParamsModelComponent implements OnInit {
 		this.cancel.emit(this.showModel)
 	}
 	
-	checkArea () {
-		let result = true;
-		this.areaList.forEach((item) => {
-			if (item.some((val) => {return val['selected'] === ''})) {
-				result = false;
-			}
-		})
-		if (!result) {
-			return 'can not be empty!';
-		} else {
-			return '';
+	checkArea (area: any) {
+		if (area.every((item) => {return item.selected === ''})) {
+			return 'empty';
 		}
+		if (area.some((item) => {return item.selected === ''})) {
+			return 'incomplete';
+		}
+		return '';
 	}
 
 	judgeType (a) {
@@ -229,6 +225,18 @@ export class SubnetParamsModelComponent implements OnInit {
 		return true;
 	}
 
+	isInteger (value: any) {
+		// for common string and undefined, eg '123a3'
+		if (isNaN(value)) {
+			return false;
+		} else if (isNaN(parseInt(value))) {
+			return false;
+		} else if (Number(value) >= 0 && Number(value)%1 !== 0){
+			return false;
+		} else {
+			return true;
+		}
+	}
 
 	endCheckBeforeSubmit () {
 		// check params of Endpoint
@@ -244,8 +252,8 @@ export class SubnetParamsModelComponent implements OnInit {
 						result = [false, 'Illegal IpAddress']
 					}
 				} else if (prop === 'an_logical_link') {
-					if (isNaN(formatedEndpoint[prop])) {
-						result = [false, 'LogicalID can only be a number']
+					if (!this.isInteger(formatedEndpoint[prop])) {
+						result = [false, 'LogicalID can only be an integer']
 					}
 				}
 			} 
@@ -256,8 +264,8 @@ export class SubnetParamsModelComponent implements OnInit {
 						result = [false, 'Illegal IpAddress']
 					}
 				} else if (prop === 'cn_logical_link') {
-					if (isNaN(formatedEndpoint[prop])) {
-						result = [false, 'LogicalID can only be a number']
+					if (!this.isInteger(formatedEndpoint[prop])) {
+						result = [false, 'LogicalID can only be an integer']
 					}
 				}
 			}