ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/components/config-option/config-option.component.html

   1 <div [formGroup]="optionsFormGroup">
   2   <div *ngFor="let option of options; let last = last">
   3     <div class="form-group row pt-2"
   4          *ngIf="option.type === 'bool'">
   5       <label class="cd-col-form-label"
   6              [for]="option.name">
   7         <b>{{ option.text }}</b>
   8         <br>
   9         <span class="text-muted">
  10           {{ option.desc }}
  11           <cd-helper *ngIf="option.long_desc">
  12             {{ option.long_desc }}</cd-helper>
  13         </span>
  14       </label>
  15
  16       <div class="cd-col-form-input">
  17         <div class="custom-control custom-checkbox">
  18           <input class="custom-control-input"
  19                  type="checkbox"
  20                  [id]="option.name"
  21                  [formControlName]="option.name">
  22           <label class="custom-control-label"
  23                  [for]="option.name"></label>
  24         </div>
  25       </div>
  26     </div>
  27
  28     <div class="form-group row pt-2"
  29          *ngIf="option.type !== 'bool'">
  30       <label class="cd-col-form-label"
  31              [for]="option.name">{{ option.text }}
  32         <br>
  33         <span class="text-muted">
  34           {{ option.desc }}
  35           <cd-helper *ngIf="option.long_desc">
  36             {{ option.long_desc }}</cd-helper>
  37         </span>
  38       </label>
  39       <div class="cd-col-form-input">
  40         <div class="input-group">
  41           <input class="form-control"
  42                  [type]="option.additionalTypeInfo.inputType"
  43                  [id]="option.name"
  44                  [placeholder]="option.additionalTypeInfo.humanReadable"
  45                  [formControlName]="option.name"
  46                  [step]="getStep(option.type, optionsForm.getValue(option.name))">
  47           <div class="input-group-append"
  48                *ngIf="optionsFormShowReset">
  49             <button class="btn btn-light"
  50                     type="button"
  51                     data-toggle="button"
  52                     title="Remove the custom configuration value. The default configuration will be inherited and used instead."
  53                     (click)="resetValue(option.name)"
  54                     i18n-title>
  55               <i [ngClass]="[icons.erase]"
  56                  aria-hidden="true"></i>
  57             </button>
  58           </div>
  59         </div>
  60         <span class="invalid-feedback"
  61               *ngIf="optionsForm.showError(option.name, optionsFormDir, 'pattern')">
  62           {{ option.additionalTypeInfo.patternHelpText }}</span>
  63         <span class="invalid-feedback"
  64               *ngIf="optionsForm.showError(option.name, optionsFormDir, 'invalidUuid')">
  65           {{ option.additionalTypeInfo.patternHelpText }}</span>
  66         <span class="invalid-feedback"
  67               *ngIf="optionsForm.showError(option.name, optionsFormDir, 'max')"
  68               i18n>The entered value is too high! It must not be greater than {{ option.maxValue }}.</span>
  69         <span class="invalid-feedback"
  70               *ngIf="optionsForm.showError(option.name, optionsFormDir, 'min')"
  71               i18n>The entered value is too low! It must not be lower than {{ option.minValue }}.</span>
  72       </div>
  73     </div>
  74     <hr *ngIf="!last"
  75         class="my-2">
  76   </div>
  77 </div>