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

   1 <cds-modal size="lg"
   2            [open]="open"
   3            [hasScrollingContent]="true"
   4            (overlaySelected)="closeModal()">
   5   <cds-modal-header (closeSelect)="closeModal()">
   6     <h3 cdsModalHeaderHeading
   7         i18n>
   8     {{ action | titlecase }} {{ resource | upperFirst }}
   9     </h3>
  10   </cds-modal-header>
  11
  12   <ng-container *cdFormLoading="loading">
  13     <div cdsModalContent>
  14       <form name="snapScheduleForm"
  15             #formDir="ngForm"
  16             [formGroup]="snapScheduleForm"
  17             novalidate>
  18         <!-- Directory -->
  19         <div class="form-item">
  20           <cds-text-label for="directory"
  21                           i18n
  22                           cdRequiredField="Directory"
  23                           [invalid]="snapScheduleForm.controls.directory.invalid && (snapScheduleForm.controls.directory.dirty)"
  24                           [invalidText]="directoryError"
  25                           [skeleton]="directoryStore.isLoading"
  26                           modal-primary-focus>
  27             <ng-container *ngIf="!directoryStore.isLoading">Directory (required)</ng-container>
  28             <input cdsText
  29                    type="text"
  30                    formControlName="directory"
  31                    name="directory"
  32                    [ngbTypeahead]="search"
  33                    [invalid]="snapScheduleForm.controls.directory.invalid && (snapScheduleForm.controls.directory.dirty)"
  34                    [placeholder]="directoryStore.isLoading ? '' : 'Directory path'"
  35                    [skeleton]="directoryStore.isLoading"/>
  36           </cds-text-label>
  37           <ng-template #directoryError>
  38             <span class="invalid-feedback"
  39                   *ngIf="snapScheduleForm.showError('directory', formDir, 'required')"
  40                   i18n>This field is required.</span>
  41             <span class="invalid-feedback"
  42                   *ngIf="snapScheduleForm.showError('directory', formDir, 'notUnique')"
  43                   i18n>A snapshot schedule for this path already exists.</span>
  44           </ng-template>
  45         </div>
  46
  47         <!--Start date -->
  48         <cd-date-time-picker
  49           name="Start Date"
  50           helperText="The time zone is assumed to be UTC"
  51           [control]="snapScheduleForm.get('startDate')"
  52           [disabled]="isEdit"></cd-date-time-picker>
  53           <span class="invalid-feedback"
  54                 *ngIf="snapScheduleForm.showError('startDate', formDir, 'required')"
  55                 i18n>This field is required.</span>
  56
  57         <!-- Repeat interval -->
  58         <div class="form-item form-item-append"
  59              cdsRow>
  60           <div cdsCol>
  61             <cds-number [id]="'repeatInterval'"
  62                         [name]="'repeatInterval'"
  63                         [formControlName]="'repeatInterval'"
  64                         [label]="'Schedule'"
  65                         [min]="1"
  66                         [invalid]="!snapScheduleForm.controls.repeatInterval.valid && (snapScheduleForm.controls.repeatInterval.dirty)"
  67                         [invalidText]="repeatIntervalError"
  68                         cdRequiredField="Schedule"></cds-number>
  69           </div>
  70           <div cdsCol>
  71             <cds-select id="repeatFrequency"
  72                         name="repeatFrequency"
  73                         formControlName="repeatFrequency"
  74                         label="Frequency"
  75                         [invalid]="!snapScheduleForm.controls.repeatFrequency.valid && (snapScheduleForm.controls.repeatFrequency.dirty)"
  76                         [invalidText]="repeatFrequencyError"
  77                         *ngIf="repeatFrequencies">
  78               <option *ngFor="let freq of repeatFrequencies"
  79                       [value]="freq[1]">{{ freq[0] }}
  80               </option>
  81             </cds-select>
  82             <ng-template #repeatFrequencyError>
  83               <span class="invalid-feedback"
  84                     *ngIf="snapScheduleForm.showError('repeatFrequency', formDir, 'notUnique')"
  85                     i18n>This schedule already exists for the selected directory.</span>
  86             </ng-template>
  87             <ng-template #repeatIntervalError>
  88               <span class="invalid-feedback"
  89                     *ngIf="snapScheduleForm.showError('repeatInterval', formDir, 'required')"
  90                     i18n>This field is required.</span>
  91               <span class="invalid-feedback"
  92                     *ngIf="snapScheduleForm.showError('repeatInterval', formDir, 'min')"
  93                     i18n>Choose a value greater than 0.</span>
  94             </ng-template>
  95           </div>
  96         </div>
  97
  98         <!-- Retention policies -->
  99         <ng-container formArrayName="retentionPolicies"
 100                       *ngFor="let retentionPolicy of retentionPolicies.controls; index as i">
 101           <ng-container [formGroupName]="i">
 102             <div cdsRow
 103                  class="form-item form-item-append">
 104               <div cdsCol
 105                    [columnNumbers]="{lg: 8}">
 106                 <cds-number [id]="'retentionInterval' + i"
 107                             [name]="'retentionInterval' + i"
 108                             [formControlName]="'retentionInterval'"
 109                             [label]="'Retention policy'"
 110                             [min]="1"
 111                             [invalid]="snapScheduleForm.controls['retentionPolicies'].controls[i].invalid && snapScheduleForm.controls['retentionPolicies'].dirty"
 112                             [invalidText]="retentionPolicyError"></cds-number>
 113               </div>
 114               <div cdsCol
 115                    [columnNumbers]="{lg: 7}">
 116                 <cds-select id="retentionFrequency"
 117                             name="retentionFrequency"
 118                             formControlName="retentionFrequency"
 119                             label="Frequency"
 120                             *ngIf="retentionFrequencies">
 121                   <option *ngFor="let freq of retentionFrequencies"
 122                           [value]="freq[1]">{{ freq[0] }}</option>
 123
 124                 </cds-select>
 125               </div>
 126               <div cdsCol
 127                    [columnNumbers]="{lg: 1}"
 128                    class="item-action-btn">
 129                 <cds-icon-button kind="tertiary"
 130                                  size="sm"
 131                                  (click)="removeRetentionPolicy(i)">
 132                   <svg cdsIcon="trash-can"
 133                        size="32"
 134                        class="cds--btn__icon"></svg>
 135                 </cds-icon-button>
 136               </div>
 137             </div>
 138             <ng-template #retentionPolicyError>
 139               <span class="invalid-feedback"
 140                     *ngIf="snapScheduleForm.controls['retentionPolicies'].controls[i].invalid"
 141                     i18n>This retention policy already exists for the selected directory.</span>
 142             </ng-template>
 143           </ng-container>
 144         </ng-container>
 145
 146         <div class="form-item">
 147           <button cdsButton="tertiary"
 148                   type="button"
 149                   (click)="addRetentionPolicy()"
 150                   i18n>
 151             Add retention policy
 152             <svg cdsIcon="add"
 153                  size="32"
 154                  class="cds--btn__icon"
 155                  icon></svg>
 156           </button>
 157         </div>
 158       </form>
 159     </div>
 160     <cd-form-button-panel (submitActionEvent)="submit()"
 161                           [form]="snapScheduleForm"
 162                           [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)"
 163                           [modalForm]="true"></cd-form-button-panel>
 164   </ng-container>
 165 </cds-modal>