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

   1 <cd-modal [modalRef]="activeModal">
   2   <ng-container i18n="form title"
   3                 class="modal-title">Import Multi-Site Token</ng-container>
   4
   5   <ng-container class="modal-content">
   6     <form name="importTokenForm"
   7           #frm="ngForm"
   8           [formGroup]="importTokenForm">
   9     <div class="modal-body">
  10       <cd-alert-panel type="info"
  11                       spacingClass="mb-3">
  12         <ul>
  13           <li>This feature allows you to configure a connection between your primary and secondary Ceph clusters for data replication. By importing a token, you establish a link between the clusters, enabling data synchronization.</li>
  14           <li>To obtain the token, generate it from your secondary Ceph cluster. This token includes encoded information about the secondary cluster's endpoint, access key, and secret key.</li>
  15           <li>The secondary zone represents the destination cluster where your data will be replicated.</li>
  16         </ul>
  17       </cd-alert-panel>
  18       <legend i18n>Zone Details</legend>
  19       <div class="form-group row">
  20         <label class="cd-col-form-label required"
  21                for="realmToken"
  22                i18n>Token
  23         </label>
  24         <div class="cd-col-form-input">
  25           <input id="realmToken"
  26                  name="realmToken"
  27                  class="form-control"
  28                  type="text"
  29                  formControlName="realmToken">
  30           <span class="invalid-feedback"
  31                 *ngIf="importTokenForm.showError('realmToken', frm, 'required')"
  32                 i18n>This field is required.</span>
  33         </div>
  34       </div>
  35       <div class="form-group row">
  36         <label class="cd-col-form-label required"
  37                for="zoneName"
  38                i18n>Secondary Zone Name</label>
  39         <div class="cd-col-form-input">
  40           <input class="form-control"
  41                  type="text"
  42                  placeholder="Zone name..."
  43                  id="zoneName"
  44                  name="zoneName"
  45                  formControlName="zoneName">
  46           <span class="invalid-feedback"
  47                 *ngIf="importTokenForm.showError('zoneName', frm, 'required')"
  48                 i18n>This field is required.</span>
  49           <span class="invalid-feedback"
  50                 *ngIf="importTokenForm.showError('zoneName', frm, 'uniqueName')"
  51                 i18n>The chosen zone name is already in use.</span>
  52         </div>
  53       </div>
  54
  55       <legend i18n>Service Details</legend>
  56       <div class="form-group row">
  57         <div class="cd-col-form-offset">
  58           <div class="custom-control custom-checkbox">
  59             <input class="custom-control-input"
  60                    id="unmanaged"
  61                    type="checkbox"
  62                    formControlName="unmanaged">
  63             <label class="custom-control-label"
  64                    for="unmanaged"
  65                    i18n>Unmanaged</label>
  66             <cd-helper i18n>If set to true, the orchestrator will not start nor stop any daemon associated with this service.
  67                Placement and all other properties will be ignored.</cd-helper>
  68           </div>
  69         </div>
  70       </div>
  71
  72       <!-- Placement -->
  73       <div *ngIf="!importTokenForm.controls.unmanaged.value"
  74            class="form-group row">
  75         <label class="cd-col-form-label"
  76                for="placement"
  77                i18n>Placement</label>
  78         <div class="cd-col-form-input">
  79           <select id="placement"
  80                   class="form-select"
  81                   formControlName="placement">
  82             <option i18n
  83                     value="hosts">Hosts</option>
  84             <option i18n
  85                     value="label">Label</option>
  86           </select>
  87         </div>
  88       </div>
  89
  90       <!-- Label -->
  91       <div *ngIf="!importTokenForm.controls.unmanaged.value && importTokenForm.controls.placement.value === 'label'"
  92            class="form-group row">
  93         <label i18n
  94                class="cd-col-form-label"
  95                for="label">Label</label>
  96         <div class="cd-col-form-input">
  97           <input id="label"
  98                  class="form-control"
  99                  type="text"
 100                  formControlName="label"
 101                  [ngbTypeahead]="searchLabels"
 102                  (focus)="labelFocus.next($any($event).target.value)"
 103                  (click)="labelClick.next($any($event).target.value)">
 104           <span class="invalid-feedback"
 105                 *ngIf="importTokenForm.showError('label', frm, 'required')"
 106                 i18n>This field is required.</span>
 107         </div>
 108       </div>
 109
 110       <!-- Hosts -->
 111       <div *ngIf="!importTokenForm.controls.unmanaged.value && importTokenForm.controls.placement.value === 'hosts'"
 112            class="form-group row">
 113         <label class="cd-col-form-label"
 114                for="hosts"
 115                i18n>Hosts</label>
 116         <div class="cd-col-form-input">
 117           <cd-select-badges id="hosts"
 118                             [data]="importTokenForm.controls.hosts.value"
 119                             [options]="hosts.options"
 120                             [messages]="hosts.messages">
 121           </cd-select-badges>
 122         </div>
 123       </div>
 124
 125       <!-- count -->
 126       <div *ngIf="!importTokenForm.controls.unmanaged.value"
 127            class="form-group row">
 128         <label class="cd-col-form-label"
 129                for="count">
 130           <span i18n>Count</span>
 131           <cd-helper i18n>Only that number of daemons will be created.</cd-helper>
 132         </label>
 133         <div class="cd-col-form-input">
 134           <input id="count"
 135                  class="form-control"
 136                  type="number"
 137                  formControlName="count"
 138                  min="1">
 139           <span class="invalid-feedback"
 140                 *ngIf="importTokenForm.showError('count', frm, 'min')"
 141                 i18n>The value must be at least 1.</span>
 142           <span class="invalid-feedback"
 143                 *ngIf="importTokenForm.showError('count', frm, 'pattern')"
 144                 i18n>The entered value needs to be a number.</span>
 145         </div>
 146       </div>
 147
 148       <!-- RGW -->
 149       <ng-container *ngIf="!importTokenForm.controls.unmanaged.value">
 150         <!-- rgw_frontend_port -->
 151         <div class="form-group row">
 152           <label i18n
 153                  class="cd-col-form-label"
 154                  for="rgw_frontend_port">Port</label>
 155           <div class="cd-col-form-input">
 156             <input id="rgw_frontend_port"
 157                    class="form-control"
 158                    type="number"
 159                    formControlName="rgw_frontend_port"
 160                    min="1"
 161                    max="65535">
 162             <span class="invalid-feedback"
 163                   *ngIf="importTokenForm.showError('rgw_frontend_port', frm, 'pattern')"
 164                   i18n>The entered value needs to be a number.</span>
 165             <span class="invalid-feedback"
 166                   *ngIf="importTokenForm.showError('rgw_frontend_port', frm, 'min')"
 167                   i18n>The value must be at least 1.</span>
 168             <span class="invalid-feedback"
 169                   *ngIf="importTokenForm.showError('rgw_frontend_port', frm, 'max')"
 170                   i18n>The value cannot exceed 65535.</span>
 171           </div>
 172         </div>
 173       </ng-container>
 174     </div>
 175     <div class="modal-footer">
 176       <cd-form-button-panel (submitActionEvent)="onSubmit()"
 177                             [submitText]="actionLabels.IMPORT"
 178                             [form]="importTokenForm"></cd-form-button-panel>
 179     </div>
 180     </form>
 181   </ng-container>
 182 </cd-modal>