diff --git a/front/devices.php b/front/devices.php index 0bed1829..07ed2e51 100755 --- a/front/devices.php +++ b/front/devices.php @@ -42,7 +42,7 @@
= lang('Device_Shortcut_AllDevices');?>
@@ -54,7 +54,7 @@= lang('Device_Shortcut_Connected');?>
@@ -66,7 +66,7 @@= lang('Device_Shortcut_Favorites');?>
@@ -78,7 +78,7 @@= lang('Device_Shortcut_NewDevices');?>
@@ -90,7 +90,7 @@= lang('Device_Shortcut_DownAlerts');?>
@@ -102,7 +102,7 @@= lang('Device_Shortcut_Archived');?>
@@ -236,24 +236,24 @@ function main () { //initialize the table headers in the correct order - var headersDefaultOrder = [ '= lang('Device_TableHead_Name');?>', - '= lang('Device_TableHead_Owner');?>', - '= lang('Device_TableHead_Type');?>', - '= lang('Device_TableHead_Icon');?>', - '= lang('Device_TableHead_Favorite');?>', - '= lang('Device_TableHead_Group');?>', - '= lang('Device_TableHead_FirstSession');?>', - '= lang('Device_TableHead_LastSession');?>', - '= lang('Device_TableHead_LastIP');?>', - '= lang('Device_TableHead_MAC');?>', - '= lang('Device_TableHead_Status');?>', - '= lang('Device_TableHead_MAC_full');?>', - '= lang('Device_TableHead_LastIPOrder');?>', - '= lang('Device_TableHead_Rowid');?>', - '= lang('Device_TableHead_Parent_MAC');?>', - '= lang('Device_TableHead_Connected_Devices');?>', - '= lang('Device_TableHead_Location');?>', - '= lang('Device_TableHead_Vendor');?>' + var headersDefaultOrder = [ getString('Device_TableHead_Name'), + getString('Device_TableHead_Owner'), + getString('Device_TableHead_Type'), + getString('Device_TableHead_Icon'), + getString('Device_TableHead_Favorite'), + getString('Device_TableHead_Group'), + getString('Device_TableHead_FirstSession'), + getString('Device_TableHead_LastSession'), + getString('Device_TableHead_LastIP'), + getString('Device_TableHead_MAC'), + getString('Device_TableHead_Status'), + getString('Device_TableHead_MAC_full'), + getString('Device_TableHead_LastIPOrder'), + getString('Device_TableHead_Rowid'), + getString('Device_TableHead_Parent_MAC'), + getString('Device_TableHead_Connected_Devices'), + getString('Device_TableHead_Location'), + getString('Device_TableHead_Vendor') ]; html = ''; @@ -290,8 +290,7 @@ function main () { initializeDatatable(); // query data - getDevicesTotals(); - getDevicesList (deviceStatus); + getDevicesTotals(); }); }); }); @@ -313,9 +312,53 @@ function mapIndx(oldIndex) } } +// ----------------------------------------------------------------------------- +// Define a function to filter data based on deviceStatus +function filterDataByStatus(data, status) { + return data.filter(function(item) { + switch (status) { + case 'all': + return true; // Include all items for 'all' status + case 'connected': + return item.dev_PresentLastScan === 1; + case 'favorites': + return item.dev_Favorite === 1; + case 'new': + return item.dev_NewDevice === 1; + case 'down': + return item.dev_PresentLastScan === 0 && item.dev_AlertDeviceDown === 1; + case 'archived': + return item.dev_Archived === 1; + default: + return true; // Include all items for unknown statuses + } + }); +} // ----------------------------------------------------------------------------- -function initializeDatatable () { +function initializeDatatable (status) { + + // Save status selected + deviceStatus = status; + + // Define color & title for the status selected + switch (deviceStatus) { + case 'all': tableTitle = getString('Device_Shortcut_AllDevices'); color = 'aqua'; break; + case 'connected': tableTitle = getString('Device_Shortcut_Connected'); color = 'green'; break; + case 'favorites': tableTitle = getString('Device_Shortcut_Favorites'); color = 'yellow'; break; + case 'new': tableTitle = getString('Device_Shortcut_NewDevices'); color = 'yellow'; break; + case 'down': tableTitle = getString('Device_Shortcut_DownAlerts'); color = 'red'; break; + case 'archived': tableTitle = getString('Device_Shortcut_Archived'); color = 'gray'; break; + default: tableTitle = getString('Device_Shortcut_Devices'); color = 'gray'; break; + } + + // Set title and color + $('#tableDevicesTitle')[0].className = 'box-title text-'+ color; + $('#tableDevicesBox')[0].className = 'box box-'+ color; + $('#tableDevicesTitle').html (tableTitle); + + + for(i = 0; i < tableColumnOrder.length; i++) { // hide this column if not in the tableColumnVisible variable (we need to keep the MAC address (index 11) for functionality reasons) @@ -325,188 +368,195 @@ function initializeDatatable () { } } - $.get('api/table_devices.json', function(result) { - // var list = data["data"]; + console.log(tableColumnOrder) + console.log(tableColumnVisible) + console.log(tableColumnHide) - // Convert JSON data into the desired format - var dataArray = { - data: result.data.map(function(item) { - return [ - item.dev_Icon || "", - item.dev_Name || "", - item.dev_Status || "", - item.dev_MAC || "", - item.dev_LastIP || "", - item.dev_Group || "", - item.dev_DeviceType || "", - item.dev_StaticIP || 0, - item.dev_Favorite || "", - item.dev_FirstConnection || "", - item.dev_LastConnection || "", - item.dev_NewDevice || 0, - item.dev_MAC_full || "", - item.connected_devices || 0, - item.dev_Network_Node_MAC_ADDR || "", - item.dev_Network_Node_port || 0, - item.dev_Network_Node_MAC_ADDR || "", - item.dev_Vendor || "", - item.dev_Network_Node_port || "" - ]; - }) - }; + $.get('api/table_devices.json', function(result) { + + // Filter the data based on deviceStatus + var filteredData = filterDataByStatus(result.data, deviceStatus); - console.log("aaaaa") - console.log(JSON.stringify(dataArray)) - console.log(dataArray) - console.log() + // Convert JSON data into the desired format + var dataArray = { + data: filteredData.map(function(item) { + return [ + item.dev_Name || "", + item.dev_Owner || "", + item.dev_DeviceType || "", + item.dev_Icon || "", + item.dev_Favorite || "", + item.dev_Group || "", + item.dev_FirstConnection || "", + item.dev_LastConnection || "", + item.dev_LastIP || "", + item.dev_MAC || "", // TODO handle internet node mac + "status", + item.dev_MAC || "", // hidden + item.dev_StaticIP || 0, + item.dev_LastIP || "", // IP orderable + item.rowid || "", + item.dev_Network_Node_MAC_ADDR || "", + item.connected_devices || 0, + item.dev_Location || "", + item.dev_Vendor || "", + item.dev_Network_Node_port || 0 + ]; + }) + }; + + // TODO displayed columns - // TODO Filter - // TODO displayed columns - // TODO columns order - var table= - $('#tableDevices').DataTable({ - 'data' : dataArray["data"], - 'paging' : true, - 'lengthChange' : true, - 'lengthMenu' : [[10, 25, 50, 100, 500, -1], [10, 25, 50, 100, 500, '= lang('Device_Tablelenght_all');?>']], - 'searching' : true, + // Check if the DataTable already exists + if ($.fn.dataTable.isDataTable('#tableDevices')) { + // The DataTable exists, so destroy it + var table = $('#tableDevices').DataTable(); + table.clear().destroy(); + } - 'ordering' : true, - 'info' : true, - 'autoWidth' : false, + var table= + $('#tableDevices').DataTable({ + 'data' : dataArray["data"], + 'paging' : true, + 'lengthChange' : true, + 'lengthMenu' : [[10, 25, 50, 100, 500, -1], [10, 25, 50, 100, 500, getString('Device_Tablelenght_all')]], + 'searching' : true, - // Parameters - 'pageLength' : tableRows, - 'order' : tableOrder, - // 'order' : [[3,'desc'], [0,'asc']], + 'ordering' : true, + 'info' : true, + 'autoWidth' : false, - 'columnDefs' : [ - {visible: false, targets: tableColumnHide }, - {className: 'text-center', targets: [mapIndx(3), mapIndx(4), mapIndx(9), mapIndx(10), mapIndx(15)] }, - {width: '80px', targets: [mapIndx(6), mapIndx(7), mapIndx(15)] }, - {width: '30px', targets: [mapIndx(10), mapIndx(13)] }, - {orderData: [mapIndx(12)], targets: mapIndx(8) }, + // Parameters + 'pageLength' : tableRows, + 'order' : tableOrder, - // Device Name - {targets: [mapIndx(0)], - 'createdCell': function (td, cellData, rowData, row, col) { - - console.log(cellData) - $(td).html (''+ cellData +''); - } }, + 'columnDefs' : [ + {visible: false, targets: tableColumnHide }, + {className: 'text-center', targets: [mapIndx(3), mapIndx(4), mapIndx(9), mapIndx(10), mapIndx(15)] }, + {width: '80px', targets: [mapIndx(6), mapIndx(7), mapIndx(15)] }, + {width: '30px', targets: [mapIndx(10), mapIndx(13)] }, + {orderData: [mapIndx(12)], targets: mapIndx(8) }, - // Connected Devices - {targets: [mapIndx(15)], - 'createdCell': function (td, cellData, rowData, row, col) { - $(td).html (''+ cellData +''); - } }, - - // Icon - {targets: [mapIndx(3)], - 'createdCell': function (td, cellData, rowData, row, col) { - if (!emptyArr.includes(cellData)){ - $(td).html (''); - } else { - $(td).html (''); - } - } }, - - // Full MAC - {targets: [mapIndx(11)], - 'createdCell': function (td, cellData, rowData, row, col) { - if (!emptyArr.includes(cellData)){ - $(td).html (''+cellData+''); - } else { - $(td).html (''); - } - } }, - - // IP address - {targets: [mapIndx(12)], - 'createdCell': function (td, cellData, rowData, row, col) { - if (!emptyArr.includes(cellData)){ - $(td).html (''+cellData+''); - } else { - $(td).html (''); - } - } }, - - // Favorite - {targets: [mapIndx(4)], - 'createdCell': function (td, cellData, rowData, row, col) { - if (cellData == 1){ - $(td).html (''); - } else { - $(td).html (''); - } - } }, + // Device Name + {targets: [mapIndx(0)], + 'createdCell': function (td, cellData, rowData, row, col) { - // Dates - {targets: [mapIndx(6), mapIndx(7)], - 'createdCell': function (td, cellData, rowData, row, col) { - $(td).html (translateHTMLcodes (cellData)); - } }, + console.log(cellData) + $(td).html (''+ cellData +''); + } }, - // Random MAC - {targets: [mapIndx(9)], - 'createdCell': function (td, cellData, rowData, row, col) { - if (cellData == 1){ - $(td).html (''); - } else { - $(td).html (''); - } - } }, + // Connected Devices + {targets: [mapIndx(15)], + 'createdCell': function (td, cellData, rowData, row, col) { + $(td).html (''+ cellData +''); + } }, - // Status color - {targets: [mapIndx(10)], - 'createdCell': function (td, cellData, rowData, row, col) { - switch (cellData) { - case 'Down': color='red'; break; - case 'New': color='yellow'; break; - case 'On-line': color='green'; break; - case 'Off-line': color='gray text-white'; break; - case 'Archived': color='gray text-white'; break; - default: color='aqua'; break; - }; - - $(td).html (''+ cellData.replace('-', '') +''); - } }, - ], + // Icon + {targets: [mapIndx(3)], + 'createdCell': function (td, cellData, rowData, row, col) { + if (!emptyArr.includes(cellData)){ + $(td).html (''); + } else { + $(td).html (''); + } + } }, + + // Full MAC + {targets: [mapIndx(11)], + 'createdCell': function (td, cellData, rowData, row, col) { + if (!emptyArr.includes(cellData)){ + $(td).html (''+cellData+''); + } else { + $(td).html (''); + } + } }, + + // IP address + {targets: [mapIndx(12)], + 'createdCell': function (td, cellData, rowData, row, col) { + if (!emptyArr.includes(cellData)){ + $(td).html (''+cellData+''); + } else { + $(td).html (''); + } + } }, + + // Favorite + {targets: [mapIndx(4)], + 'createdCell': function (td, cellData, rowData, row, col) { + if (cellData == 1){ + $(td).html (''); + } else { + $(td).html (''); + } + } }, - // Processing - 'processing' : true, - 'language' : { - processing: '| Loading... |
| Loading... |