Refactor network tree data structure and improve device status handling

- Updated the network tree data structure to use consistent naming conventions for device properties (e.g., devName, devMac).
- Enhanced the initTree function to utilize the new property names and improved the rendering of device nodes.
- Refactored the getStatusBadgeParts function to include additional parameters for archived and new device statuses.
- Introduced convenience functions (badgeFromDevice and badgeFromDataAttrs) to streamline badge generation from device objects and data attributes.
- Updated various language files to include new status labels and ensure consistency across translations.
- Modified the renderSmallBox function to allow for custom icon HTML, improving flexibility in UI components.
This commit is contained in:
Jokob @NetAlertX
2026-03-02 09:35:42 +00:00
parent 3e237bb452
commit 6724d250d4
28 changed files with 280 additions and 156 deletions

View File

@@ -16,15 +16,16 @@ function loadNetworkNodes() {
// PC (leaf) <------- leafs are not included in this SQL query
const rawSql = `
SELECT
parent.devName AS node_name,
LOWER(parent.devMac) AS node_mac,
parent.devPresentLastScan AS online,
parent.devType AS node_type,
LOWER(parent.devParentMAC) AS parent_mac,
parent.devIcon AS node_icon,
parent.devAlertDown AS node_alert,
parent.devFlapping AS node_flapping,
parent.devIsSleeping AS node_sleeping,
parent.devName,
LOWER(parent.devMac) AS devMac,
parent.devPresentLastScan,
parent.devType,
LOWER(parent.devParentMAC) AS devParentMAC,
parent.devIcon,
parent.devAlertDown,
parent.devFlapping,
parent.devIsSleeping,
parent.devIsNew,
COUNT(child.devMac) AS node_ports_count
FROM DevicesView AS parent
LEFT JOIN DevicesView AS child
@@ -35,7 +36,7 @@ function loadNetworkNodes() {
WHERE parent.devType IN (${networkDeviceTypes})
AND parent.devIsArchived = 0
GROUP BY parent.devMac, parent.devName, parent.devPresentLastScan,
parent.devType, parent.devParentMAC, parent.devIcon, parent.devAlertDown, parent.devFlapping, parent.devIsSleeping
parent.devType, parent.devParentMAC, parent.devIcon, parent.devAlertDown, parent.devFlapping, parent.devIsSleeping, parent.devIsNew
ORDER BY parent.devName;
`;
@@ -142,15 +143,8 @@ function loadDeviceTable({ sql, containerSelector, tableId, wrapperHtml = null,
data: 'devStatus',
width: '15%',
render: function (_, type, device) {
const badge = getStatusBadgeParts(
device.devPresentLastScan,
device.devAlertDown,
device.devFlapping,
device.devMac,
device.devStatus,
device.devIsSleeping || 0
);
return `<a href="${badge.url}" class="badge ${badge.cssClass}">${badge.iconHtml} ${badge.text}</a>`;
const badge = badgeFromDevice(device);
return `<a href="${badge.url}" class="badge ${badge.cssClass}">${badge.iconHtml} ${badge.label}</a>`;
}
},
{
@@ -206,7 +200,7 @@ function loadDeviceTable({ sql, containerSelector, tableId, wrapperHtml = null,
*/
function loadUnassignedDevices() {
const sql = `
SELECT devMac, devPresentLastScan, devName, devLastIP, devVendor, devAlertDown, devParentPort, devFlapping, devIsSleeping, devStatus
SELECT devMac, devPresentLastScan, devName, devLastIP, devVendor, devAlertDown, devParentPort, devFlapping, devIsSleeping, devIsNew, devStatus
FROM DevicesView
WHERE (devParentMAC IS NULL OR devParentMAC IN ("", " ", "undefined", "null"))
AND LOWER(devMac) NOT LIKE "%internet%"
@@ -241,7 +235,7 @@ function loadConnectedDevices(node_mac) {
const normalized_mac = node_mac.toLowerCase();
const sql = `
SELECT devName, devMac, devLastIP, devVendor, devPresentLastScan, devAlertDown, devParentPort, devVlan, devFlapping, devIsSleeping,
SELECT devName, devMac, devLastIP, devVendor, devPresentLastScan, devAlertDown, devParentPort, devVlan, devFlapping, devIsSleeping, devIsNew, devIsArchived,
CASE
WHEN devIsNew = 1 THEN 'New'
WHEN devPresentLastScan = 1 THEN 'On-line'