ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-create-modal/bootstrap-create-modal.component.html

   1 <cd-modal [modalRef]="activeModal">
   2   <ng-container i18n
   3                 class="modal-title">Create Bootstrap Token</ng-container>
   4
   5   <ng-container class="modal-content">
   6     <form name="createBootstrapForm"
   7           class="form"
   8           #formDir="ngForm"
   9           [formGroup]="createBootstrapForm"
  10           novalidate>
  11       <div class="modal-body">
  12         <p>
  13           <ng-container i18n>To create a bootstrap token which can be imported
  14           by a peer site cluster, provide the local site's name, select
  15           which pools will have mirroring enabled, and click&nbsp;
  16           <kbd>Generate</kbd>.</ng-container>
  17         </p>
  18
  19         <div class="form-group">
  20           <label class="col-form-label required"
  21                  for="siteName"
  22                  i18n>Site Name</label>
  23           <input class="form-control"
  24                  type="text"
  25                  placeholder="Name..."
  26                  i18n-placeholder
  27                  id="siteName"
  28                  name="siteName"
  29                  formControlName="siteName"
  30                  autofocus>
  31           <span *ngIf="createBootstrapForm.showError('siteName', formDir, 'required')"
  32                 class="invalid-feedback"
  33                 i18n>This field is required.</span>
  34         </div>
  35
  36         <div class="form-group"
  37              formGroupName="pools">
  38           <label class="col-form-label required"
  39                  for="pools"
  40                  i18n>Pools</label>
  41           <div class="custom-control custom-checkbox"
  42                *ngFor="let pool of pools">
  43             <input type="checkbox"
  44                    class="custom-control-input"
  45                    id="{{ pool.name }}"
  46                    name="{{ pool.name }}"
  47                    formControlName="{{ pool.name }}">
  48             <label class="custom-control-label"
  49                    for="{{ pool.name }}">{{ pool.name }}</label>
  50           </div>
  51           <span *ngIf="createBootstrapForm.showError('pools', formDir, 'requirePool')"
  52                 class="invalid-feedback"
  53                 i18n>At least one pool is required.</span>
  54         </div>
  55
  56         <cd-submit-button class="mb-4 float-right"
  57                           i18n
  58                           [form]="createBootstrapForm"
  59                           (submitAction)="generate()">Generate</cd-submit-button>
  60
  61         <div class="form-group">
  62           <label class="col-form-label"
  63                  for="token">
  64             <span i18n>Token</span>
  65           </label>
  66           <textarea class="form-control resize-vertical"
  67                     placeholder="Generated token..."
  68                     i18n-placeholder
  69                     id="token"
  70                     formControlName="token"
  71                     readonly>
  72           </textarea>
  73         </div>
  74         <cd-copy-2-clipboard-button class="float-right"
  75                                     source="token">
  76         </cd-copy-2-clipboard-button>
  77       </div>
  78
  79       <div class="modal-footer">
  80         <cd-back-button (backAction)="activeModal.close()"
  81                         name="Close"
  82                         i18n-name>
  83         </cd-back-button>
  84       </div>
  85     </form>
  86   </ng-container>
  87 </cd-modal>