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

fix network page.

Browse source
This commit is contained in:
lllllllillllllillll 2024-01-15 01:11:58 -08:00
parent 0911a15ac4
commit 109e77c56c
5 changed files with 23 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
README.md
View file

@ -1,5 +1,5 @@
# DweebUI
DweebUI is a web interface for managing Docker, with a zero-config dashboard for your containers.
DweebUI is a web interface for managing Docker, with a zero-config dashboard for controlling and monitoring your containers.
Alpha v0.20 ( :fire: Experimental :fire: )
@ -12,7 +12,7 @@ Alpha v0.20 ( :fire: Experimental :fire: )
[![GitHub License](https://img.shields.io/github/license/lllllllillllllillll/DweebUI)](https://github.com/lllllllillllllillll/DweebUI/blob/main/LICENSE)
* This is a personal project I started to get more familiar with Javascript and Node.js.
* Some UI elements are placeholders.
* Some UI elements are placeholders and every version may have breaking changes.
* Please post issues and discussions so I know what bugs and features to focus on.
* I probably should have waited a lot longer to share this :|

35
controllers/networks.js
View file

@ -4,7 +4,6 @@ import { docker } from '../server.js';
export const Networks = async function(req, res) {
let networks = await docker.listNetworks({ all: true });
console.log(networks);
let network_list = `
<thead>
@ -12,38 +11,34 @@ export const Networks = async function(req, res) {
<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 (let i = 0; i < networks.length; i++) {
for (let i = 0; i < networks.length; i++) {
// let date = new Date(images[i].Created * 1000);
// let created = date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' });
// let date = new Date(images[i].Created * 1000);
// let created = date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' });
// let details = `
// <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">${created}</td>
// <td class="sort-quantity">${size} MB</td>
// <td class="text-end"><a class="btn" href="#">Details</a></td>
// </tr>`
// image_list += details;
// }
let details = `
<tr>
<td><input class="form-check-input m-0 align-middle" name="select" value="" type="checkbox" aria-label="Select"></td>
<td class="sort-name">${networks[i].Name}</td>
<td class="sort-city">${networks[i].Id}</td>
<td class="sort-score text-green">In use</td>
<td class="sort-date" data-date="1628122643">${networks[i].Created}</td>
<td class="text-end"><a class="btn" href="#">Details</a></td>
</tr>`
network_list += details;
}
// image_list += `</tbody>`
network_list += `</tbody>`
res.render("networks", {

4
views/images.ejs
View file

@ -34,11 +34,11 @@
<div class="card-header">
<h3 class="card-title">Docker Images</h3>
<div class="card-options btn-list">
<a href="/refreshsites" class="btn">
<a href="#" class="btn">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-refresh" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"></path> <path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"></path> </svg>
Refresh
</a>
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#add-site">
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#not_add-site">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-plus" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M12 5l0 14"></path> <path d="M5 12l14 0"></path> </svg>
New Image
</a>

4
views/networks.ejs
View file

@ -34,11 +34,11 @@
<div class="card-header">
<h3 class="card-title">Docker Networks</h3>
<div class="card-options btn-list">
<a href="/refreshsites" class="btn">
<a href="#" class="btn">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-refresh" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"></path> <path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"></path> </svg>
Refresh
</a>
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#add-site">
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#not_add-site">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-plus" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M12 5l0 14"></path> <path d="M5 12l14 0"></path> </svg>
New Network
</a>

4
views/volumes.ejs
View file

@ -34,11 +34,11 @@
<div class="card-header">
<h3 class="card-title">Docker Volumes</h3>
<div class="card-options btn-list">
<a href="/refreshsites" class="btn">
<a href="#" class="btn">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-refresh" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"></path> <path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"></path> </svg>
Refresh
</a>
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#add-site">
<a href="#" class="btn" data-bs-toggle="modal" data-bs-target="#not_add-site">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-plus" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <path d="M12 5l0 14"></path> <path d="M5 12l14 0"></path> </svg>
New Volume
</a>