improve account style,
add allowed nodes to account page, reduce use of innerHTML Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
parent
35d35af59a
commit
8edca1eed0
37
account.html
37
account.html
@ -27,24 +27,25 @@
|
|||||||
<section class="w3-container">
|
<section class="w3-container">
|
||||||
<h2>Account</h2>
|
<h2>Account</h2>
|
||||||
<div class="w3-card w3-padding">
|
<div class="w3-card w3-padding">
|
||||||
<div class="flex row wrap">
|
<h3>Account Details</h3>
|
||||||
<p id="username">Username: </p>
|
<p id="username">Username:</p>
|
||||||
<p id="pool">Pool: </p>
|
<p id="pool">Pool:</p>
|
||||||
<p id="vmid">VMID Range: </p>
|
<p id="vmid">VMID Range:</p>
|
||||||
</div>
|
<p id="nodes">Nodes:</p>
|
||||||
<div class="">
|
</div>
|
||||||
<table id="resource-table" class="w3-table w3-table-all" style="overflow-x: auto;">
|
<div class="w3-card w3-padding w3-margin-top">
|
||||||
<thead>
|
<h3>Cluster Resources</h3>
|
||||||
<tr class="w3-black">
|
<table id="resource-table" class="w3-table w3-table-all" style="overflow-x: auto;">
|
||||||
<th>Resource</th>
|
<thead>
|
||||||
<th>Used</th>
|
<tr class="w3-black">
|
||||||
<th>Free</th>
|
<th>Resource</th>
|
||||||
<th>Total</th>
|
<th>Used</th>
|
||||||
</tr>
|
<th>Free</th>
|
||||||
</thead>
|
<th>Total</th>
|
||||||
<tbody></tbody>
|
</tr>
|
||||||
</table>
|
</thead>
|
||||||
</div>
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
@ -19,9 +19,10 @@ async function init () {
|
|||||||
let user = await requestAPI("/user");
|
let user = await requestAPI("/user");
|
||||||
let resources = user.resources;
|
let resources = user.resources;
|
||||||
let instances = user.instances;
|
let instances = user.instances;
|
||||||
document.querySelector("#username").innerHTML += getCookie("username");
|
document.querySelector("#username").innerText = `Username: ${getCookie("username")}`;
|
||||||
document.querySelector("#pool").innerHTML += instances.pool;
|
document.querySelector("#pool").innerText = `Pool: ${instances.pool}`;
|
||||||
document.querySelector("#vmid").innerHTML += `[${instances.vmid.min},${instances.vmid.max}]`;
|
document.querySelector("#vmid").innerText = `VMID Range: ${instances.vmid.min} - ${instances.vmid.max}`;
|
||||||
|
document.querySelector("#nodes").innerText = `Nodes: ${user.nodes.toString()}`;
|
||||||
buildResourceTable(resources, "#resource-table");
|
buildResourceTable(resources, "#resource-table");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -53,7 +53,7 @@ function addResourceLine (fieldset, iconHref, labelText, inputAttr, unitText=nul
|
|||||||
field.append(icon);
|
field.append(icon);
|
||||||
|
|
||||||
let label = document.createElement("label");
|
let label = document.createElement("label");
|
||||||
label.innerHTML = labelText;
|
label.innerText = labelText;
|
||||||
label.htmlFor = labelText;
|
label.htmlFor = labelText;
|
||||||
field.append(label);
|
field.append(label);
|
||||||
|
|
||||||
@ -120,7 +120,7 @@ function addDiskLine (fieldset, busPrefix, busName, device, diskDetails) {
|
|||||||
|
|
||||||
// Add a label for the disk bus and device number
|
// Add a label for the disk bus and device number
|
||||||
let diskLabel = document.createElement("label");
|
let diskLabel = document.createElement("label");
|
||||||
diskLabel.innerHTML = diskName;
|
diskLabel.innerText = diskName;
|
||||||
diskLabel.dataset.disk = diskID;
|
diskLabel.dataset.disk = diskID;
|
||||||
field.append(diskLabel);
|
field.append(diskLabel);
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user