git-server-git.apps.pok.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                           ariaLabel="confirmation"
  43                           i18n>Yes, I am sure.</cds-checkbox>
  44           </ng-container>
  45           <ng-template #highImpactDeletion>
  46             <cds-text-label label="Resource Name"
  47                             labelInputID="resource_name"
  48                             cdRequiredField="Resource Name"
  49                             [invalid]="!deletionForm.controls.confirmInput.valid && deletionForm.controls.confirmInput.dirty"
  50                             [invalidText]="ResourceError"
  51                             i18n
  52                             i18n-label>Resource Name
  53               <input cdsText
  54                      type="text"
  55                      placeholder="Enter resource name to delete"
  56                      id="resource_name"
  57                      formControlName="confirmInput"
  58                      i18n-placeholder/>
  59             </cds-text-label>
  60             <ng-template #ResourceError>
  61               <span *ngIf="deletionForm.showError('confirmInput', formDir, 'required')"
  62                     class="invalid-feedback">
  63                 <ng-container i18n>This field is required.</ng-container>
  64               </span>
  65               <span *ngIf="deletionForm.showError('confirmInput', formDir, 'matchResource')"
  66                     class="invalid-feedback">
  67                 <ng-container i18n>Enter the correct resource name.</ng-container>
  68               </span>
  69             </ng-template>
  70           </ng-template>
  71         </div>
  72       </div>
  73     </form>
  74   </section>
  75   <cd-form-button-panel (submitActionEvent)="callSubmitAction()"
  76                         (backActionEvent)="backAction ? callBackAction() : hideModal()"
  77                         [form]="deletionForm"
  78                         [submitText]="(actionDescription | titlecase) + ' ' + itemDescription"
  79                         [modalForm]="true"
  80                         [submitBtnType]="(actionDescription === 'delete' || actionDescription === 'remove') ? 'danger' : 'primary'"></cd-form-button-panel>
  81
  82 </cds-modal>
  83
  84 <ng-template #deletionHeading>
  85   <h3 cdsModalHeaderHeading
  86       i18n>
  87     {{ actionDescription | titlecase }} {{ itemDescription }}
  88   </h3>
  89 </ng-template>