gerrit.onap Code Review - usecase-ui.git/blob

   1 <nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()" nzWidth="80%"
   2     [nzFooter]="modalFooter">
   3     <div class="subnet_params_container">
   4         <form nz-form>
   5             <nz-form-item *ngFor="let item of comunicationFormItems; let i = index">
   6                 <nz-form-label [nzSpan]="7" [nzRequired]="item.required" [nzFor]=" item.key">
   7                     {{ item.title }}
   8                 </nz-form-label>
   9                 <nz-form-control [nzSpan]="16">
  10                     <nz-tooltip [nzTitle]="item.scoped&&item.scopedText?item.scopedText:''" [nzPlacement]="'right'"
  11                         [nzTrigger]="'focus'">
  12                         <input nz-input nz-tooltip [id]="item.key" [name]="item.key" *ngIf="item.type === 'input'"
  13                             [(ngModel)]="slicing_order_info[item.key]"
  14                             [ngClass]="{'error-input-border' : validateRulesShow[i] === true}"
  15                             [placeholder]="item.placeholder ? item.placeholder : ''"
  16                             (blur)="item.required ? this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow) : this.Util.validator()" />
  17                         <div *ngIf="item.coverflag" class="detail-wrap">
  18                             <p>
  19                                 {{ masktext }}
  20                             </p>
  21                             <img src="assets/images/coverageAreaMap.png" class="detail-img" />
  22                         </div>
  23                         <img src="assets/images/ask-img.png" alt="" class="detail-icon"
  24                             *ngIf="item.key === 'coverageAreaNumber'" (mouseover)="detailFn(item.coverflag)"
  25                             (mouseleave)="detailFn(item.coverflag)" />
  26                     </nz-tooltip>
  27                     <nz-radio-group [name]="item.key" [(ngModel)]="slicing_order_info[item.key]"
  28                         *ngIf="item.type === 'radio'">
  29                         <label nz-radio [nzValue]="option.key" *ngFor="let option of item.options">
  30                             {{ option.title }}
  31                         </label>
  32                     </nz-radio-group>
  33                     <nz-select [name]="item.key" [(ngModel)]="slicing_order_info[item.key]"
  34                         *ngIf="item.type === 'select'">
  35                         <nz-option [nzValue]="option.key" [nzLabel]="option.title" *ngFor="let option of item.options">
  36                         </nz-option>
  37                     </nz-select>
  38                     <nz-form-explain *ngIf="item.type === 'input' && validateRulesShow[i]" class="validateRules">
  39                         {{ rulesText[i] }}
  40                     </nz-form-explain>
  41                 </nz-form-control>
  42
  43                 <div *ngIf="item.type === 'city-select'">
  44                     <app-city-select [areaList]="areaList" [level]="areaLevel"></app-city-select>
  45                 </div>
  46             </nz-form-item>
  47         </form>
  48     </div>
  49     <ng-template #modalFooter>
  50         <span>Modal Footer:</span>
  51         <button nz-button nzType="default" (click)="handleCancel()">Cancel</button>
  52         <button nz-button nzType="primary" (click)="handleOk()" [nzLoading]="loading">OK</button>
  53     </ng-template>
  54 </nz-modal>