add units to config form

This commit is contained in:
Arthur Lu 2022-12-21 00:49:57 -08:00
parent c4d607570e
commit cce8cf8115
3 changed files with 16 additions and 12 deletions

View File

@ -13,11 +13,11 @@
<form>
<fieldset>
<legend>Name</legend>
<div class="labels-inputs" id="name"></div>
<div class="labels-inputs-units" id="name"></div>
</fieldset>
<fieldset>
<legend>Resources</legend>
<div class="labels-inputs" id="resources"></div>
<div class="labels-inputs-units" id="resources"></div>
</fieldset>
<fieldset class="fieldset-no-border">
<div class="btn-group" id="form-actions">

View File

@ -29,9 +29,9 @@ button {
margin-top: 0px;
}
.labels-inputs {
.labels-inputs-units {
display: grid;
grid-template-columns: auto auto;
grid-template-columns: auto auto auto;
column-gap: 10px;
}

View File

@ -26,26 +26,26 @@ async function populateForm (node, type, vmid) {
addFormLine("name", "name", "Name", {type: "text", value: config.data.name});
addFormLine("resources", "cores", "Cores", {type: "number", value: config.data.cores, min: 1, max: 8192});
addFormLine("resources", "memory", "Memory", {type: "number", value: config.data.memory, min: 16});
addFormLine("resources", "cores", "Cores", {type: "number", value: config.data.cores, min: 1, max: 8192}, "Threads");
addFormLine("resources", "memory", "Memory", {type: "number", value: config.data.memory / 1024, min: 16}, "GiB");
let i = 0;
while(Object.hasOwn(config.data, `sata${i}`)){
let sata = config.data[`sata${i}`];
sata = `{"${sata.replaceAll(":", '":"').replaceAll("=", '":"').replaceAll(",", '","')}"}`;
sata = JSON.parse(sata);
addFormLine("resources", `sata${i}`, `SATA ${i}`, {type: "text", value: sata.size});
addFormLine("resources", `sata${i}`, `SATA ${i}`, {type: "text", value: sata.size.slice(0, sata.size.length - 1)}, sata.size.includes("G") ? "GiB" : "MiB");
i++;
}
}
function addFormLine (fieldset, id, labelName, inputAttr) {
let form = document.querySelector(`#${fieldset}`);
function addFormLine (fieldset, id, labelValue, inputAttr, unitValue="") {
let field = document.querySelector(`#${fieldset}`);
let label = document.createElement("label");
label.for = id;
label.innerHTML = labelName;
form.append(label);
label.innerHTML = labelValue;
field.append(label);
let input = document.createElement("input");
input.id = id;
@ -53,5 +53,9 @@ function addFormLine (fieldset, id, labelName, inputAttr) {
for (let k in inputAttr) {
input.setAttribute(k, inputAttr[k])
}
form.append(input);
field.append(input);
let unit = document.createElement("p");
unit.innerText = unitValue;
field.append(unit)
}