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