diff options
Diffstat (limited to 'src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-import-modal/bootstrap-import-modal.component.html')
-rw-r--r-- | src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-import-modal/bootstrap-import-modal.component.html | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-import-modal/bootstrap-import-modal.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-import-modal/bootstrap-import-modal.component.html new file mode 100644 index 000000000..23372d383 --- /dev/null +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/bootstrap-import-modal/bootstrap-import-modal.component.html @@ -0,0 +1,96 @@ +<cd-modal [modalRef]="activeModal"> + <ng-container i18n + class="modal-title">Import Bootstrap Token</ng-container> + + <ng-container class="modal-content"> + <form name="importBootstrapForm" + class="form" + #formDir="ngForm" + [formGroup]="importBootstrapForm" + novalidate> + <div class="modal-body"> + <p> + <ng-container i18n>To import a bootstrap token which was created + by a peer site cluster, provide the local site's name, select + which pools will have mirroring enabled, provide the generated + token, and click <kbd>Import</kbd>.</ng-container> + </p> + + <div class="form-group"> + <label class="col-form-label required" + for="siteName" + i18n>Site Name</label> + <input class="form-control" + type="text" + placeholder="Name..." + i18n-placeholder + id="siteName" + name="siteName" + formControlName="siteName" + autofocus> + <span *ngIf="importBootstrapForm.showError('siteName', formDir, 'required')" + class="invalid-feedback" + i18n>This field is required.</span> + </div> + + <div class="form-group"> + <label class="col-form-label" + for="direction"> + <span i18n>Direction</span> + </label> + <select id="direction" + name="direction" + class="form-control" + formControlName="direction"> + <option *ngFor="let direction of directions" + [value]="direction.key">{{ direction.desc }}</option> + </select> + </div> + + <div class="form-group" + formGroupName="pools"> + <label class="col-form-label required" + for="pools" + i18n>Pools</label> + <div class="custom-control custom-checkbox" + *ngFor="let pool of pools"> + <input type="checkbox" + class="custom-control-input" + id="{{ pool.name }}" + name="{{ pool.name }}" + formControlName="{{ pool.name }}"> + <label class="custom-control-label" + for="{{ pool.name }}">{{ pool.name }}</label> + </div> + <span *ngIf="importBootstrapForm.showError('pools', formDir, 'requirePool')" + class="invalid-feedback" + i18n>At least one pool is required.</span> + </div> + + <div class="form-group"> + <label class="col-form-label required" + for="token" + i18n>Token</label> + <textarea class="form-control resize-vertical" + placeholder="Generated token..." + i18n-placeholder + id="token" + formControlName="token"> + </textarea> + <span *ngIf="importBootstrapForm.showError('token', formDir, 'required')" + class="invalid-feedback" + i18n>This field is required.</span> + <span *ngIf="importBootstrapForm.showError('token', formDir, 'invalidToken')" + class="invalid-feedback" + i18n>The token is invalid.</span> + </div> + </div> + + <div class="modal-footer"> + <cd-form-button-panel (submitActionEvent)="import()" + [form]="importBootstrapForm" + [submitText]="actionLabels.SUBMIT"></cd-form-button-panel> + </div> + </form> + </ng-container> +</cd-modal> |