e540c6553604b23196b4772184405167d938147b
[usecase-ui.git] /
1 <nz-spin nzTip='Loading...' [nzSpinning]="isSpinning">
2     <nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()"
3         (nzOnOk)="handleOk()" nzWidth="80%">
4         <div class="subnet_params_container">
5             <form nz-form>
6                 <nz-form-item *ngFor="let item of comunicationFormItems; let i = index">
7                     <nz-form-label [nzSpan]="6" nzRequired *ngIf=" item.title !== 'Coverage Area Number' "
8                         [nzFor]="item.key">
9                         {{ item.title }}
10                     </nz-form-label>
11                     <nz-form-label [nzSpan]="6" *ngIf="item.title === 'Coverage Area Number' " [nzFor]="item.key">
12                         {{ item.title }}
13                     </nz-form-label>
14                     <nz-form-control [nzSpan]="15">
15                         <input nz-input nz-tooltip [id]="item.key" [name]="item.key"
16                             [(ngModel)]="slicing_order_info[item.key]"
17                             [ngClass]="{'error-input-border':validateRulesShow[i] === true}"
18                             *ngIf=" item.title === 'Communication Service Name' "
19                             (blur)="this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow)" />
20                         <nz-tooltip [nzTitle]="tooltipText" [nzPlacement]="'right'" [nzTrigger]="'focus'">
21                             <input nz-input nz-tooltip [id]="item.key" [name]="item.key"
22                                 [(ngModel)]="slicing_order_info[item.key]"
23                                 [ngClass]="{'error-input-border':validateRulesShow[i] === true}"
24                                 *ngIf=" item.title !== 'Communication Service Name' && item.title !== 'Coverage Area Number'&&item.title !== 'Resource Sharing Level' && item.title !== 'Mobility' && item.title !== 'Area' "
25                                 (blur)="this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow)"
26                                 (focus)="changeTooltipText(item.title)" />
27                         </nz-tooltip>
28                         <nz-radio-group [name]="item.key" [(ngModel)]="slicing_order_info[item.key]"
29                             *ngIf="item.title === 'Resource Sharing Level'">
30                             <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options">
31                                 {{ option.title }}
32                             </label>
33                         </nz-radio-group>
34                         <nz-select [name]="item.key" [(ngModel)]="slicing_order_info[item.key]"
35                             *ngIf="item.title === 'Mobility'">
36                             <nz-option [nzValue]="option.key" [nzLabel]="option.title"
37                                 *ngFor="let option of item.options">
38                             </nz-option>
39                         </nz-select>
40                         <nz-form-explain
41                             *ngIf=" item.title !== 'Resource Sharing Level' && item.title !== 'Mobility' && item.title !== 'Area' && validateRulesShow[i]"
42                             class="validateRules">{{rulesText[i]}}
43                         </nz-form-explain>
44                         <input nz-input nz-tooltip [id]="item.key" [name]="item.key"
45                             [(ngModel)]="slicing_order_info[item.key]" *ngIf=" item.title === 'Coverage Area Number' "
46                             placeholder="Please enter the coverage area number. use , to separate them if necessary " />
47                     </nz-form-control>
48                     <div *ngIf="item.key === 'coverageArea'">
49                         <div *ngFor="let area of areaList; let i = index">
50                             <nz-form-control [nzSpan]="!ind ? 3 : 4" [nzOffset]="i && !ind ? 6 : 0"
51                                 class="subnet_params_area" *ngFor="let item of area; let ind = index">
52                                 <nz-select [(ngModel)]="item.selected" [name]="'area' + i + ind"
53                                     (nzOpenChange)="handleChange(area, item)"
54                                     (ngModelChange)=" handleChangeSelected(area, item) ">
55                                     <nz-option [nzValue]="op.name" [nzLabel]="op.name" *ngFor="let op of item.options">
56                                     </nz-option>
57                                 </nz-select>
58                             </nz-form-control>
59                             <nz-form-control [nzSpan]="1" [nzOffset]="1">
60                                 <button nz-button nzType="primary" nzSize="small" class="subnet_params_button"
61                                     *ngIf="!i" (click)="creatAreaList()">
62                                     <i nz-icon class="anticon anticon-plus subnet_params_icon"></i>
63                                 </button>
64                                 <button nz-button nzType="primary" nzSize="small" class="subnet_params_button" *ngIf="i"
65                                     (click)="deleteAreaList(i)">
66                                     <i nz-icon class="anticon anticon-minus subnet_params_icon"></i>
67                                 </button>
68                             </nz-form-control>
69                         </div>
70                     </div>
71                 </nz-form-item>
72             </form>
73         </div>
74     </nz-modal>
75 </nz-spin>