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

   1 <cd-modal [modalRef]="activeModal">
   2   <ng-container i18n="form title"
   3                 class="modal-title">{{ action | titlecase }} {{ resource | upperFirst }}</ng-container>
   4
   5   <ng-container class="modal-content"
   6                 *cdFormLoading="loading">
   7     <form name="subvolumeForm"
   8           #formDir="ngForm"
   9           [formGroup]="subvolumeForm"
  10           novalidate>
  11       <div class="modal-body">
  12         <div class="form-group row">
  13           <label class="cd-col-form-label required"
  14                  for="subvolumeName"
  15                  i18n>Name</label>
  16           <div class="cd-col-form-input">
  17             <input class="form-control"
  18                    type="text"
  19                    placeholder="Subvolume name..."
  20                    id="subvolumeName"
  21                    name="subvolumeName"
  22                    formControlName="subvolumeName"
  23                    autofocus>
  24             <span class="invalid-feedback"
  25                   *ngIf="subvolumeForm.showError('subvolumeName', formDir, 'required')"
  26                   i18n>This field is required.</span>
  27             <span class="invalid-feedback"
  28                   *ngIf="subvolumeForm.showError('subvolumeName', formDir, 'notUnique')"
  29                   i18n>The subvolume already exists.</span>
  30           </div>
  31         </div>
  32
  33         <!-- Volume name -->
  34         <div class="form-group row">
  35           <label class="cd-col-form-label"
  36                  for="volumeName"
  37                  i18n>Volume name</label>
  38           <div class="cd-col-form-input">
  39             <input class="form-control"
  40                    id="volumeName"
  41                    name="volumeName"
  42                    formControlName="volumeName">
  43           </div>
  44         </div>
  45
  46           <!--Subvolume Group name -->
  47           <div class="form-group row">
  48             <label class="cd-col-form-label"
  49                    for="subvolumeGroupName"
  50                    i18n>Subvolume group
  51             </label>
  52             <div class="cd-col-form-input">
  53               <select class="form-select"
  54                       id="subvolumeGroupName"
  55                       name="subvolumeGroupName"
  56                       formControlName="subvolumeGroupName"
  57                       *ngIf="subVolumeGroups$ | async as subvolumeGroups">
  58                 <option value=""
  59                         i18n>Default</option>
  60                 <option *ngFor="let subvolumegroup of subvolumeGroups"
  61                         [value]="subvolumegroup.name">{{ subvolumegroup.name }}</option>
  62               </select>
  63             </div>
  64           </div>
  65
  66         <!-- Size -->
  67         <div class="form-group row">
  68           <label class="cd-col-form-label"
  69                  for="size"
  70                  i18n>Size
  71           <cd-helper>The size of the subvolume is specified by setting a quota on it.
  72             If left blank or put 0, then quota will be infinite</cd-helper>
  73           </label>
  74           <div class="cd-col-form-input">
  75             <input class="form-control"
  76                    type="text"
  77                    id="size"
  78                    name="size"
  79                    formControlName="size"
  80                    i18n-placeholder
  81                    placeholder="e.g., 10GiB"
  82                    defaultUnit="GiB"
  83                    cdDimlessBinary>
  84             <span *ngIf="subvolumeForm.showError('size', formDir, 'pattern')"
  85                   class="invalid-feedback"
  86                   i18n>Size must be a number or in a valid format. eg: 5 GiB</span>
  87           </div>
  88         </div>
  89
  90         <!-- CephFS Pools -->
  91         <div class="form-group row">
  92           <label class="cd-col-form-label"
  93                  for="pool"
  94                  i18n>Pool
  95             <cd-helper>By default, the data_pool_layout of the parent directory is selected.</cd-helper>
  96           </label>
  97           <div class="cd-col-form-input">
  98             <select class="form-select"
  99                     id="pool"
 100                     name="pool"
 101                     formControlName="pool">
 102               <option *ngFor="let pool of dataPools"
 103                       [value]="pool.pool">{{ pool.pool }}</option>
 104             </select>
 105           </div>
 106         </div>
 107
 108         <!-- UID -->
 109         <div class="form-group row">
 110           <label class="cd-col-form-label"
 111                  for="uid"
 112                  i18n>UID</label>
 113           <div class="cd-col-form-input">
 114             <input class="form-control"
 115                    type="number"
 116                    placeholder="Subvolume UID..."
 117                    id="uid"
 118                    name="uid"
 119                    formControlName="uid">
 120           </div>
 121         </div>
 122
 123         <!-- GID -->
 124         <div class="form-group row">
 125           <label class="cd-col-form-label"
 126                  for="gid"
 127                  i18n>GID</label>
 128           <div class="cd-col-form-input">
 129             <input class="form-control"
 130                    type="number"
 131                    placeholder="Subvolume GID..."
 132                    id="gid"
 133                    name="gid"
 134                    formControlName="gid">
 135           </div>
 136         </div>
 137
 138         <!-- Mode -->
 139         <div class="form-group row">
 140           <label class="cd-col-form-label"
 141                  for="mode"
 142                  i18n>Mode
 143             <cd-helper>Permissions for the directory. Default mode is 755 which is rwxr-xr-x</cd-helper>
 144           </label>
 145           <div class="cd-col-form-input">
 146             <cd-checked-table-form [data]="scopePermissions"
 147                                    [columns]="columns"
 148                                    [form]="subvolumeForm"
 149                                    inputField="mode"
 150                                    [isTableForOctalMode]="true"
 151                                    [initialValue]="initialMode"
 152                                    [scopes]="scopes"
 153                                    [isDisabled]="isEdit"></cd-checked-table-form>
 154           </div>
 155           </div>
 156
 157         <!-- Is namespace-isolated -->
 158         <div class="form-group row">
 159           <div class="cd-col-form-offset">
 160             <div class="custom-control custom-checkbox">
 161               <input class="custom-control-input"
 162                      type="checkbox"
 163                      id="isolatedNamespace"
 164                      name="isolatedNamespace"
 165                      formControlName="isolatedNamespace">
 166               <label class="custom-control-label"
 167                      for="isolatedNamespace"
 168                      i18n>Isolated Namespace
 169                 <cd-helper>To create subvolume in a separate RADOS namespace.</cd-helper>
 170               </label>
 171             </div>
 172           </div>
 173         </div>
 174       </div>
 175
 176       <div class="modal-footer">
 177         <cd-form-button-panel (submitActionEvent)="submit()"
 178                               [form]="subvolumeForm"
 179                               [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)"></cd-form-button-panel>
 180       </div>
 181     </form>
 182   </ng-container>
 183 </cd-modal>