watchyourlan/internal/web/public/js/index.js
2024-08-23 13:59:32 +07:00

73 lines
No EOL
1.7 KiB
JavaScript

let addrsArray = {};
let edit = "0";
loadAddrs();
function createHTML(addr, i) {
let now = `<i class="bi bi-circle-fill" style="color:var(--bs-gray-500);"></i>`;
if (addr.Now == 1) {
now = `<i class="bi bi-check-circle-fill" style="color:var(--bs-success);"></i>`;
}
let known = '';
if (addr.Known == 1) {
known = `checked`;
}
// Needs option to use value in js
let name = `<option id="name${addr.ID}" value="${addr.Name}">${addr.Name}</option>`;
if (edit == 1) {
name = `<input id="name${addr.ID}" onchange="editForm(${addr.ID},'')" type="text" class="form-control" value="${addr.Name}">`;
}
let html = `
<tr>
<td style="opacity: 45%;">${i}.</td>
<td>${name}</td>
<td>${addr.Iface}</td>
<td>
<a href="http://${addr.IP}">${addr.IP}</a>
</td>
<td><a href="/host/${addr.ID}">${addr.Mac}</a></td>
<td>${addr.Hw}</td>
<td>${addr.Date}</td>
<td>
<div class="form-check form-switch">
<input onclick="editForm(${addr.ID}, 'toggle')" class="form-check-input" type="checkbox" ${known}>
</div>
</td>
<td>${now}</td>
</tr>
`;
return html;
}
async function loadAddrs() {
const url = '/api/all';
addrsArray = await (await fetch(url)).json();
bkpArray = addrsArray;
displayArrayData(addrsArray);
}
function sortBy(field) {
sortByAny(addrsArray, field);
}
function editClick() {
edit = 1 - edit;
loadAddrs();
}
async function editForm(id, known) {
const name = document.getElementById("name"+id).value;
const url = '/api/edit/'+id+'/'+name+'/'+known;
// console.log(url);
await fetch(url);
}