function renderClientList(data) {
$.each(data, function(index, obj) {
// render client status css tag style
let clientStatusHtml = '>'
if (obj.Client.enabled) {
clientStatusHtml = `style="visibility: hidden;">`
}
// render client allocated ip addresses
let allocatedIpsHtml = "";
$.each(obj.Client.allocated_ips, function(index, obj) {
allocatedIpsHtml += `${obj} `;
})
// render client allowed ip addresses
let allowedIpsHtml = "";
$.each(obj.Client.allowed_ips, function(index, obj) {
allowedIpsHtml += `${obj} `;
})
// render client html content
let html = `
${obj.Client.name}
${obj.Client.email}
${prettyDateTime(obj.Client.created_at)}
${prettyDateTime(obj.Client.updated_at)}
${obj.Client.use_server_dns ? 'DNS enabled' : 'DNS disabled'}
IP Allocation`
+ allocatedIpsHtml
+ `
Allowed IPs`
+ allowedIpsHtml
+`
`
// add the client html elements to the list
$('#client-list').append(html);
});
}
function prettyDateTime(timeStr) {
const dt = new Date(timeStr);
const offsetMs = dt.getTimezoneOffset() * 60 * 1000;
const dateLocal = new Date(dt.getTime() - offsetMs);
return dateLocal.toISOString().slice(0, 19).replace(/-/g, "/").replace("T", " ");
}