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

   1 <cds-modal size="sm"
   2            [open]="open"
   3            (overlaySelected)="closeModal()">
   4   <cds-modal-header (closeSelect)="closeModal()">
   5     <ng-container *ngTemplateOutlet="deletionHeading"></ng-container>
   6   </cds-modal-header>
   7
   8   <section cdsModalContent>
   9     <form name="deletionForm"
  10           #formDir="ngForm"
  11           [formGroup]="deletionForm"
  12           novalidate>
  13       <cd-alert-panel *ngIf="infoMessage"
  14                       type="info"
  15                       spacingClass="mb-3"
  16                       i18n>
  17         <p>{{ infoMessage }}</p>
  18       </cd-alert-panel>
  19       <ng-container *ngTemplateOutlet="bodyTemplate; context: bodyContext"></ng-container>
  20       <div class="question">
  21         <span *ngIf="itemNames; else noNames">
  22           <p *ngIf="itemNames.length === 1; else manyNames"
  23              i18n>Are you sure that you want to {{ actionDescription | lowercase }} <strong>{{ itemNames[0] }}</strong>?</p>
  24           <ng-template #manyNames>
  25             <p i18n>Are you sure that you want to {{ actionDescription | lowercase }} the selected items?</p>
  26             <ul>
  27               <li *ngFor="let itemName of itemNames"><strong>{{ itemName }}</strong></li>
  28             </ul>
  29           </ng-template >
  30         </span>
  31         <ng-template #noNames>
  32           <p i18n>Are you sure that you want to {{ actionDescription | lowercase }} the selected {{ itemDescription }}?</p>
  33         </ng-template>
  34         <ng-container *ngTemplateOutlet="childFormGroupTemplate; context:{form:deletionForm}"></ng-container>
  35         <div class="form-item">
  36           <ng-container *ngIf="impact == impactEnum.medium; else highImpactDeletion">
  37             <cds-checkbox id="confirmation"
  38                           formControlName="confirmation"
  39                           autofocus
  40                           [required]="true"
  41                           modal-primary-focus
  42                           i18n>Yes, I am sure.</cds-checkbox>
  43           </ng-container>
  44           <ng-template #highImpactDeletion>
  45             <cds-text-label label="Resource Name"
  46                             labelInputID="resource_name"
  47                             cdRequiredField="Resource Name"
  48                             [invalid]="!deletionForm.controls.confirmInput.valid && deletionForm.controls.confirmInput.dirty"
  49                             [invalidText]="ResourceError"
  50                             i18n
  51                             i18n-label>Resource Name
  52               <input cdsText
  53                      type="text"
  54                      placeholder="Enter resource name to delete"
  55                      id="resource_name"
  56                      formControlName="confirmInput"
  57                      i18n-placeholder/>
  58             </cds-text-label>
  59             <ng-template #ResourceError>
  60               <span *ngIf="deletionForm.showError('confirmInput', formDir, 'required')"
  61                     class="invalid-feedback">
  62                 <ng-container i18n>This field is required.</ng-container>
  63               </span>
  64               <span *ngIf="deletionForm.showError('confirmInput', formDir, 'matchResource')"
  65                     class="invalid-feedback">
  66                 <ng-container i18n>Enter the correct resource name.</ng-container>
  67               </span>
  68             </ng-template>
  69           </ng-template>
  70         </div>
  71       </div>
  72     </form>
  73   </section>
  74   <cd-form-button-panel (submitActionEvent)="callSubmitAction()"
  75                         (backActionEvent)="backAction ? callBackAction() : hideModal()"
  76                         [form]="deletionForm"
  77                         [submitText]="(actionDescription | titlecase) + ' ' + itemDescription"
  78                         [modalForm]="true"
  79                         [submitBtnType]="(actionDescription === 'delete' || actionDescription === 'remove') ? 'danger' : 'primary'"></cd-form-button-panel>
  80
  81 </cds-modal>
  82
  83 <ng-template #deletionHeading>
  84   <h3 cdsModalHeaderHeading
  85       i18n>
  86     {{ actionDescription | titlecase }} {{ itemDescription }}
  87   </h3>
  88 </ng-template>