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

   1 <cd-modal #modal
   2           [modalRef]="activeModal">
   3   <ng-container class="modal-title">
   4     <ng-container *ngTemplateOutlet="deletionHeading"></ng-container>
   5   </ng-container>
   6
   7   <ng-container class="modal-content">
   8     <form name="deletionForm"
   9           #formDir="ngForm"
  10           [formGroup]="deletionForm"
  11           novalidate>
  12       <div class="modal-body">
  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-group">
  36             <div class="custom-control custom-checkbox">
  37               <input type="checkbox"
  38                      class="custom-control-input"
  39                      name="confirmation"
  40                      id="confirmation"
  41                      formControlName="confirmation"
  42                      autofocus>
  43               <label class="custom-control-label"
  44                      for="confirmation"
  45                      i18n>Yes, I am sure.</label>
  46             </div>
  47           </div>
  48         </div>
  49       </div>
  50       <div class="modal-footer">
  51         <cd-form-button-panel (submitActionEvent)="callSubmitAction()"
  52                               (backActionEvent)="backAction ? callBackAction() : hideModal()"
  53                               [form]="deletionForm"
  54                               [submitText]="(actionDescription | titlecase) + ' ' + itemDescription"></cd-form-button-panel>
  55       </div>
  56     </form>
  57   </ng-container>
  58 </cd-modal>
  59
  60 <ng-template #deletionHeading>
  61   {{ actionDescription | titlecase }} {{ itemDescription }}
  62 </ng-template>