]>
Commit | Line | Data |
---|---|---|
f67539c2 TL |
1 | <div class="cd-col-form" |
2 | *cdFormLoading="loading"> | |
11fdf7f2 | 3 | <form name="targetForm" |
11fdf7f2 TL |
4 | #formDir="ngForm" |
5 | [formGroup]="targetForm" | |
f67539c2 | 6 | novalidate> |
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" | |
f6b5b4d7 | 216 | autocomplete="off" |
eafe8130 TL |
217 | id="target_user" |
218 | name="target_user" | |
219 | formControlName="user" /> | |
220 | ||
9f95a23c | 221 | <span class="invalid-feedback" |
eafe8130 TL |
222 | *ngIf="targetForm.showError('user', formDir, 'required')" |
223 | i18n>This field is required.</span> | |
224 | ||
9f95a23c | 225 | <span class="invalid-feedback" |
eafe8130 | 226 | *ngIf="targetForm.showError('user', formDir, 'pattern')" |
1911f103 TL |
227 | i18n>User names must have a length of 8 to 64 characters and can contain |
228 | alphanumeric characters, '.', '@', '-', '_' or ':'.</span> | |
eafe8130 TL |
229 | </div> |
230 | </div> | |
231 | ||
232 | <!-- Target password --> | |
9f95a23c TL |
233 | <div class="form-group row"> |
234 | <label class="cd-col-form-label" | |
eafe8130 TL |
235 | for="target_password"> |
236 | <ng-container i18n>Password</ng-container> | |
237 | </label> | |
9f95a23c | 238 | <div class="cd-col-form-input"> |
eafe8130 TL |
239 | <div class="input-group"> |
240 | <input class="form-control" | |
241 | type="password" | |
242 | autocomplete="new-password" | |
243 | id="target_password" | |
244 | name="target_password" | |
245 | formControlName="password" /> | |
9f95a23c | 246 | <span class="input-group-append"> |
eafe8130 | 247 | <button type="button" |
9f95a23c | 248 | class="btn btn-light" |
eafe8130 TL |
249 | cdPasswordButton="target_password"> |
250 | </button> | |
f67539c2 TL |
251 | <cd-copy-2-clipboard-button source="target_password"> |
252 | </cd-copy-2-clipboard-button> | |
eafe8130 TL |
253 | </span> |
254 | </div> | |
255 | ||
9f95a23c | 256 | <span class="invalid-feedback" |
eafe8130 TL |
257 | *ngIf="targetForm.showError('password', formDir, 'required')" |
258 | i18n>This field is required.</span> | |
259 | ||
9f95a23c | 260 | <span class="invalid-feedback" |
eafe8130 | 261 | *ngIf="targetForm.showError('password', formDir, 'pattern')" |
1911f103 TL |
262 | i18n>Passwords must have a length of 12 to 16 characters and can contain |
263 | alphanumeric characters, '@', '-', '_' or '/'.</span> | |
eafe8130 TL |
264 | </div> |
265 | </div> | |
266 | ||
267 | <!-- Target mutual_user --> | |
9f95a23c TL |
268 | <div class="form-group row"> |
269 | <label class="cd-col-form-label" | |
eafe8130 TL |
270 | for="target_mutual_user"> |
271 | <ng-container i18n>Mutual User</ng-container> | |
272 | </label> | |
9f95a23c | 273 | <div class="cd-col-form-input"> |
eafe8130 TL |
274 | <input class="form-control" |
275 | type="text" | |
f6b5b4d7 | 276 | autocomplete="off" |
eafe8130 TL |
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 | 286 | *ngIf="targetForm.showError('mutual_user', formDir, 'pattern')" |
1911f103 TL |
287 | i18n>User names must have a length of 8 to 64 characters and can contain |
288 | alphanumeric characters, '.', '@', '-', '_' or ':'.</span> | |
eafe8130 TL |
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> | |
f67539c2 TL |
312 | <cd-copy-2-clipboard-button source="target_mutual_password"> |
313 | </cd-copy-2-clipboard-button> | |
eafe8130 TL |
314 | </span> |
315 | </div> | |
316 | ||
9f95a23c | 317 | <span class="invalid-feedback" |
eafe8130 TL |
318 | *ngIf="targetForm.showError('mutual_password', formDir, 'required')" |
319 | i18n>This field is required.</span> | |
320 | ||
9f95a23c | 321 | <span class="invalid-feedback" |
eafe8130 | 322 | *ngIf="targetForm.showError('mutual_password', formDir, 'pattern')" |
1911f103 TL |
323 | i18n>Passwords must have a length of 12 to 16 characters and can contain |
324 | alphanumeric characters, '@', '-', '_' or '/'.</span> | |
eafe8130 TL |
325 | </div> |
326 | </div> | |
327 | ||
328 | </div> | |
329 | ||
11fdf7f2 | 330 | <!-- Initiators --> |
9f95a23c | 331 | <div class="form-group row" |
11fdf7f2 | 332 | *ngIf="targetForm.getValue('acl_enabled')"> |
9f95a23c | 333 | <label class="cd-col-form-label" |
11fdf7f2 TL |
334 | for="initiators" |
335 | i18n>Initiators</label> | |
9f95a23c | 336 | <div class="cd-col-form-input" |
11fdf7f2 | 337 | formArrayName="initiators"> |
9f95a23c | 338 | <div class="card mb-2" |
11fdf7f2 TL |
339 | *ngFor="let initiator of initiators.controls; let ii = index" |
340 | [formGroupName]="ii"> | |
9f95a23c | 341 | <div class="card-header"> |
11fdf7f2 TL |
342 | <ng-container i18n>Initiator</ng-container>: {{ initiator.getValue('client_iqn') }} |
343 | <button type="button" | |
344 | class="close" | |
345 | (click)="removeInitiator(ii)"> | |
9f95a23c | 346 | <i [ngClass]="[icons.destroy]"></i> |
11fdf7f2 TL |
347 | </button> |
348 | </div> | |
9f95a23c | 349 | <div class="card-body"> |
11fdf7f2 | 350 | <!-- Initiator: Name --> |
9f95a23c TL |
351 | <div class="form-group row"> |
352 | <label class="cd-col-form-label required" | |
353 | for="client_iqn" | |
354 | i18n>Client IQN</label> | |
355 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
356 | <input class="form-control" |
357 | type="text" | |
358 | formControlName="client_iqn" | |
92f5a8d4 | 359 | cdTrim |
11fdf7f2 TL |
360 | (blur)="updatedInitiatorSelector()"> |
361 | ||
9f95a23c | 362 | <span class="invalid-feedback" |
11fdf7f2 TL |
363 | *ngIf="initiator.showError('client_iqn', formDir, 'notUnique')" |
364 | i18n>Initiator IQN needs to be unique.</span> | |
365 | ||
9f95a23c | 366 | <span class="invalid-feedback" |
11fdf7f2 TL |
367 | *ngIf="initiator.showError('client_iqn', formDir, 'required')" |
368 | i18n>This field is required.</span> | |
369 | ||
9f95a23c | 370 | <span class="invalid-feedback" |
11fdf7f2 TL |
371 | *ngIf="initiator.showError('client_iqn', formDir, 'pattern')" |
372 | i18n>IQN has wrong pattern.</span> | |
373 | </div> | |
374 | </div> | |
375 | ||
376 | <ng-container formGroupName="auth"> | |
377 | <!-- Initiator: User --> | |
9f95a23c TL |
378 | <div class="form-group row"> |
379 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
380 | for="user" |
381 | i18n>User</label> | |
9f95a23c | 382 | <div class="cd-col-form-input"> |
81eedcae | 383 | <input [id]="'user' + ii" |
11fdf7f2 TL |
384 | class="form-control" |
385 | formControlName="user" | |
f6b5b4d7 | 386 | autocomplete="off" |
11fdf7f2 | 387 | type="text"> |
9f95a23c | 388 | <span class="invalid-feedback" |
11fdf7f2 TL |
389 | *ngIf="initiator.showError('user', formDir, 'required')" |
390 | i18n>This field is required.</span> | |
391 | ||
9f95a23c | 392 | <span class="invalid-feedback" |
11fdf7f2 | 393 | *ngIf="initiator.showError('user', formDir, 'pattern')" |
1911f103 TL |
394 | i18n>User names must have a length of 8 to 64 characters and can contain |
395 | alphanumeric characters, '.', '@', '-', '_' or ':'.</span> | |
11fdf7f2 TL |
396 | </div> |
397 | </div> | |
398 | ||
399 | <!-- Initiator: Password --> | |
9f95a23c TL |
400 | <div class="form-group row"> |
401 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
402 | for="password" |
403 | i18n>Password</label> | |
9f95a23c | 404 | <div class="cd-col-form-input"> |
11fdf7f2 | 405 | <div class="input-group"> |
81eedcae | 406 | <input [id]="'password' + ii" |
11fdf7f2 TL |
407 | class="form-control" |
408 | formControlName="password" | |
f6b5b4d7 | 409 | autocomplete="new-password" |
11fdf7f2 TL |
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 | 416 | </button> |
f67539c2 TL |
417 | <cd-copy-2-clipboard-button [source]="'password' + ii"> |
418 | </cd-copy-2-clipboard-button> | |
11fdf7f2 TL |
419 | </span> |
420 | </div> | |
9f95a23c | 421 | <span class="invalid-feedback" |
11fdf7f2 TL |
422 | *ngIf="initiator.showError('password', formDir, 'required')" |
423 | i18n>This field is required.</span> | |
424 | ||
9f95a23c | 425 | <span class="invalid-feedback" |
11fdf7f2 | 426 | *ngIf="initiator.showError('password', formDir, 'pattern')" |
1911f103 TL |
427 | i18n>Passwords must have a length of 12 to 16 characters and can contain |
428 | alphanumeric characters, '@', '-', '_' or '/'.</span> | |
11fdf7f2 TL |
429 | </div> |
430 | </div> | |
431 | ||
432 | ||
433 | <!-- Initiator: mutual_user --> | |
9f95a23c TL |
434 | <div class="form-group row"> |
435 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
436 | for="mutual_user"> |
437 | <ng-container i18n>Mutual User</ng-container> | |
438 | </label> | |
9f95a23c | 439 | <div class="cd-col-form-input"> |
81eedcae | 440 | <input [id]="'mutual_user' + ii" |
11fdf7f2 TL |
441 | class="form-control" |
442 | formControlName="mutual_user" | |
f6b5b4d7 | 443 | autocomplete="off" |
11fdf7f2 TL |
444 | type="text"> |
445 | ||
9f95a23c | 446 | <span class="invalid-feedback" |
11fdf7f2 TL |
447 | *ngIf="initiator.showError('mutual_user', formDir, 'required')" |
448 | i18n>This field is required.</span> | |
449 | ||
9f95a23c | 450 | <span class="invalid-feedback" |
11fdf7f2 | 451 | *ngIf="initiator.showError('mutual_user', formDir, 'pattern')" |
1911f103 TL |
452 | i18n>User names must have a length of 8 to 64 characters and can contain |
453 | alphanumeric characters, '.', '@', '-', '_' or ':'.</span> | |
11fdf7f2 TL |
454 | </div> |
455 | </div> | |
456 | ||
457 | <!-- Initiator: mutual_password --> | |
9f95a23c TL |
458 | <div class="form-group row"> |
459 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
460 | for="mutual_password" |
461 | i18n>Mutual Password</label> | |
9f95a23c | 462 | <div class="cd-col-form-input"> |
11fdf7f2 | 463 | <div class="input-group"> |
81eedcae | 464 | <input [id]="'mutual_password' + ii" |
11fdf7f2 TL |
465 | class="form-control" |
466 | formControlName="mutual_password" | |
f6b5b4d7 | 467 | autocomplete="new-password" |
11fdf7f2 TL |
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 | 474 | </button> |
f67539c2 TL |
475 | <cd-copy-2-clipboard-button [source]="'mutual_password' + ii"> |
476 | </cd-copy-2-clipboard-button> | |
11fdf7f2 TL |
477 | </span> |
478 | </div> | |
9f95a23c | 479 | <span class="invalid-feedback" |
11fdf7f2 TL |
480 | *ngIf="initiator.showError('mutual_password', formDir, 'required')" |
481 | i18n>This field is required.</span> | |
482 | ||
9f95a23c | 483 | <span class="invalid-feedback" |
11fdf7f2 | 484 | *ngIf="initiator.showError('mutual_password', formDir, 'pattern')" |
1911f103 TL |
485 | i18n>Passwords must have a length of 12 to 16 characters and can contain |
486 | alphanumeric characters, '@', '-', '_' or '/'.</span> | |
11fdf7f2 TL |
487 | </div> |
488 | </div> | |
489 | </ng-container> | |
490 | ||
491 | <!-- Initiator: Images --> | |
9f95a23c TL |
492 | <div class="form-group row"> |
493 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
494 | for="luns" |
495 | i18n>Images</label> | |
9f95a23c | 496 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
497 | <ng-container *ngFor="let image of initiator.getValue('luns'); let li = index"> |
498 | <div class="input-group cd-mb"> | |
9f95a23c | 499 | <input class="cd-form-control" |
11fdf7f2 TL |
500 | type="text" |
501 | [value]="image" | |
502 | disabled /> | |
9f95a23c TL |
503 | <span class="input-group-append"> |
504 | <button class="btn btn-light" | |
11fdf7f2 TL |
505 | type="button" |
506 | (click)="removeInitiatorImage(initiator, li, ii, image)"> | |
9f95a23c | 507 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
508 | aria-hidden="true"></i> |
509 | </button> | |
510 | </span> | |
511 | </div> | |
512 | </ng-container> | |
513 | ||
514 | <span *ngIf="initiator.getValue('cdIsInGroup')" | |
515 | i18n>Initiator belongs to a group. Images will be configure in the group.</span> | |
516 | ||
517 | <div class="row" | |
518 | *ngIf="!initiator.getValue('cdIsInGroup')"> | |
519 | <div class="col-md-12"> | |
520 | <cd-select [data]="initiator.getValue('luns')" | |
521 | [options]="imagesInitiatorSelections[ii]" | |
522 | [messages]="messages.initiatorImage" | |
9f95a23c TL |
523 | elemClass="btn btn-light float-right"> |
524 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
525 | <ng-container i18n>Add image</ng-container> |
526 | </cd-select> | |
527 | </div> | |
528 | </div> | |
529 | </div> | |
530 | </div> | |
531 | </div> | |
532 | </div> | |
533 | ||
534 | <div class="row"> | |
535 | <div class="col-md-12"> | |
9f95a23c | 536 | <span class="form-text text-muted" |
11fdf7f2 TL |
537 | *ngIf="initiators.controls.length === 0" |
538 | i18n>No items added.</span> | |
539 | ||
540 | <button (click)="addInitiator(); false" | |
9f95a23c TL |
541 | class="btn btn-light float-right"> |
542 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
543 | <ng-container i18n>Add initiator</ng-container> |
544 | </button> | |
545 | </div> | |
546 | </div> | |
547 | ||
548 | <hr /> | |
549 | </div> | |
550 | </div> | |
551 | ||
552 | <!-- Groups --> | |
9f95a23c TL |
553 | <div class="form-group row" |
554 | *ngIf="targetForm.getValue('acl_enabled')"> | |
555 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
556 | for="initiators" |
557 | i18n>Groups</label> | |
9f95a23c | 558 | <div class="cd-col-form-input" |
11fdf7f2 | 559 | formArrayName="groups"> |
9f95a23c | 560 | <div class="card mb-2" |
11fdf7f2 TL |
561 | *ngFor="let group of groups.controls; let gi = index" |
562 | [formGroupName]="gi"> | |
9f95a23c | 563 | <div class="card-header"> |
11fdf7f2 TL |
564 | <ng-container i18n>Group</ng-container>: {{ group.getValue('group_id') }} |
565 | <button type="button" | |
566 | class="close" | |
f67539c2 | 567 | (click)="removeGroup(gi)"> |
9f95a23c | 568 | <i [ngClass]="[icons.destroy]"></i> |
11fdf7f2 TL |
569 | </button> |
570 | </div> | |
9f95a23c | 571 | <div class="card-body"> |
11fdf7f2 | 572 | <!-- Group: group_id --> |
9f95a23c TL |
573 | <div class="form-group row"> |
574 | <label class="cd-col-form-label required" | |
575 | for="group_id" | |
576 | i18n>Name</label> | |
577 | <div class="cd-col-form-input"> | |
11fdf7f2 TL |
578 | <input class="form-control" |
579 | type="text" | |
580 | formControlName="group_id"> | |
581 | </div> | |
582 | </div> | |
583 | ||
584 | <!-- Group: members --> | |
9f95a23c TL |
585 | <div class="form-group row"> |
586 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
587 | for="members"> |
588 | <ng-container i18n>Initiators</ng-container> | |
589 | </label> | |
9f95a23c | 590 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
591 | <ng-container *ngFor="let member of group.getValue('members'); let i = index"> |
592 | <div class="input-group cd-mb"> | |
9f95a23c | 593 | <input class="cd-form-control" |
11fdf7f2 TL |
594 | type="text" |
595 | [value]="member" | |
596 | disabled /> | |
9f95a23c TL |
597 | <span class="input-group-append"> |
598 | <button class="btn btn-light" | |
11fdf7f2 TL |
599 | type="button" |
600 | (click)="removeGroupInitiator(group, i, gi)"> | |
9f95a23c | 601 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
602 | aria-hidden="true"></i> |
603 | </button> | |
604 | </span> | |
605 | </div> | |
606 | </ng-container> | |
607 | ||
608 | <div class="row"> | |
609 | <div class="col-md-12"> | |
610 | <cd-select [data]="group.getValue('members')" | |
611 | [options]="groupMembersSelections[gi]" | |
612 | [messages]="messages.groupInitiator" | |
f67539c2 | 613 | (selection)="onGroupMemberSelection($event, gi)" |
9f95a23c TL |
614 | elemClass="btn btn-light float-right"> |
615 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
616 | <ng-container i18n>Add initiator</ng-container> |
617 | </cd-select> | |
618 | </div> | |
619 | </div> | |
620 | ||
621 | <hr /> | |
622 | </div> | |
623 | </div> | |
624 | ||
625 | <!-- Group: disks --> | |
9f95a23c TL |
626 | <div class="form-group row"> |
627 | <label class="cd-col-form-label" | |
11fdf7f2 TL |
628 | for="disks"> |
629 | <ng-container i18n>Images</ng-container> | |
630 | </label> | |
9f95a23c | 631 | <div class="cd-col-form-input"> |
11fdf7f2 TL |
632 | <ng-container *ngFor="let disk of group.getValue('disks'); let i = index"> |
633 | <div class="input-group cd-mb"> | |
9f95a23c | 634 | <input class="cd-form-control" |
11fdf7f2 TL |
635 | type="text" |
636 | [value]="disk" | |
637 | disabled /> | |
9f95a23c TL |
638 | <span class="input-group-append"> |
639 | <button class="btn btn-light" | |
11fdf7f2 TL |
640 | type="button" |
641 | (click)="removeGroupDisk(group, i, gi)"> | |
9f95a23c | 642 | <i [ngClass]="[icons.destroy]" |
11fdf7f2 TL |
643 | aria-hidden="true"></i> |
644 | </button> | |
645 | </span> | |
646 | </div> | |
647 | </ng-container> | |
648 | ||
649 | <div class="row"> | |
650 | <div class="col-md-12"> | |
651 | <cd-select [data]="group.getValue('disks')" | |
652 | [options]="groupDiskSelections[gi]" | |
653 | [messages]="messages.initiatorImage" | |
9f95a23c TL |
654 | elemClass="btn btn-light float-right"> |
655 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
656 | <ng-container i18n>Add image</ng-container> |
657 | </cd-select> | |
658 | </div> | |
659 | </div> | |
660 | ||
661 | <hr /> | |
662 | </div> | |
663 | </div> | |
664 | </div> | |
665 | </div> | |
666 | ||
667 | <div class="row"> | |
668 | <div class="col-md-12"> | |
9f95a23c | 669 | <span class="form-text text-muted" |
11fdf7f2 TL |
670 | *ngIf="groups.controls.length === 0" |
671 | i18n>No items added.</span> | |
672 | ||
673 | <button (click)="addGroup(); false" | |
9f95a23c TL |
674 | class="btn btn-light float-right"> |
675 | <i [ngClass]="[icons.add]"></i> | |
11fdf7f2 TL |
676 | <ng-container i18n>Add group</ng-container> |
677 | </button> | |
678 | </div> | |
679 | </div> | |
680 | </div> | |
681 | </div> | |
682 | ||
683 | </div> | |
9f95a23c | 684 | <div class="card-footer"> |
f67539c2 TL |
685 | <cd-form-button-panel (submitActionEvent)="submit()" |
686 | [form]="targetForm" | |
687 | [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)" | |
688 | wrappingClass="text-right"></cd-form-button-panel> | |
11fdf7f2 TL |
689 | </div> |
690 | </div> | |
691 | </form> | |
692 | </div> |