git.apps.os.sepia.ceph.com Git - ceph.git/blob

   1 <cd-modal [pageURL]="pageURL"
   2           [modalRef]="activeModal">
   3   <span class="modal-title"
   4         i18n>{{ action | titlecase }} {{ resource | upperFirst }}</span>
   5   <ng-container class="modal-content">
   6     <form name="nsForm"
   7           #formDir="ngForm"
   8           [formGroup]="nsForm"
   9           novalidate>
  10       <div class="modal-body">
  11         <!-- Block Pool -->
  12         <div class="form-group row">
  13           <label class="cd-col-form-label"
  14                  for="pool">
  15             <span [ngClass]="{'required': !edit}"
  16                   i18n>Pool</span>
  17           </label>
  18           <div class="cd-col-form-input">
  19             <input *ngIf="edit"
  20                    name="pool"
  21                    class="form-control"
  22                    type="text"
  23                    formControlName="pool">
  24             <select *ngIf="!edit"
  25                     id="pool"
  26                     name="pool"
  27                     class="form-select"
  28                     formControlName="pool">
  29               <option *ngIf="rbdPools === null"
  30                       [ngValue]="null"
  31                       i18n>Loading...</option>
  32               <option *ngIf="rbdPools && rbdPools.length === 0"
  33                       [ngValue]="null"
  34                       i18n>-- No block pools available --</option>
  35               <option *ngIf="rbdPools && rbdPools.length > 0"
  36                       [ngValue]="null"
  37                       i18n>-- Select a pool --</option>
  38               <option *ngFor="let pool of rbdPools"
  39                       [value]="pool.pool_name">{{ pool.pool_name }}</option>
  40             </select>
  41             <cd-help-text i18n>
  42               An RBD application-enabled pool where the image will be created.
  43             </cd-help-text>
  44             <span class="invalid-feedback"
  45                   *ngIf="nsForm.showError('pool', formDir, 'required')"
  46                   i18n>This field is required.</span>
  47           </div>
  48         </div>
  49         <!-- Image Name -->
  50         <div class="form-group row">
  51           <label class="cd-col-form-label"
  52                  for="image">
  53             <span [ngClass]="{'required': !edit}"
  54                   i18n>Image Name</span>
  55           </label>
  56           <div class="cd-col-form-input">
  57             <input name="image"
  58                    class="form-control"
  59                    type="text"
  60                    formControlName="image">
  61             <span class="invalid-feedback"
  62                   *ngIf="nsForm.showError('image', formDir, 'required')">
  63               <ng-container i18n>This field is required.</ng-container>
  64             </span>
  65             <span class="invalid-feedback"
  66                   *ngIf="nsForm.showError('image', formDir, 'pattern')">
  67               <ng-container i18n>'/' and '@' are not allowed.</ng-container>
  68             </span>
  69           </div>
  70         </div>
  71         <!-- Image Size -->
  72         <div class="form-group row">
  73           <label class="cd-col-form-label"
  74                  for="image_size">
  75             <span [ngClass]="{'required': edit}"
  76                   i18n>Image Size</span>
  77           </label>
  78           <div class="cd-col-form-input">
  79             <div class="input-group">
  80               <input id="size"
  81                      class="form-control"
  82                      type="text"
  83                      name="image_size"
  84                      formControlName="image_size">
  85               <select id="unit"
  86                       name="unit"
  87                       class="form-input form-select"
  88                       formControlName="unit">
  89                 <option *ngFor="let u of units"
  90                         [value]="u"
  91                         i18n>{{ u }}</option>
  92               </select>
  93               <span class="invalid-feedback"
  94                     *ngIf="nsForm.showError('image_size', formDir, 'pattern')">
  95                 <ng-container i18n>Enter a positive integer.</ng-container>
  96               </span>
  97               <span class="invalid-feedback"
  98                     *ngIf="edit && nsForm.showError('image_size', formDir, 'required')">
  99                 <ng-container i18n>This field is required</ng-container>
 100               </span>
 101               <span class="invalid-feedback"
 102                     *ngIf="edit && invalidSizeError">
 103                 <ng-container i18n>Enter a value above than previous. A block device image can be expanded but not reduced.</ng-container>
 104               </span>
 105             </div>
 106           </div>
 107         </div>
 108       </div>
 109       <div class="modal-footer">
 110         <div class="text-right">
 111           <cd-form-button-panel (submitActionEvent)="onSubmit()"
 112                                 [form]="nsForm"
 113                                 [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)"></cd-form-button-panel>
 114         </div>
 115       </div>
 116     </form>
 117   </ng-container>
 118 </cd-modal>