summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/services/slicing-management/slicing-task-management/slicing-task-model/subnet-params-model/subnet-params-model.component.html
diff options
context:
space:
mode:
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.html136
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>