diff options
author | wangyuerg <wangyuerg@chinamobile.com> | 2021-01-28 10:34:35 +0800 |
---|---|---|
committer | wangyuerg <wangyuerg@chinamobile.com> | 2021-01-28 10:41:55 +0800 |
commit | 186b679ba02d7729801b4d560697d87034b9c8f6 (patch) | |
tree | a3dfa487da10a0f5adbc7bad55224595aa9c6547 /usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html | |
parent | 14e5467cf340f32afc38cd88be39ee4cba26def9 (diff) |
feat: TN change modification
Signed-off-by: wangyuerg <wangyuerg@chinamobile.com>
Change-Id: I7bed0f4b43e0f978b5e109bfd198c4cad2205463
Issue-ID: USECASEUI-527
Diffstat (limited to 'usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html')
-rw-r--r-- | usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html | 136 |
1 files changed, 102 insertions, 34 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 cde444bf..31c19d49 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,33 +1,101 @@ <nz-modal [(nzVisible)]="showModel" [nzTitle]="title + 'Parameter'" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" - nzWidth="700px"> + nzWidth="960px"> <div class="subnet_params_container"> <form nz-form *ngIf="title === 'Tn'"> <nz-form-item *ngFor="let item of transferFormItems"> - <nz-form-label [nzSpan]="7" [nzRequired]="item.required" [nzFor]="item.key" [ngStyle]="labelStyle(item.required)"> + <nz-form-label [nzSpan]="7" [nzRequired]="item.required" [nzFor]="item.key" + [ngStyle]="labelStyle(item.required)"> {{item.title}} </nz-form-label> - <nz-form-control [nzSpan]="12"> - <input nz-input - [(ngModel)]="formData[item.key]" - [name]="item.key" - [id]="item.key" - [readOnly]="item.title === 'S-NSSAI'" - [disabled]="item.title === 'S-NSSAI'" - [placeholder]="inputHolder(item.title)" - /> - <div class="validation_alert" *ngIf="item.required">{{Util.isEmpty(formData[item.key])? 'can not be empty!':' '}}</div> + <nz-form-control [nzSpan]="16"> + <input nz-input [(ngModel)]="formData[item.key]" [name]="item.key" [id]="item.key" + [readOnly]="item.title === 'S-NSSAI'" [disabled]="item.title === 'S-NSSAI'" + [placeholder]="inputHolder(item.title)" *ngIf="specialParaTN.indexOf(item.title)===-1" /> + <nz-radio-group [name]=" item.key" [(ngModel)]="formData[item.key]" + *ngIf="item.title==='Resource Sharing Level'" (ngModelChange)="changeResourceShare()"> + <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options"> + {{ option.title }} + </label> + </nz-radio-group> + <nz-input-group *ngIf="(item.title === 'AN Endpoint') && EndpointEnable"> + <div *ngFor="let option of item.options;let i=index"> + <div class="tn_endpoint_input"> + <input nz-input [id]="option.key" [name]="option.key" + [title]="ANEndpointInputs[option.key]" [(ngModel)]="ANEndpointInputs[option.key]" + [placeholder]="option.holder" style="width:32%;margin-right:1%" + [disabled]="item.disable" /> + <div class="end_alert_ip" *ngIf="option.title === 'ip_address'"> + {{validateEndPoint(option.title, ANEndpointInputs[option.key], item.required)}} + </div> + <div class="end_alert_logical" *ngIf="option.title === 'logical_link'"> + {{validateEndPoint(option.title, ANEndpointInputs[option.key], item.required)}} + </div> + <div class="end_alert_nexthop" *ngIf="option.title === 'nexthop_info'"> + {{validateEndPoint(option.title, ANEndpointInputs[option.key], item.required)}} + </div> + </div> + </div> + </nz-input-group> + <nz-input-group *ngIf="(item.title === 'CN Endpoint') && EndpointEnable"> + <div *ngFor="let option of item.options;let i=index"> + <div class="tn_endpoint_input"> + <input nz-input [id]="option.key" [name]="option.key" + [title]="CNEndpointInputs[option.key]" [(ngModel)]="CNEndpointInputs[option.key]" + [placeholder]="option.holder" style="width:32%;margin-right:1%" + [disabled]="item.disable" /> + <div class="end_alert_ip" *ngIf="option.title === 'ip_address'"> + {{validateEndPoint(option.title, CNEndpointInputs[option.key], item.required)}} + </div> + <div class="end_alert_logical" *ngIf="option.title === 'logical_link'"> + {{validateEndPoint(option.title, CNEndpointInputs[option.key], item.required)}} + </div> + <div class="end_alert_nexthop" *ngIf="option.title === 'nexthop_info'"> + {{validateEndPoint(option.title, CNEndpointInputs[option.key], item.required)}} + </div> + </div> + </div> + </nz-input-group> + <!-- connection links table --> + <div *ngIf="item.title === 'Connection Links'"> + <nz-table #basicTable [nzData]="[{}]" nzShowPagination="false"> + <thead> + <tr> + <th *ngFor="let val of item.header" class="subnet_td">{{val.title}}</th> + <th class="subnet_td"> action </th> + </tr> + </thead> + <tbody> + <tr *ngFor="let t of formData[item.options.key]"> + <td *ngFor="let val of item.header" class="subnet_td"> + {{t[val.key]}} + </td> + <td nzShowCheckbox="true" [nzChecked]="t.checked" + (nzCheckedChange)="changeLinkCheck(t.id, $event)" [nzDisabled]="item.disable" + class="subnet_td"> + <!-- <input type="checkbox" ng-model="t.checked" ng-change="nzCheckedChange(t.id)"> --> + </td> + </tr> + </tbody> + </nz-table> + </div> + <div class="validation_alert" *ngIf="item.required"> + {{Util.isEmpty(formData[item.key])? 'can not be empty!':' '}}</div> </nz-form-control> </nz-form-item> </form> <form nz-form *ngIf="title === 'An' || title === 'Cn'"> <nz-form-item *ngFor="let item of coreFormItems"> - <nz-form-label [nzSpan]="(item.key === 'an_coverage_area_ta_list' || item.title === 'Endpoint')?7:13" [nzRequired]="item.required" *ngIf=" item.title !== 'Endpoint' || EndpointEnable " [ngStyle]="labelStyle(item.required)"> + <nz-form-label [nzSpan]="(item.key === 'an_coverage_area_ta_list' || item.title === 'Endpoint')?7:13" + [nzRequired]="item.required" *ngIf=" item.title !== 'Endpoint' || EndpointEnable " + [ngStyle]="labelStyle(item.required)"> {{ item.title }} </nz-form-label> - <nz-form-control [nzSpan]="item.title === 'Endpoint'?14:8" *ngIf="item.key !== 'an_coverage_area_ta_list'"> + <nz-form-control [nzSpan]="item.title === 'Endpoint'?14:8" + *ngIf="item.key !== 'an_coverage_area_ta_list'"> <input nz-input [id]="item.key" [name]="item.key" [(ngModel)]="formData[item.key]" [readOnly]="item.title === 'S-NSSAI'" [disabled]="item.title === 'S-NSSAI'" - *ngIf=" item.title !== 'Resource Sharing Level' && item.title !== 'Mobility' && item.title !== 'Endpoint' " [placeholder]="inputHolder(item.title)"/> + *ngIf=" item.title !== 'Resource Sharing Level' && item.title !== 'Mobility' && item.title !== 'Endpoint' " + [placeholder]="inputHolder(item.title)" /> <nz-radio-group [name]="item.key" [(ngModel)]="formData[item.key]" *ngIf="item.title === 'Resource Sharing Level'"> <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options"> @@ -38,22 +106,22 @@ <nz-option [nzValue]="option.key" [nzLabel]="option.title" *ngFor="let option of item.options"> </nz-option> </nz-select> - <div class="validation_alert" *ngIf="item.required">{{Util.isEmpty(formData[item.key])? 'can not be empty!':' '}}</div> + <div class="validation_alert" *ngIf="item.required"> + {{Util.isEmpty(formData[item.key])? 'can not be empty!':' '}}</div> <!-- 2020.08.17 Add 3 parameters for Endpoint--> <!-- Comment: The following code--> <nz-input-group *ngIf="item.title === 'Endpoint' && EndpointEnable"> <div *ngFor="let option of item.options;let i=index"> <div class="endpoint_input"> - <input nz-input - [id]="option.key" - [name]="option.key" - [title]="EndpointInputs[option.key]" - [(ngModel)]="EndpointInputs[option.key]" - [placeholder]="option.holder" - style="width:32%;margin-right:1%" /> - <div class="end_alert_ip" *ngIf="option.title === 'ip_address'">{{validateEndPoint(option.title, EndpointInputs[option.key])}}</div> - <div class="end_alert_logical" *ngIf="option.title === 'logical_link'">{{validateEndPoint(option.title, EndpointInputs[option.key])}}</div> - <div class="end_alert_nexthop" *ngIf="option.title === 'nexthop_info'">{{validateEndPoint(option.title, EndpointInputs[option.key])}}</div> + <input nz-input [id]="option.key" [name]="option.key" + [title]="EndpointInputs[option.key]" [(ngModel)]="EndpointInputs[option.key]" + [placeholder]="option.holder" style="width:32%;margin-right:1%" /> + <div class="end_alert_ip" *ngIf="option.title === 'ip_address'"> + {{validateEndPoint(option.title, EndpointInputs[option.key], item.required)}}</div> + <div class="end_alert_logical" *ngIf="option.title === 'logical_link'"> + {{validateEndPoint(option.title, EndpointInputs[option.key], item.required)}}</div> + <div class="end_alert_nexthop" *ngIf="option.title === 'nexthop_info'"> + {{validateEndPoint(option.title, EndpointInputs[option.key], item.required)}}</div> </div> </div> </nz-input-group> @@ -61,11 +129,11 @@ </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 : 4" [nzOffset]="i && !ind ? 7 : 0" class="subnet_params_area" - *ngFor="let item of area; let ind = index"> + <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)" - (ngModelChange)=" handleChangeSelected(area, item) "> + (nzOpenChange)="handleChange(area, item)" + (ngModelChange)=" handleChangeSelected(area, item) "> <nz-option [nzValue]="op.name" [nzLabel]="op.name" *ngFor="let op of item.options"> </nz-option> </nz-select> @@ -74,12 +142,12 @@ <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()"> + <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" type="button" nzSize="small" class="subnet_params_button" *ngIf="i" - (click)="deleteAreaList(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> |