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:
Arthur Lu 2023-05-03 21:06:27 +00:00
parent d351fdfb67
commit 86dd966691
3 changed files with 25 additions and 23 deletions

View File

@ -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>

View File

@ -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");
} }

View File

@ -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);