]>
Commit | Line | Data |
---|---|---|
9f95a23c | 1 | <div class="cd-col-form"> |
11fdf7f2 | 2 | <form name="targetForm" |
11fdf7f2 TL |
3 | #formDir="ngForm" |
4 | [formGroup]="targetForm" | |
5 | novalidate | |
6 | *ngIf="targetForm"> | |
9f95a23c TL |
7 | <div class="card"> |
8 | <div i18n="form title|Example: Create Pool@@formTitle" | |
9 | class="card-header">{{ action | titlecase }} {{ resource | upperFirst }}</div> | |
11fdf7f2 | 10 | |
9f95a23c | 11 | <div class="card-body"> |
11fdf7f2 | 12 | <!-- Target IQN --> |
9f95a23c TL |
13 | <div class="form-group row"> |
14 | <label class="cd-col-form-label required" | |
15 | for="target_iqn" | |
16 | i18n>Target IQN</label> | |
17 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
18 | <div class="input-group"> |
19 | <input class="form-control" | |
20 | type="text" | |
21 | id="target_iqn" | |
22 | name="target_iqn" | |
92f5a8d4 TL |
23 | formControlName="target_iqn" |
24 | cdTrim /> | |
9f95a23c TL |
25 | <span class="input-group-append"> |
26 | <button class="btn btn-light" | |
11fdf7f2 TL |
27 | id="ecp-info-button" |
28 | type="button" | |
29 | (click)="targetSettingsModal()"> | |
9f95a23c | 30 | <i [ngClass]="[icons.deepCheck]" |
11fdf7f2 TL |
31 | aria-hidden="true"></i> |
32 | </button> | |
33 | </span> | |
34 | </div> | |
35 | ||
9f95a23c | 36 | <span class="invalid-feedback" |
11fdf7f2 TL |
37 | *ngIf="targetForm.showError('target_iqn', formDir, 'required')" |
38 | i18n>This field is required.</span> | |
39 | ||
9f95a23c | 40 | <span class="invalid-feedback" |
11fdf7f2 TL |
41 | *ngIf="targetForm.showError('target_iqn', formDir, 'pattern')" |
42 | i18n>IQN has wrong pattern.</span> | |
43 | ||
9f95a23c | 44 | <span class="invalid-feedback" |
11fdf7f2 | 45 | *ngIf="targetForm.showError('target_iqn', formDir, 'iqn')"> |
9f95a23c TL |
46 | <ng-container i18n>An IQN has the following notation |
47 | 'iqn.$year-$month.$reversedAddress:$definedName'</ng-container> | |
11fdf7f2 TL |
48 | <br> |
49 | <ng-container i18n>For example: iqn.2016-06.org.dashboard:storage:disk.sn-a8675309</ng-container> | |
50 | <br> | |
51 | <a target="_blank" | |
52 | href="https://en.wikipedia.org/wiki/ISCSI#Addressing" | |
53 | i18n>More information</a> | |
54 | </span> | |
55 | ||
9f95a23c | 56 | <span class="form-text text-muted" |
11fdf7f2 TL |
57 | *ngIf="hasAdvancedSettings(targetForm.getValue('target_controls'))" |
58 | i18n>This target has modified advanced settings.</span> | |
59 | <hr /> | |
60 | </div> | |
61 | </div> | |
62 | ||
63 | <!-- Portals --> | |
9f95a23c TL |
64 | <div class="form-group row"> |
65 | <label class="cd-col-form-label required" | |
66 | for="portals" | |
67 | i18n>Portals</label> | |
68 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
69 | |
70 | <ng-container *ngFor="let portal of portals.value; let i = index"> | |
71 | <div class="input-group cd-mb"> | |
9f95a23c | 72 | <input class="cd-form-control" |
11fdf7f2 TL |
73 | type="text" |
74 | [value]="portal" | |
75 | disabled /> | |
9f95a23c TL |
76 | <span class="input-group-append"> |
77 | <button class="btn btn-light" | |
11fdf7f2 TL |
78 | type="button" |
79 | (click)="removePortal(i, portal)"> | |
9f95a23c | 80 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
81 | aria-hidden="true"></i> |
82 | </button> | |
83 | </span> | |
84 | </div> | |
85 | </ng-container> | |
86 | ||
11fdf7f2 TL |
87 | <div class="row"> |
88 | <div class="col-md-12"> | |
89 | <cd-select [data]="portals.value" | |
90 | [options]="portalsSelections" | |
91 | [messages]="messages.portals" | |
92 | (selection)="onPortalSelection($event)" | |
9f95a23c TL |
93 | elemClass="btn btn-light float-right"> |
94 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
95 | <ng-container i18n>Add portal</ng-container> |
96 | </cd-select> | |
97 | </div> | |
98 | </div> | |
99 | ||
9f95a23c TL |
100 | <input class="form-control" |
101 | type="hidden" | |
102 | id="portals" | |
103 | name="portals" | |
104 | formControlName="portals" /> | |
105 | ||
106 | <span class="invalid-feedback" | |
107 | *ngIf="targetForm.showError('portals', formDir, 'minGateways')" | |
108 | i18n>At least {{ minimum_gateways }} gateways are required.</span> | |
109 | ||
11fdf7f2 TL |
110 | <hr /> |
111 | </div> | |
112 | </div> | |
113 | ||
114 | <!-- Images --> | |
9f95a23c TL |
115 | <div class="form-group row"> |
116 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
117 | for="disks" |
118 | i18n>Images</label> | |
9f95a23c | 119 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
120 | <ng-container *ngFor="let image of targetForm.getValue('disks'); let i = index"> |
121 | <div class="input-group cd-mb"> | |
9f95a23c | 122 | <input class="cd-form-control" |
11fdf7f2 TL |
123 | type="text" |
124 | [value]="image" | |
125 | disabled /> | |
9f95a23c TL |
126 | <span class="input-group-append"> |
127 | <div class="input-group-text" | |
128 | *ngIf="api_version >= 1">lun: {{ imagesSettings[image]['lun'] }}</div> | |
129 | <button class="btn btn-light" | |
11fdf7f2 TL |
130 | type="button" |
131 | (click)="imageSettingsModal(image)"> | |
9f95a23c | 132 | <i [ngClass]="[icons.deepCheck]" |
11fdf7f2 TL |
133 | aria-hidden="true"></i> |
134 | </button> | |
9f95a23c | 135 | <button class="btn btn-light" |
11fdf7f2 TL |
136 | type="button" |
137 | (click)="removeImage(i, image)"> | |
9f95a23c | 138 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
139 | aria-hidden="true"></i> |
140 | </button> | |
141 | </span> | |
142 | ||
143 | </div> | |
144 | ||
9f95a23c | 145 | <span class="form-text text-muted"> |
11fdf7f2 TL |
146 | <ng-container *ngIf="backstores.length > 1" |
147 | i18n>Backstore: {{ imagesSettings[image].backstore | iscsiBackstore }}. </ng-container> | |
148 | ||
149 | <ng-container *ngIf="hasAdvancedSettings(imagesSettings[image][imagesSettings[image].backstore])" | |
150 | i18n>This image has modified settings.</ng-container> | |
151 | </span> | |
152 | </ng-container> | |
153 | ||
eafe8130 TL |
154 | <input class="form-control" |
155 | type="hidden" | |
156 | id="disks" | |
157 | name="disks" | |
158 | formControlName="disks" /> | |
159 | ||
9f95a23c | 160 | <span class="invalid-feedback" |
eafe8130 TL |
161 | *ngIf="targetForm.showError('disks', formDir, 'dupLunId')" |
162 | i18n>Duplicated LUN numbers.</span> | |
163 | ||
9f95a23c | 164 | <span class="invalid-feedback" |
eafe8130 TL |
165 | *ngIf="targetForm.showError('disks', formDir, 'dupWwn')" |
166 | i18n>Duplicated WWN.</span> | |
11fdf7f2 TL |
167 | |
168 | <div class="row"> | |
169 | <div class="col-md-12"> | |
170 | <cd-select [data]="disks.value" | |
171 | [options]="imagesSelections" | |
172 | [messages]="messages.images" | |
173 | (selection)="onImageSelection($event)" | |
9f95a23c TL |
174 | elemClass="btn btn-light float-right"> |
175 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
176 | <ng-container i18n>Add image</ng-container> |
177 | </cd-select> | |
178 | </div> | |
179 | </div> | |
180 | ||
181 | <hr /> | |
182 | </div> | |
183 | </div> | |
184 | ||
185 | <!-- acl_enabled --> | |
9f95a23c TL |
186 | <div class="form-group row"> |
187 | <div class="cd-col-form-offset"> | |
188 | <div class="custom-control custom-checkbox"> | |
11fdf7f2 | 189 | <input type="checkbox" |
9f95a23c | 190 | class="custom-control-input" |
11fdf7f2 TL |
191 | formControlName="acl_enabled" |
192 | name="acl_enabled" | |
193 | id="acl_enabled"> | |
194 | <label for="acl_enabled" | |
9f95a23c | 195 | class="custom-control-label" |
11fdf7f2 TL |
196 | i18n>ACL authentication</label> |
197 | </div> | |
198 | ||
199 | <hr /> | |
200 | </div> | |
201 | </div> | |
202 | ||
eafe8130 | 203 | <!-- Target level authentication was introduced in ceph-iscsi config v11 --> |
9f95a23c TL |
204 | <div formGroupName="auth" |
205 | *ngIf="cephIscsiConfigVersion > 10 && !targetForm.getValue('acl_enabled')"> | |
eafe8130 TL |
206 | |
207 | <!-- Target user --> | |
9f95a23c TL |
208 | <div class="form-group row"> |
209 | <label class="cd-col-form-label" | |
eafe8130 TL |
210 | for="target_user"> |
211 | <ng-container i18n>User</ng-container> | |
212 | </label> | |
9f95a23c | 213 | <div class="cd-col-form-input"> |
eafe8130 TL |
214 | <input class="form-control" |
215 | type="text" | |
216 | id="target_user" | |
217 | name="target_user" | |
218 | formControlName="user" /> | |
219 | ||
9f95a23c | 220 | <span class="invalid-feedback" |
eafe8130 TL |
221 | *ngIf="targetForm.showError('user', formDir, 'required')" |
222 | i18n>This field is required.</span> | |
223 | ||
9f95a23c | 224 | <span class="invalid-feedback" |
eafe8130 TL |
225 | *ngIf="targetForm.showError('user', formDir, 'pattern')" |
226 | i18n>Usernames must have a length of 8 to 64 characters and | |
227 | can only contain letters, '.', '@', '-', '_' or ':'.</span> | |
228 | </div> | |
229 | </div> | |
230 | ||
231 | <!-- Target password --> | |
9f95a23c TL |
232 | <div class="form-group row"> |
233 | <label class="cd-col-form-label" | |
eafe8130 TL |
234 | for="target_password"> |
235 | <ng-container i18n>Password</ng-container> | |
236 | </label> | |
9f95a23c | 237 | <div class="cd-col-form-input"> |
eafe8130 TL |
238 | <div class="input-group"> |
239 | <input class="form-control" | |
240 | type="password" | |
241 | autocomplete="new-password" | |
242 | id="target_password" | |
243 | name="target_password" | |
244 | formControlName="password" /> | |
9f95a23c | 245 | <span class="input-group-append"> |
eafe8130 | 246 | <button type="button" |
9f95a23c | 247 | class="btn btn-light" |
eafe8130 TL |
248 | cdPasswordButton="target_password"> |
249 | </button> | |
250 | <button type="button" | |
9f95a23c | 251 | class="btn btn-light" |
eafe8130 TL |
252 | cdCopy2ClipboardButton="target_password"> |
253 | </button> | |
254 | </span> | |
255 | </div> | |
256 | ||
9f95a23c | 257 | <span class="invalid-feedback" |
eafe8130 TL |
258 | *ngIf="targetForm.showError('password', formDir, 'required')" |
259 | i18n>This field is required.</span> | |
260 | ||
9f95a23c | 261 | <span class="invalid-feedback" |
eafe8130 TL |
262 | *ngIf="targetForm.showError('password', formDir, 'pattern')" |
263 | i18n>Passwords must have a length of 12 to 16 characters | |
264 | and can only contain letters, '@', '-', '_' or '/'.</span> | |
265 | </div> | |
266 | </div> | |
267 | ||
268 | <!-- Target mutual_user --> | |
9f95a23c TL |
269 | <div class="form-group row"> |
270 | <label class="cd-col-form-label" | |
eafe8130 TL |
271 | for="target_mutual_user"> |
272 | <ng-container i18n>Mutual User</ng-container> | |
273 | </label> | |
9f95a23c | 274 | <div class="cd-col-form-input"> |
eafe8130 TL |
275 | <input class="form-control" |
276 | type="text" | |
277 | id="target_mutual_user" | |
278 | name="target_mutual_user" | |
279 | formControlName="mutual_user" /> | |
280 | ||
9f95a23c | 281 | <span class="invalid-feedback" |
eafe8130 TL |
282 | *ngIf="targetForm.showError('mutual_user', formDir, 'required')" |
283 | i18n>This field is required.</span> | |
284 | ||
9f95a23c | 285 | <span class="invalid-feedback" |
eafe8130 TL |
286 | *ngIf="targetForm.showError('mutual_user', formDir, 'pattern')" |
287 | i18n>Usernames must have a length of 8 to 64 characters and | |
288 | can only contain letters, '.', '@', '-', '_' or ':'.</span> | |
289 | </div> | |
290 | </div> | |
291 | ||
292 | <!-- Target mutual_password --> | |
9f95a23c TL |
293 | <div class="form-group row"> |
294 | <label class="cd-col-form-label" | |
eafe8130 TL |
295 | for="target_mutual_password"> |
296 | <ng-container i18n>Mutual Password</ng-container> | |
297 | </label> | |
9f95a23c | 298 | <div class="cd-col-form-input"> |
eafe8130 TL |
299 | <div class="input-group"> |
300 | <input class="form-control" | |
301 | type="password" | |
302 | autocomplete="new-password" | |
303 | id="target_mutual_password" | |
304 | name="target_mutual_password" | |
305 | formControlName="mutual_password" /> | |
306 | ||
9f95a23c | 307 | <span class="input-group-append"> |
eafe8130 | 308 | <button type="button" |
9f95a23c | 309 | class="btn btn-light" |
eafe8130 TL |
310 | cdPasswordButton="target_mutual_password"> |
311 | </button> | |
312 | <button type="button" | |
9f95a23c | 313 | class="btn btn-light" |
eafe8130 TL |
314 | cdCopy2ClipboardButton="target_mutual_password"> |
315 | </button> | |
316 | </span> | |
317 | </div> | |
318 | ||
9f95a23c | 319 | <span class="invalid-feedback" |
eafe8130 TL |
320 | *ngIf="targetForm.showError('mutual_password', formDir, 'required')" |
321 | i18n>This field is required.</span> | |
322 | ||
9f95a23c | 323 | <span class="invalid-feedback" |
eafe8130 TL |
324 | *ngIf="targetForm.showError('mutual_password', formDir, 'pattern')" |
325 | i18n>Passwords must have a length of 12 to 16 characters | |
326 | and can only contain letters, '@', '-', '_' or '/'.</span> | |
327 | </div> | |
328 | </div> | |
329 | ||
330 | </div> | |
331 | ||
11fdf7f2 | 332 | <!-- Initiators --> |
9f95a23c | 333 | <div class="form-group row" |
11fdf7f2 | 334 | *ngIf="targetForm.getValue('acl_enabled')"> |
9f95a23c | 335 | <label class="cd-col-form-label" |
11fdf7f2 TL |
336 | for="initiators" |
337 | i18n>Initiators</label> | |
9f95a23c | 338 | <div class="cd-col-form-input" |
11fdf7f2 | 339 | formArrayName="initiators"> |
9f95a23c | 340 | <div class="card mb-2" |
11fdf7f2 TL |
341 | *ngFor="let initiator of initiators.controls; let ii = index" |
342 | [formGroupName]="ii"> | |
9f95a23c | 343 | <div class="card-header"> |
11fdf7f2 TL |
344 | <ng-container i18n>Initiator</ng-container>: {{ initiator.getValue('client_iqn') }} |
345 | <button type="button" | |
346 | class="close" | |
347 | (click)="removeInitiator(ii)"> | |
9f95a23c | 348 | <i [ngClass]="[icons.destroy]"></i> |
11fdf7f2 TL |
349 | </button> |
350 | </div> | |
9f95a23c | 351 | <div class="card-body"> |
11fdf7f2 | 352 | <!-- Initiator: Name --> |
9f95a23c TL |
353 | <div class="form-group row"> |
354 | <label class="cd-col-form-label required" | |
355 | for="client_iqn" | |
356 | i18n>Client IQN</label> | |
357 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
358 | <input class="form-control" |
359 | type="text" | |
360 | formControlName="client_iqn" | |
92f5a8d4 | 361 | cdTrim |
11fdf7f2 TL |
362 | (blur)="updatedInitiatorSelector()"> |
363 | ||
9f95a23c | 364 | <span class="invalid-feedback" |
11fdf7f2 TL |
365 | *ngIf="initiator.showError('client_iqn', formDir, 'notUnique')" |
366 | i18n>Initiator IQN needs to be unique.</span> | |
367 | ||
9f95a23c | 368 | <span class="invalid-feedback" |
11fdf7f2 TL |
369 | *ngIf="initiator.showError('client_iqn', formDir, 'required')" |
370 | i18n>This field is required.</span> | |
371 | ||
9f95a23c | 372 | <span class="invalid-feedback" |
11fdf7f2 TL |
373 | *ngIf="initiator.showError('client_iqn', formDir, 'pattern')" |
374 | i18n>IQN has wrong pattern.</span> | |
375 | </div> | |
376 | </div> | |
377 | ||
378 | <ng-container formGroupName="auth"> | |
379 | <!-- Initiator: User --> | |
9f95a23c TL |
380 | <div class="form-group row"> |
381 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
382 | for="user" |
383 | i18n>User</label> | |
9f95a23c | 384 | <div class="cd-col-form-input"> |
81eedcae | 385 | <input [id]="'user' + ii" |
11fdf7f2 TL |
386 | class="form-control" |
387 | formControlName="user" | |
388 | type="text"> | |
9f95a23c | 389 | <span class="invalid-feedback" |
11fdf7f2 TL |
390 | *ngIf="initiator.showError('user', formDir, 'required')" |
391 | i18n>This field is required.</span> | |
392 | ||
9f95a23c | 393 | <span class="invalid-feedback" |
11fdf7f2 TL |
394 | *ngIf="initiator.showError('user', formDir, 'pattern')" |
395 | i18n>Usernames must have a length of 8 to 64 characters and | |
396 | can only contain letters, '.', '@', '-', '_' or ':'.</span> | |
397 | </div> | |
398 | </div> | |
399 | ||
400 | <!-- Initiator: Password --> | |
9f95a23c TL |
401 | <div class="form-group row"> |
402 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
403 | for="password" |
404 | i18n>Password</label> | |
9f95a23c | 405 | <div class="cd-col-form-input"> |
11fdf7f2 | 406 | <div class="input-group"> |
81eedcae | 407 | <input [id]="'password' + ii" |
11fdf7f2 TL |
408 | class="form-control" |
409 | formControlName="password" | |
410 | type="password"> | |
411 | ||
9f95a23c | 412 | <span class="input-group-append"> |
11fdf7f2 | 413 | <button type="button" |
9f95a23c | 414 | class="btn btn-light" |
81eedcae | 415 | [cdPasswordButton]="'password' + ii"> |
11fdf7f2 TL |
416 | </button> |
417 | <button type="button" | |
9f95a23c | 418 | class="btn btn-light" |
81eedcae | 419 | [cdCopy2ClipboardButton]="'password' + ii"> |
11fdf7f2 TL |
420 | </button> |
421 | </span> | |
422 | </div> | |
9f95a23c | 423 | <span class="invalid-feedback" |
11fdf7f2 TL |
424 | *ngIf="initiator.showError('password', formDir, 'required')" |
425 | i18n>This field is required.</span> | |
426 | ||
9f95a23c | 427 | <span class="invalid-feedback" |
11fdf7f2 TL |
428 | *ngIf="initiator.showError('password', formDir, 'pattern')" |
429 | i18n>Passwords must have a length of 12 to 16 characters | |
430 | and can only contain letters, '@', '-', '_' or '/'.</span> | |
431 | </div> | |
432 | </div> | |
433 | ||
434 | ||
435 | <!-- Initiator: mutual_user --> | |
9f95a23c TL |
436 | <div class="form-group row"> |
437 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
438 | for="mutual_user"> |
439 | <ng-container i18n>Mutual User</ng-container> | |
440 | </label> | |
9f95a23c | 441 | <div class="cd-col-form-input"> |
81eedcae | 442 | <input [id]="'mutual_user' + ii" |
11fdf7f2 TL |
443 | class="form-control" |
444 | formControlName="mutual_user" | |
445 | type="text"> | |
446 | ||
9f95a23c | 447 | <span class="invalid-feedback" |
11fdf7f2 TL |
448 | *ngIf="initiator.showError('mutual_user', formDir, 'required')" |
449 | i18n>This field is required.</span> | |
450 | ||
9f95a23c | 451 | <span class="invalid-feedback" |
11fdf7f2 TL |
452 | *ngIf="initiator.showError('mutual_user', formDir, 'pattern')" |
453 | i18n>Usernames must have a length of 8 to 64 characters and | |
454 | can only contain letters, '.', '@', '-', '_' or ':'.</span> | |
455 | </div> | |
456 | </div> | |
457 | ||
458 | <!-- Initiator: mutual_password --> | |
9f95a23c TL |
459 | <div class="form-group row"> |
460 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
461 | for="mutual_password" |
462 | i18n>Mutual Password</label> | |
9f95a23c | 463 | <div class="cd-col-form-input"> |
11fdf7f2 | 464 | <div class="input-group"> |
81eedcae | 465 | <input [id]="'mutual_password' + ii" |
11fdf7f2 TL |
466 | class="form-control" |
467 | formControlName="mutual_password" | |
468 | type="password"> | |
469 | ||
9f95a23c | 470 | <span class="input-group-append"> |
11fdf7f2 | 471 | <button type="button" |
9f95a23c | 472 | class="btn btn-light" |
81eedcae | 473 | [cdPasswordButton]="'mutual_password' + ii"> |
11fdf7f2 TL |
474 | </button> |
475 | <button type="button" | |
9f95a23c | 476 | class="btn btn-light" |
81eedcae | 477 | [cdCopy2ClipboardButton]="'mutual_password' + ii"> |
11fdf7f2 TL |
478 | </button> |
479 | </span> | |
480 | </div> | |
9f95a23c | 481 | <span class="invalid-feedback" |
11fdf7f2 TL |
482 | *ngIf="initiator.showError('mutual_password', formDir, 'required')" |
483 | i18n>This field is required.</span> | |
484 | ||
9f95a23c | 485 | <span class="invalid-feedback" |
11fdf7f2 TL |
486 | *ngIf="initiator.showError('mutual_password', formDir, 'pattern')" |
487 | i18n>Passwords must have a length of 12 to 16 characters and | |
488 | can only contain letters, '@', '-', '_' or '/'.</span> | |
489 | </div> | |
490 | </div> | |
491 | </ng-container> | |
492 | ||
493 | <!-- Initiator: Images --> | |
9f95a23c TL |
494 | <div class="form-group row"> |
495 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
496 | for="luns" |
497 | i18n>Images</label> | |
9f95a23c | 498 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
499 | <ng-container *ngFor="let image of initiator.getValue('luns'); let li = index"> |
500 | <div class="input-group cd-mb"> | |
9f95a23c | 501 | <input class="cd-form-control" |
11fdf7f2 TL |
502 | type="text" |
503 | [value]="image" | |
504 | disabled /> | |
9f95a23c TL |
505 | <span class="input-group-append"> |
506 | <button class="btn btn-light" | |
11fdf7f2 TL |
507 | type="button" |
508 | (click)="removeInitiatorImage(initiator, li, ii, image)"> | |
9f95a23c | 509 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
510 | aria-hidden="true"></i> |
511 | </button> | |
512 | </span> | |
513 | </div> | |
514 | </ng-container> | |
515 | ||
516 | <span *ngIf="initiator.getValue('cdIsInGroup')" | |
517 | i18n>Initiator belongs to a group. Images will be configure in the group.</span> | |
518 | ||
519 | <div class="row" | |
520 | *ngIf="!initiator.getValue('cdIsInGroup')"> | |
521 | <div class="col-md-12"> | |
522 | <cd-select [data]="initiator.getValue('luns')" | |
523 | [options]="imagesInitiatorSelections[ii]" | |
524 | [messages]="messages.initiatorImage" | |
9f95a23c TL |
525 | elemClass="btn btn-light float-right"> |
526 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
527 | <ng-container i18n>Add image</ng-container> |
528 | </cd-select> | |
529 | </div> | |
530 | </div> | |
531 | </div> | |
532 | </div> | |
533 | </div> | |
534 | </div> | |
535 | ||
536 | <div class="row"> | |
537 | <div class="col-md-12"> | |
9f95a23c | 538 | <span class="form-text text-muted" |
11fdf7f2 TL |
539 | *ngIf="initiators.controls.length === 0" |
540 | i18n>No items added.</span> | |
541 | ||
542 | <button (click)="addInitiator(); false" | |
9f95a23c TL |
543 | class="btn btn-light float-right"> |
544 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
545 | <ng-container i18n>Add initiator</ng-container> |
546 | </button> | |
547 | </div> | |
548 | </div> | |
549 | ||
550 | <hr /> | |
551 | </div> | |
552 | </div> | |
553 | ||
554 | <!-- Groups --> | |
9f95a23c TL |
555 | <div class="form-group row" |
556 | *ngIf="targetForm.getValue('acl_enabled')"> | |
557 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
558 | for="initiators" |
559 | i18n>Groups</label> | |
9f95a23c | 560 | <div class="cd-col-form-input" |
11fdf7f2 | 561 | formArrayName="groups"> |
9f95a23c | 562 | <div class="card mb-2" |
11fdf7f2 TL |
563 | *ngFor="let group of groups.controls; let gi = index" |
564 | [formGroupName]="gi"> | |
9f95a23c | 565 | <div class="card-header"> |
11fdf7f2 TL |
566 | <ng-container i18n>Group</ng-container>: {{ group.getValue('group_id') }} |
567 | <button type="button" | |
568 | class="close" | |
569 | (click)="groups.removeAt(gi)"> | |
9f95a23c | 570 | <i [ngClass]="[icons.destroy]"></i> |
11fdf7f2 TL |
571 | </button> |
572 | </div> | |
9f95a23c | 573 | <div class="card-body"> |
11fdf7f2 | 574 | <!-- Group: group_id --> |
9f95a23c TL |
575 | <div class="form-group row"> |
576 | <label class="cd-col-form-label required" | |
577 | for="group_id" | |
578 | i18n>Name</label> | |
579 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
580 | <input class="form-control" |
581 | type="text" | |
582 | formControlName="group_id"> | |
583 | </div> | |
584 | </div> | |
585 | ||
586 | <!-- Group: members --> | |
9f95a23c TL |
587 | <div class="form-group row"> |
588 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
589 | for="members"> |
590 | <ng-container i18n>Initiators</ng-container> | |
591 | </label> | |
9f95a23c | 592 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
593 | <ng-container *ngFor="let member of group.getValue('members'); let i = index"> |
594 | <div class="input-group cd-mb"> | |
9f95a23c | 595 | <input class="cd-form-control" |
11fdf7f2 TL |
596 | type="text" |
597 | [value]="member" | |
598 | disabled /> | |
9f95a23c TL |
599 | <span class="input-group-append"> |
600 | <button class="btn btn-light" | |
11fdf7f2 TL |
601 | type="button" |
602 | (click)="removeGroupInitiator(group, i, gi)"> | |
9f95a23c | 603 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
604 | aria-hidden="true"></i> |
605 | </button> | |
606 | </span> | |
607 | </div> | |
608 | </ng-container> | |
609 | ||
610 | <div class="row"> | |
611 | <div class="col-md-12"> | |
612 | <cd-select [data]="group.getValue('members')" | |
613 | [options]="groupMembersSelections[gi]" | |
614 | [messages]="messages.groupInitiator" | |
615 | (selection)="onGroupMemberSelection($event)" | |
9f95a23c TL |
616 | elemClass="btn btn-light float-right"> |
617 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
618 | <ng-container i18n>Add initiator</ng-container> |
619 | </cd-select> | |
620 | </div> | |
621 | </div> | |
622 | ||
623 | <hr /> | |
624 | </div> | |
625 | </div> | |
626 | ||
627 | <!-- Group: disks --> | |
9f95a23c TL |
628 | <div class="form-group row"> |
629 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
630 | for="disks"> |
631 | <ng-container i18n>Images</ng-container> | |
632 | </label> | |
9f95a23c | 633 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
634 | <ng-container *ngFor="let disk of group.getValue('disks'); let i = index"> |
635 | <div class="input-group cd-mb"> | |
9f95a23c | 636 | <input class="cd-form-control" |
11fdf7f2 TL |
637 | type="text" |
638 | [value]="disk" | |
639 | disabled /> | |
9f95a23c TL |
640 | <span class="input-group-append"> |
641 | <button class="btn btn-light" | |
11fdf7f2 TL |
642 | type="button" |
643 | (click)="removeGroupDisk(group, i, gi)"> | |
9f95a23c | 644 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
645 | aria-hidden="true"></i> |
646 | </button> | |
647 | </span> | |
648 | </div> | |
649 | </ng-container> | |
650 | ||
651 | <div class="row"> | |
652 | <div class="col-md-12"> | |
653 | <cd-select [data]="group.getValue('disks')" | |
654 | [options]="groupDiskSelections[gi]" | |
655 | [messages]="messages.initiatorImage" | |
9f95a23c TL |
656 | elemClass="btn btn-light float-right"> |
657 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
658 | <ng-container i18n>Add image</ng-container> |
659 | </cd-select> | |
660 | </div> | |
661 | </div> | |
662 | ||
663 | <hr /> | |
664 | </div> | |
665 | </div> | |
666 | </div> | |
667 | </div> | |
668 | ||
669 | <div class="row"> | |
670 | <div class="col-md-12"> | |
9f95a23c | 671 | <span class="form-text text-muted" |
11fdf7f2 TL |
672 | *ngIf="groups.controls.length === 0" |
673 | i18n>No items added.</span> | |
674 | ||
675 | <button (click)="addGroup(); false" | |
9f95a23c TL |
676 | class="btn btn-light float-right"> |
677 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
678 | <ng-container i18n>Add group</ng-container> |
679 | </button> | |
680 | </div> | |
681 | </div> | |
682 | </div> | |
683 | </div> | |
684 | ||
685 | </div> | |
9f95a23c | 686 | <div class="card-footer"> |
11fdf7f2 | 687 | <div class="button-group text-right"> |
9f95a23c TL |
688 | <cd-submit-button (submitAction)="submit()" |
689 | i18n="form action button|Example: Create Pool@@formActionButton" | |
690 | [form]="formDir">{{ action | titlecase }} {{ resource | upperFirst }}</cd-submit-button> | |
11fdf7f2 TL |
691 | <cd-back-button></cd-back-button> |
692 | </div> | |
693 | </div> | |
694 | </div> | |
695 | </form> | |
696 | </div> |