]>
Commit | Line | Data |
---|---|---|
f67539c2 | 1 | <cd-modal [modalRef]="activeModal"> |
a4b75251 | 2 | <ng-container i18n="form title" |
9f95a23c TL |
3 | class="modal-title">{{ action | titlecase }} {{ resource | upperFirst }}</ng-container> |
4 | ||
5 | <ng-container class="modal-content"> | |
6 | <form #frm="ngForm" | |
7 | [formGroup]="form" | |
8 | novalidate> | |
9 | <div class="modal-body"> | |
10 | <div class="form-group row"> | |
11 | <label class="cd-col-form-label" | |
12 | for="name" | |
13 | i18n>Name</label> | |
14 | <div class="cd-col-form-input"> | |
15 | <input type="text" | |
16 | id="name" | |
17 | name="name" | |
18 | class="form-control" | |
19 | placeholder="Name..." | |
20 | formControlName="name" | |
21 | autofocus> | |
22 | <span class="invalid-feedback" | |
23 | *ngIf="form.showError('name', frm, 'required')" | |
24 | i18n>This field is required!</span> | |
25 | <span class="invalid-feedback" | |
26 | *ngIf="form.showError('name', frm, 'pattern')" | |
27 | i18n>The name can only consist of alphanumeric characters, dashes and underscores.</span> | |
28 | <span class="invalid-feedback" | |
29 | *ngIf="form.showError('name', frm, 'uniqueName')" | |
30 | i18n>The chosen erasure code profile name is already in use.</span> | |
31 | </div> | |
32 | </div> | |
33 | ||
34 | <div class="form-group row"> | |
35 | <label for="plugin" | |
36 | class="cd-col-form-label"> | |
37 | <span class="required" | |
38 | i18n>Plugin</span> | |
39 | <cd-helper [html]="tooltips.plugins[plugin].description"> | |
40 | </cd-helper> | |
41 | </label> | |
42 | <div class="cd-col-form-input"> | |
39ae355f | 43 | <select class="form-select" |
9f95a23c TL |
44 | id="plugin" |
45 | name="plugin" | |
46 | formControlName="plugin"> | |
47 | <option *ngIf="!plugins" | |
48 | ngValue="" | |
49 | i18n>Loading...</option> | |
50 | <option *ngFor="let plugin of plugins" | |
51 | [ngValue]="plugin"> | |
52 | {{ plugin }} | |
53 | </option> | |
54 | </select> | |
55 | <span class="invalid-feedback" | |
56 | *ngIf="form.showError('name', frm, 'required')" | |
57 | i18n>This field is required!</span> | |
58 | </div> | |
59 | </div> | |
60 | ||
61 | <div class="form-group row"> | |
62 | <label for="k" | |
63 | class="cd-col-form-label"> | |
e306af50 | 64 | <span class="required" |
9f95a23c TL |
65 | i18n>Data chunks (k)</span> |
66 | <cd-helper [html]="tooltips.k"> | |
67 | </cd-helper> | |
68 | </label> | |
69 | <div class="cd-col-form-input"> | |
70 | <input type="number" | |
71 | id="k" | |
72 | name="k" | |
73 | class="form-control" | |
74 | ng-model="$ctrl.erasureCodeProfile.k" | |
75 | placeholder="Data chunks..." | |
20effc67 TL |
76 | formControlName="k" |
77 | min="2"> | |
9f95a23c TL |
78 | <span class="invalid-feedback" |
79 | *ngIf="form.showError('k', frm, 'required')" | |
80 | i18n>This field is required!</span> | |
81 | <span class="invalid-feedback" | |
82 | *ngIf="form.showError('k', frm, 'min')" | |
83 | i18n>Must be equal to or greater than 2.</span> | |
e306af50 TL |
84 | <span class="invalid-feedback" |
85 | *ngIf="form.showError('k', frm, 'max')" | |
86 | i18n>Chunks (k+m) have exceeded the available OSDs of {{deviceCount}}.</span> | |
87 | <span class="invalid-feedback" | |
88 | *ngIf="form.showError('k', frm, 'unequal')" | |
89 | i18n>For an equal distribution k has to be a multiple of (k+m)/l.</span> | |
90 | <span class="invalid-feedback" | |
91 | *ngIf="form.showError('k', frm, 'kLowerM')" | |
92 | i18n>K has to be equal to or greater than m in order to recover data correctly through c.</span> | |
93 | <span *ngIf="plugin === 'lrc'" | |
94 | class="form-text text-muted" | |
95 | i18n>Distribution factor: {{lrcMultiK}}</span> | |
9f95a23c TL |
96 | </div> |
97 | </div> | |
98 | ||
99 | <div class="form-group row"> | |
100 | <label for="m" | |
101 | class="cd-col-form-label"> | |
e306af50 | 102 | <span class="required" |
9f95a23c TL |
103 | i18n>Coding chunks (m)</span> |
104 | <cd-helper [html]="tooltips.m"> | |
105 | </cd-helper> | |
106 | </label> | |
107 | <div class="cd-col-form-input"> | |
108 | <input type="number" | |
109 | id="m" | |
110 | name="m" | |
111 | class="form-control" | |
112 | placeholder="Coding chunks..." | |
20effc67 TL |
113 | formControlName="m" |
114 | min="1"> | |
9f95a23c TL |
115 | <span class="invalid-feedback" |
116 | *ngIf="form.showError('m', frm, 'required')" | |
117 | i18n>This field is required!</span> | |
118 | <span class="invalid-feedback" | |
119 | *ngIf="form.showError('m', frm, 'min')" | |
120 | i18n>Must be equal to or greater than 1.</span> | |
e306af50 TL |
121 | <span class="invalid-feedback" |
122 | *ngIf="form.showError('m', frm, 'max')" | |
123 | i18n>Chunks (k+m) have exceeded the available OSDs of {{deviceCount}}.</span> | |
9f95a23c TL |
124 | </div> |
125 | </div> | |
126 | ||
127 | <div class="form-group row" | |
128 | *ngIf="plugin === 'shec'"> | |
129 | <label for="c" | |
130 | class="cd-col-form-label"> | |
e306af50 TL |
131 | <span class="required" |
132 | i18n>Durability estimator (c)</span> | |
9f95a23c TL |
133 | <cd-helper [html]="tooltips.plugins.shec.c"> |
134 | </cd-helper> | |
135 | </label> | |
136 | <div class="cd-col-form-input"> | |
137 | <input type="number" | |
138 | id="c" | |
139 | name="c" | |
140 | class="form-control" | |
141 | placeholder="Coding chunks..." | |
20effc67 TL |
142 | formControlName="c" |
143 | min="1"> | |
9f95a23c TL |
144 | <span class="invalid-feedback" |
145 | *ngIf="form.showError('c', frm, 'min')" | |
146 | i18n>Must be equal to or greater than 1.</span> | |
e306af50 TL |
147 | <span class="invalid-feedback" |
148 | *ngIf="form.showError('c', frm, 'cGreaterM')" | |
149 | i18n>C has to be equal to or lower than m as m defines the amount of chunks that can be used.</span> | |
9f95a23c TL |
150 | </div> |
151 | </div> | |
152 | ||
adb31ebb TL |
153 | <div class="form-group row" |
154 | *ngIf="plugin === 'clay'"> | |
155 | <label for="d" | |
156 | class="cd-col-form-label"> | |
157 | <span class="required" | |
158 | i18n>Helper chunks (d)</span> | |
159 | <cd-helper [html]="tooltips.plugins.clay.d"> | |
160 | </cd-helper> | |
161 | </label> | |
162 | <div class="cd-col-form-input"> | |
163 | <div class="input-group"> | |
164 | <input type="number" | |
165 | id="d" | |
166 | name="d" | |
167 | class="form-control" | |
168 | placeholder="Helper chunks..." | |
169 | formControlName="d"> | |
39ae355f TL |
170 | <button class="btn btn-light" |
171 | id="d-calc-btn" | |
172 | ngbTooltip="Set d manually or use the plugin's default calculation that maximizes d." | |
173 | i18n-ngbTooltip | |
174 | type="button" | |
175 | (click)="toggleDCalc()"> | |
176 | <i [ngClass]="dCalc ? icons.unlock : icons.lock" | |
177 | aria-hidden="true"></i> | |
178 | </button> | |
adb31ebb TL |
179 | </div> |
180 | <span class="form-text text-muted" | |
181 | *ngIf="dCalc" | |
182 | i18n>D is automatically updated on k and m changes</span> | |
183 | <ng-container | |
184 | *ngIf="!dCalc"> | |
185 | <span class="form-text text-muted" | |
186 | *ngIf="getDMin() < getDMax()" | |
187 | i18n>D can be set from {{getDMin()}} to {{getDMax()}}</span> | |
188 | <span class="form-text text-muted" | |
189 | *ngIf="getDMin() === getDMax()" | |
190 | i18n>D can only be set to {{getDMax()}}</span> | |
191 | </ng-container> | |
192 | <span class="invalid-feedback" | |
193 | *ngIf="form.showError('d', frm, 'dMin')" | |
194 | i18n>D has to be greater than k ({{getDMin()}}).</span> | |
195 | <span class="invalid-feedback" | |
196 | *ngIf="form.showError('d', frm, 'dMax')" | |
197 | i18n>D has to be lower than k + m ({{getDMax()}}).</span> | |
198 | </div> | |
199 | </div> | |
200 | ||
9f95a23c TL |
201 | <div class="form-group row" |
202 | *ngIf="plugin === PLUGIN.LRC"> | |
203 | <label class="cd-col-form-label" | |
204 | for="l"> | |
205 | <span class="required" | |
206 | i18n>Locality (l)</span> | |
207 | <cd-helper [html]="tooltips.plugins.lrc.l"> | |
208 | </cd-helper> | |
209 | </label> | |
210 | <div class="cd-col-form-input"> | |
211 | <input type="number" | |
212 | id="l" | |
213 | name="l" | |
214 | class="form-control" | |
215 | placeholder="Coding chunks..." | |
20effc67 TL |
216 | formControlName="l" |
217 | min="1"> | |
9f95a23c TL |
218 | <span class="invalid-feedback" |
219 | *ngIf="form.showError('l', frm, 'required')" | |
220 | i18n>This field is required!</span> | |
221 | <span class="invalid-feedback" | |
222 | *ngIf="form.showError('l', frm, 'min')" | |
223 | i18n>Must be equal to or greater than 1.</span> | |
e306af50 TL |
224 | <span class="invalid-feedback" |
225 | *ngIf="form.showError('l', frm, 'unequal')" | |
226 | i18n>Can't split up chunks (k+m) correctly with the current locality.</span> | |
227 | <span class="form-text text-muted" | |
228 | i18n>Locality groups: {{lrcGroups}}</span> | |
9f95a23c TL |
229 | </div> |
230 | </div> | |
231 | ||
232 | <div class="form-group row"> | |
233 | <label for="crushFailureDomain" | |
234 | class="cd-col-form-label"> | |
235 | <ng-container i18n>Crush failure domain</ng-container> | |
236 | <cd-helper [html]="tooltips.crushFailureDomain"> | |
237 | </cd-helper> | |
238 | </label> | |
239 | <div class="cd-col-form-input"> | |
39ae355f | 240 | <select class="form-select" |
9f95a23c TL |
241 | id="crushFailureDomain" |
242 | name="crushFailureDomain" | |
243 | formControlName="crushFailureDomain"> | |
244 | <option *ngIf="!failureDomains" | |
245 | ngValue="" | |
246 | i18n>Loading...</option> | |
e306af50 | 247 | <option *ngFor="let domain of failureDomainKeys" |
9f95a23c | 248 | [ngValue]="domain"> |
e306af50 | 249 | {{ domain }} ( {{failureDomains[domain].length}} ) |
9f95a23c TL |
250 | </option> |
251 | </select> | |
252 | </div> | |
253 | </div> | |
254 | ||
255 | <div class="form-group row" | |
256 | *ngIf="plugin === PLUGIN.LRC"> | |
257 | <label for="crushLocality" | |
258 | class="cd-col-form-label"> | |
259 | <ng-container i18n>Crush Locality</ng-container> | |
260 | <cd-helper [html]="tooltips.plugins.lrc.crushLocality"> | |
261 | </cd-helper> | |
262 | </label> | |
263 | <div class="cd-col-form-input"> | |
39ae355f | 264 | <select class="form-select" |
9f95a23c TL |
265 | id="crushLocality" |
266 | name="crushLocality" | |
267 | formControlName="crushLocality"> | |
268 | <option *ngIf="!failureDomains" | |
269 | ngValue="" | |
270 | i18n>Loading...</option> | |
e306af50 | 271 | <option *ngIf="failureDomainKeys.length > 0" |
9f95a23c TL |
272 | ngValue="" |
273 | i18n>None</option> | |
e306af50 | 274 | <option *ngFor="let domain of failureDomainKeys" |
9f95a23c | 275 | [ngValue]="domain"> |
e306af50 | 276 | {{ domain }} ( {{failureDomains[domain].length}} ) |
9f95a23c TL |
277 | </option> |
278 | </select> | |
279 | </div> | |
280 | </div> | |
281 | ||
282 | <div class="form-group row" | |
adb31ebb TL |
283 | *ngIf="PLUGIN.CLAY === plugin"> |
284 | <label for="scalar_mds" | |
285 | class="cd-col-form-label"> | |
286 | <ng-container i18n>Scalar mds</ng-container> | |
287 | <cd-helper [html]="tooltips.plugins.clay.scalar_mds"> | |
288 | </cd-helper> | |
289 | </label> | |
290 | <div class="cd-col-form-input"> | |
39ae355f | 291 | <select class="form-select" |
adb31ebb TL |
292 | id="scalar_mds" |
293 | name="scalar_mds" | |
294 | formControlName="scalar_mds"> | |
295 | <option *ngFor="let plugin of [PLUGIN.JERASURE, PLUGIN.ISA, PLUGIN.SHEC]" | |
296 | [ngValue]="plugin"> | |
297 | {{ plugin }} | |
298 | </option> | |
299 | </select> | |
300 | </div> | |
301 | </div> | |
302 | ||
303 | <div class="form-group row" | |
304 | *ngIf="[PLUGIN.JERASURE, PLUGIN.ISA, PLUGIN.CLAY].includes(plugin)"> | |
9f95a23c TL |
305 | <label for="technique" |
306 | class="cd-col-form-label"> | |
307 | <ng-container i18n>Technique</ng-container> | |
308 | <cd-helper [html]="tooltips.plugins[plugin].technique"> | |
309 | </cd-helper> | |
310 | </label> | |
311 | <div class="cd-col-form-input"> | |
39ae355f | 312 | <select class="form-select" |
9f95a23c TL |
313 | id="technique" |
314 | name="technique" | |
315 | formControlName="technique"> | |
316 | <option *ngFor="let technique of techniques" | |
317 | [ngValue]="technique"> | |
318 | {{ technique }} | |
319 | </option> | |
320 | </select> | |
321 | </div> | |
322 | </div> | |
323 | ||
324 | <div class="form-group row" | |
325 | *ngIf="plugin === PLUGIN.JERASURE"> | |
326 | <label for="packetSize" | |
327 | class="cd-col-form-label"> | |
328 | <ng-container i18n>Packetsize</ng-container> | |
329 | <cd-helper [html]="tooltips.plugins.jerasure.packetSize"> | |
330 | </cd-helper> | |
331 | </label> | |
332 | <div class="cd-col-form-input"> | |
333 | <input type="number" | |
334 | id="packetSize" | |
335 | name="packetSize" | |
336 | class="form-control" | |
337 | placeholder="Packetsize..." | |
20effc67 TL |
338 | formControlName="packetSize" |
339 | min="1"> | |
9f95a23c TL |
340 | <span class="invalid-feedback" |
341 | *ngIf="form.showError('packetSize', frm, 'min')" | |
342 | i18n>Must be equal to or greater than 1.</span> | |
343 | </div> | |
344 | </div> | |
345 | ||
346 | <div class="form-group row"> | |
347 | <label for="crushRoot" | |
348 | class="cd-col-form-label"> | |
349 | <ng-container i18n>Crush root</ng-container> | |
350 | <cd-helper [html]="tooltips.crushRoot"> | |
351 | </cd-helper> | |
352 | </label> | |
353 | <div class="cd-col-form-input"> | |
39ae355f | 354 | <select class="form-select" |
e306af50 TL |
355 | id="crushRoot" |
356 | name="crushRoot" | |
357 | formControlName="crushRoot"> | |
358 | <option *ngIf="!buckets" | |
359 | ngValue="" | |
360 | i18n>Loading...</option> | |
361 | <option *ngFor="let bucket of buckets" | |
362 | [ngValue]="bucket"> | |
363 | {{ bucket.name }} | |
364 | </option> | |
365 | </select> | |
9f95a23c TL |
366 | </div> |
367 | </div> | |
368 | ||
369 | <div class="form-group row"> | |
370 | <label for="crushDeviceClass" | |
371 | class="cd-col-form-label"> | |
372 | <ng-container i18n>Crush device class</ng-container> | |
373 | <cd-helper [html]="tooltips.crushDeviceClass"> | |
374 | </cd-helper> | |
375 | </label> | |
376 | <div class="cd-col-form-input"> | |
39ae355f | 377 | <select class="form-select" |
9f95a23c TL |
378 | id="crushDeviceClass" |
379 | name="crushDeviceClass" | |
380 | formControlName="crushDeviceClass"> | |
381 | <option ngValue="" | |
e306af50 | 382 | i18n>Let Ceph decide</option> |
9f95a23c TL |
383 | <option *ngFor="let deviceClass of devices" |
384 | [ngValue]="deviceClass"> | |
385 | {{ deviceClass }} | |
386 | </option> | |
387 | </select> | |
e306af50 TL |
388 | <span class="form-text text-muted" |
389 | i18n>Available OSDs: {{deviceCount}}</span> | |
9f95a23c TL |
390 | </div> |
391 | </div> | |
392 | ||
393 | <div class="form-group row"> | |
394 | <label for="directory" | |
395 | class="cd-col-form-label"> | |
396 | <ng-container i18n>Directory</ng-container> | |
397 | <cd-helper [html]="tooltips.directory"> | |
398 | </cd-helper> | |
399 | </label> | |
400 | <div class="cd-col-form-input"> | |
401 | <input type="text" | |
402 | id="directory" | |
403 | name="directory" | |
404 | class="form-control" | |
405 | placeholder="Path..." | |
406 | formControlName="directory"> | |
407 | </div> | |
408 | </div> | |
409 | </div> | |
410 | ||
411 | <div class="modal-footer"> | |
f67539c2 TL |
412 | <cd-form-button-panel (submitActionEvent)="onSubmit()" |
413 | [form]="form" | |
414 | [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)"></cd-form-button-panel> | |
9f95a23c TL |
415 | </div> |
416 | </form> | |
417 | </ng-container> | |
418 | </cd-modal> |