From a1444659ea24909fc835eb0389ef7acedc716fed Mon Sep 17 00:00:00 2001 From: Jokob-sk Date: Tue, 17 Jan 2023 23:42:00 +1100 Subject: [PATCH] Devices Columns 0.1 --- front/css/pialert.css | 13 ++++ front/devices.php | 78 ++++++++++++++++-------- front/js/pialert_common.js | 7 +++ front/maintenance.php | 84 +++++++++++++++++++++++++- front/php/templates/language/en_us.php | 2 + 5 files changed, 158 insertions(+), 26 deletions(-) diff --git a/front/css/pialert.css b/front/css/pialert.css index c3430199..180a416e 100755 --- a/front/css/pialert.css +++ b/front/css/pialert.css @@ -723,4 +723,17 @@ height: 50px; .pointer { cursor:pointer; +} +.db_info_table_row .select2-container--default .select2-selection--multiple .select2-selection__choice +{ + background-color:#258744; +} +.db_info_table_row .select2-container--default .select2-selection--multiple +{ + background-color:#606060; +} + +.select2-container .select2-dropdown +{ + background-color:#606060; } \ No newline at end of file diff --git a/front/devices.php b/front/devices.php index 504dc6e0..02a1e465 100755 --- a/front/devices.php +++ b/front/devices.php @@ -162,7 +162,7 @@ - + @@ -206,6 +206,8 @@ var parTableOrder = 'Front_Devices_Order'; var tableRows = 10; var tableOrder = [[3,'desc'], [0,'asc']]; + var tableColumnShow = [0,1,2,3,4,5,6,7,8,9,10,12,13] + var tableColumnAll = [0,1,2,3,4,5,6,7,8,9,10,12,13] // Read parameters & Initialize components main(); @@ -215,43 +217,63 @@ function main () { // get parameter value - $.get('php/server/parameters.php?action=get&defaultValue=50¶meter='+ parTableRows, function(data) { - var result = JSON.parse(data); + $.get('php/server/parameters.php?action=get&expireMinutes=525600&defaultValue=[0,1,2,3,4,5,6,7,8,9,10,11,12,13]¶meter=Front_Devices_Columns', function(data) { + + tableColumnShow = numberArrayFromString(data); - result = parseInt(result, 10) - - if (Number.isInteger (result) ) { - tableRows = result; - } + console.log(tableColumnShow); // get parameter value - $.get('php/server/parameters.php?action=get&defaultValue=[[3,"desc"],[0,"asc"]]¶meter='+ parTableOrder, function(data) { + $.get('php/server/parameters.php?action=get&defaultValue=50¶meter='+ parTableRows, function(data) { var result = JSON.parse(data); - result = JSON.parse(result); - if (Array.isArray (result) ) { - tableOrder = result; + + result = parseInt(result, 10) + + if (Number.isInteger (result) ) { + tableRows = result; } - // Initialize components with parameters - initializeDatatable(); + // get parameter value + $.get('php/server/parameters.php?action=get&defaultValue=[[3,"desc"],[0,"asc"]]¶meter='+ parTableOrder, function(data) { + var result = JSON.parse(data); + result = JSON.parse(result); + if (Array.isArray (result) ) { + tableOrder = result; + } - // query data - getDevicesTotals(); - getDevicesList (deviceStatus); - }); + // Initialize components with parameters + initializeDatatable(); + + // query data + getDevicesTotals(); + getDevicesList (deviceStatus); + }); + }); }); } // ----------------------------------------------------------------------------- function initializeDatatable () { + // + var tableColumnHide = []; + for(i = 0; i < tableColumnAll.length; i++) + { + // hide this coolumn if not in the tableColumnShow variable + if(tableColumnShow.includes(tableColumnAll[i]) == false) + { + tableColumnHide.push(tableColumnAll[i]); + } + } + // If the device has a small width (mobile) only show name, ip, and status columns. - if (window.screen.width < 400) { - // var tableColumnHide = [10,11,12,1,2,3,4,5,6,8]; - var tableColumnHide = [11,12,13,1,2,4,5,6,7,9]; - } else { - // var tableColumnHide = [10, 11, 12]; - var tableColumnHide = [11, 12, 13]; - }; + if (window.screen.width < 400) { + // var tableColumnHide = [11,12,13,1,2,4,5,6,7,9]; + tableColumnHide = [11,12,13,1,2,4,5,6,7,9]; + } + // else { + // // var tableColumnHide = [11, 12, 13]; + // tableColumnHide = [11, 12, 13]; + // }; var table= $('#tableDevices').DataTable({ 'paging' : true, @@ -410,6 +432,10 @@ function getDevicesTotals () { } +// ----------------------------------------------------------------------------- +function getDeviceColumns () { + +} // ----------------------------------------------------------------------------- function getDevicesList (status) { // Save status selected @@ -437,3 +463,5 @@ function getDevicesList (status) { }; + + diff --git a/front/js/pialert_common.js b/front/js/pialert_common.js index 18a426f2..536ac789 100755 --- a/front/js/pialert_common.js +++ b/front/js/pialert_common.js @@ -206,6 +206,13 @@ function sanitize(data) return data.replace(/(\r\n|\n|\r)/gm,"").replace(/[^\x00-\x7F]/g, "") } +// ----------------------------------------------------------------------------- +function numberArrayFromString(data) +{ + data = JSON.parse(sanitize(data)); + return data.replace(/\[|\]/g, '').split(',').map(Number); +} + // ----------------------------------------------------------------------------- function setParameter (parameter, value) { // Retry diff --git a/front/maintenance.php b/front/maintenance.php index 3d0bab17..e8012f79 100755 --- a/front/maintenance.php +++ b/front/maintenance.php @@ -249,7 +249,34 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
- + +
+
+
+ + +
+
+ +
+
+ +
@@ -724,6 +751,48 @@ function scrollDown() } } +// -------------------------------------------------------- +// $.get('php/server/parameters.php?action=set¶meter=Front_Dark_Mode_Enabled&expireMinutes=525600&value='+ darkModeEnabled, +function saveSelectedColumns () { + $.get('php/server/parameters.php?action=set&expireMinutes=525600&value=['+ $('#columnsSelect').val().toString() +']¶meter=Front_Devices_Columns', function(data) { + + }); +} + +// -------------------------------------------------------- +function initializeSelectedColumns () { + $.get('php/server/parameters.php?action=get&expireMinutes=525600&defaultValue=[0,1,2,3,4,5,6,7,8,9,10,12,13]¶meter=Front_Devices_Columns', function(data) { + + // console.log(data); + + tableColumnShow = numberArrayFromString(data); + + // console.log(tableColumnShow); + + + for(i=0; i < tableColumnShow.length; i++) + { + // console.log(tableColumnShow) + + // $("#columnsSelect").select2('data', {id: '1049', text: 'MyLabel'}); + + // create the option and append to Select2 + var option = new Option($('#columnsSelect option[value='+tableColumnShow[i]+']').html(), tableColumnShow[i] , true, true); + $("#columnsSelect").append(option).trigger('change'); + + // // manually trigger the `select2:select` event + // $("#columnsSelect").trigger({ + // type: 'select2:select', + // params: { + // data: data + // } + // }); + + // $('#'+columnsSelect+' option[value='+tableColumnShow[i]+']').html() + } + + }); +} // -------------------------------------------------------- function initializeTabs () { @@ -780,6 +849,8 @@ $('#langselector').on('change', function (e) { // load footer asynchronously not to block the page load/other sections window.onload = function asyncFooter() { + initializeSelectedColumns(); + scrollDown(); initializeTabs(); @@ -793,5 +864,16 @@ window.onload = function asyncFooter() + + + + + + \ No newline at end of file diff --git a/front/php/templates/language/en_us.php b/front/php/templates/language/en_us.php index 958ed55d..d205b501 100755 --- a/front/php/templates/language/en_us.php +++ b/front/php/templates/language/en_us.php @@ -72,6 +72,7 @@ $lang['en_us'] = array( 'Device_TableHead_LastSession' => 'Last Session', 'Device_TableHead_LastIP' => 'Last IP', 'Device_TableHead_MAC' => 'MAC', +'Device_TableHead_MAC_full' => 'Full MAC', 'Device_TableHead_LastIPOrder' => 'Last IP Order', 'Device_TableHead_Rowid' => 'Rowid', 'Device_TableHead_Status' => 'Status', @@ -252,6 +253,7 @@ $lang['en_us'] = array( 'Maintenance_Tools_Tab_Tools' => 'Tools', 'Maintenance_Tools_Tab_BackupRestore' => 'Backup / Restore', 'Maintenance_Tools_Tab_Logging' => 'Logs', +'Maintenance_Tool_displayed_columns_text' => 'Which columns should be displayed in the Devices page.', 'Maintenance_Tool_darkmode' => 'Toggle Modes (Dark/Light)', 'Maintenance_Tool_darkmode_text' => 'Toggle between dark mode and light mode. If the switch does not work properly, try to clear the browser cache. The change takes place on the server side, so it affects all devices in use.', 'Maintenance_Tool_darkmode_noti' => 'Toggle Modes',