0ct0pu5/DweebUI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

First draft of working images page

Browse source
This commit is contained in:
lllllllillllllillll 2024-01-08 13:58:37 -08:00
parent 190b902090
commit d4fed30db6
2 changed files with 38 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
controllers/images.js
View file

@ -3,29 +3,50 @@ import { dockerImages } from 'systeminformation';
export const Images = async function(req, res) {
const data1 = await dockerImages({ all: true });
let images = await dockerImages({ all: true });
const data2 = await docker.listImages({ all: true });
let image_list = `
<thead>
<tr>
<th class="w-1"><input class="form-check-input m-0 align-middle" name="select" type="checkbox" aria-label="Select all" onclick="selectAll()"></th>
<th><button class="table-sort" data-sort="sort-name">Name</button></th>
<th><button class="table-sort" data-sort="sort-city">ID</button></th>
<th><button class="table-sort" data-sort="sort-type">Tag</button></th>
<th><button class="table-sort" data-sort="sort-score">Status</button></th>
<th><button class="table-sort" data-sort="sort-date">Created</button></th>
<th><button class="table-sort" data-sort="sort-quantity">Size</button></th>
<th><button class="table-sort" data-sort="sort-progress">Action</button></th>
</tr>
</thead>
<tbody class="table-tbody">`
// for ( i = 0; i < data.length; i++) {
// console.log(`Image ${i}:`)
// console.log(`repoTags: ${data[i].repoTags}`)
// }
for (let i = 0; i < images.length; i++) {
let image = `
<tr>
<td><input class="form-check-input m-0 align-middle" name="select" value="" type="checkbox" aria-label="Select"></td>
<td class="sort-name">${images[i].repoTags}</td>
<td class="sort-city">${images[i].id}</td>
<td class="sort-type">Latest</td>
<td class="sort-score text-green">In use</td>
<td class="sort-date" data-date="1628122643">August 05, 2021</td>
<td class="sort-quantity">69.27 MB</td>
<td class="text-end"><a class="btn" href="#">Details</a></td>
</tr>`
image_list += image;
}
console.log(`data1: ${data1}`);
image_list += `</tbody>`
console.log(`data2: ${data2}`);
// for (let i = 0; i < allImages.length; i++) {
// console.log(`Image ${i}:`)
// console.log(`repoTags: ${allImages[i].repoTags}`)
// }
res.render("images", {
name: req.session.user,
role: req.session.role,
avatar: req.session.avatar,
image_list: image_list
});
}

44
views/images.ejs
View file

@ -109,47 +109,9 @@
<div id="table-default" class="table-responsive">
<table class="table">
<thead>
<tr>
<th class="w-1"><input class="form-check-input m-0 align-middle" name="select" type="checkbox" aria-label="Select all" onclick="selectAll()"></th>
<th><button class="table-sort" data-sort="sort-name">Name</button></th>
<th><button class="table-sort" data-sort="sort-city">ID</button></th>
<th><button class="table-sort" data-sort="sort-type">Tag</button></th>
<th><button class="table-sort" data-sort="sort-score">Status</button></th>
<th><button class="table-sort" data-sort="sort-date">Created</button></th>
<th><button class="table-sort" data-sort="sort-quantity">Size</button></th>
<th><button class="table-sort" data-sort="sort-progress">Action</button></th>
</tr>
</thead>
<tbody class="table-tbody"><tr>
<td><input class="form-check-input m-0 align-middle" name="select" value="" type="checkbox" aria-label="Select"></td>
<td class="sort-name">Caddy</td>
<td class="sort-city">2f148ddb6662b4245ef4ced637e928eaf67a8a1941572d69627652253e779366</td>
<td class="sort-type">Latest</td>
<td class="sort-score text-green">In use</td>
<td class="sort-date" data-date="1628122643">August 05, 2021</td>
<td class="sort-quantity">69.27 MB</td>
<td class="text-end"><a class="btn" href="#">Details</a></td>
</tr><tr>
<td><input class="form-check-input m-0 align-middle" name="select" value="" type="checkbox" aria-label="Select"></td>
<td class="sort-name">clamav/clamav</td>
<td class="sort-city">c447f9c713058cdb915c5becbef004a678cd7b8d6f5d70ec53479ba7687c3375</td>
<td class="sort-type">Latest</td>
<td class="sort-score text-green">In use</td>
<td class="sort-date" data-date="1546344668">January 01, 2019</td>
<td class="sort-quantity">546.22 MB</td>
<td class="text-end"><a class="btn" href="#">Details</a></td>
</tr><tr>
<td><input class="form-check-input m-0 align-middle" name="select" value="" type="checkbox" aria-label="Select"></td>
<td class="sort-name">linuxserver/code-server</td>
<td class="sort-city">af09184f86e955b33bef7634862430f54899cc9ca5e492d1530451caa1d99dc0</td>
<td class="sort-type">Latest</td>
<td class="sort-score text-yellow">Unused</td>
<td class="sort-date" data-date="1545977105">December 28, 2018</td>
<td class="sort-quantity">63.91 MB</td>
<td class="text-end"><a class="btn" href="#">Details</a></td>
</tr>
</tbody>
<%- image_list %>
</table>
</div>