]> git.apps.os.sepia.ceph.com Git - ceph.git/blob
23372d3837c837eeb3454d452576d4316851354d
[ceph.git] /
1 <cd-modal [modalRef]="activeModal">
2   <ng-container i18n
3                 class="modal-title">Import Bootstrap Token</ng-container>
4
5   <ng-container class="modal-content">
6     <form name="importBootstrapForm"
7           class="form"
8           #formDir="ngForm"
9           [formGroup]="importBootstrapForm"
10           novalidate>
11       <div class="modal-body">
12         <p>
13           <ng-container i18n>To import a bootstrap token which was created
14           by a peer site cluster, provide the local site's name, select
15           which pools will have mirroring enabled, provide the generated
16           token, and click&nbsp;<kbd>Import</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="importBootstrapForm.showError('siteName', formDir, 'required')"
32                 class="invalid-feedback"
33                 i18n>This field is required.</span>
34         </div>
35
36         <div class="form-group">
37           <label class="col-form-label"
38                  for="direction">
39             <span i18n>Direction</span>
40           </label>
41           <select id="direction"
42                   name="direction"
43                   class="form-control"
44                   formControlName="direction">
45             <option *ngFor="let direction of directions"
46                     [value]="direction.key">{{ direction.desc }}</option>
47           </select>
48         </div>
49
50         <div class="form-group"
51              formGroupName="pools">
52           <label class="col-form-label required"
53                  for="pools"
54                  i18n>Pools</label>
55           <div class="custom-control custom-checkbox"
56                *ngFor="let pool of pools">
57             <input type="checkbox"
58                    class="custom-control-input"
59                    id="{{ pool.name }}"
60                    name="{{ pool.name }}"
61                    formControlName="{{ pool.name }}">
62             <label class="custom-control-label"
63                    for="{{ pool.name }}">{{ pool.name }}</label>
64           </div>
65           <span *ngIf="importBootstrapForm.showError('pools', formDir, 'requirePool')"
66                 class="invalid-feedback"
67                 i18n>At least one pool is required.</span>
68         </div>
69
70         <div class="form-group">
71           <label class="col-form-label required"
72                  for="token"
73                  i18n>Token</label>
74           <textarea class="form-control resize-vertical"
75                     placeholder="Generated token..."
76                     i18n-placeholder
77                     id="token"
78                     formControlName="token">
79           </textarea>
80           <span *ngIf="importBootstrapForm.showError('token', formDir, 'required')"
81                 class="invalid-feedback"
82                 i18n>This field is required.</span>
83           <span *ngIf="importBootstrapForm.showError('token', formDir, 'invalidToken')"
84                 class="invalid-feedback"
85                 i18n>The token is invalid.</span>
86         </div>
87       </div>
88
89       <div class="modal-footer">
90         <cd-form-button-panel (submitActionEvent)="import()"
91                               [form]="importBootstrapForm"
92                               [submitText]="actionLabels.SUBMIT"></cd-form-button-panel>
93       </div>
94     </form>
95   </ng-container>
96 </cd-modal>