11135-Move js code from ui_print_datatable

pandora_console/godmode/agentes/planned_downtime.list.php

@@ -89,7 +89,7 @@ if (is_ajax() === true) {
             [
                 'id'                  => 'agent_modules_affected_planned_downtime',
                 'class'               => 'info_table',
-                'style'               => 'width: 99%',
+                'style'               => 'width: 100%',
                 'columns'             => $columns,
                 'column_names'        => $column_names,
                 'ajax_url'            => 'godmode/agentes/planned_downtime.list',

pandora_console/godmode/groups/tactical.php

@@ -187,7 +187,7 @@ try {
         [
             'id'                  => 'list_agents_tactical',
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $columnNames,
             'return'              => true,

pandora_console/godmode/update_manager/update_manager.history.php

@@ -50,7 +50,7 @@ try {
         [
             'id'                  => $tableId,
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $column_names,
             'ajax_url'            => 'include/ajax/update_manager',

pandora_console/include/class/AuditLog.class.php

@@ -178,7 +178,7 @@ class AuditLog extends HTML
                 [
                     'id'                  => $this->tableId,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/CalendarManager.class.php

@@ -1040,7 +1040,7 @@ class CalendarManager
                     'id'                  => 'templates_alerts_special_days',
                     'return'              => true,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => 'godmode/alerts/alert_special_days',

pandora_console/include/class/ConfigPEN.class.php

@@ -612,7 +612,7 @@ class ConfigPEN extends HTML
                     'id'                  => $tableId,
                     'return'              => true,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/CredentialStore.class.php

@@ -827,7 +827,7 @@ class CredentialStore extends Wizard
                 [
                     'id'                  => $this->tableId,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/Diagnostics.class.php

@@ -1579,7 +1579,7 @@ class Diagnostics extends Wizard
                         [
                             'id'                  => $tableId,
                             'class'               => 'info_table caption_table',
-                            'style'               => 'width: 99%',
+                            'style'               => 'width: 100%',
                             'columns'             => $columns,
                             'column_names'        => $columnNames,
                             'ajax_data'           => [
@@ -1591,6 +1591,7 @@ class Diagnostics extends Wizard
                             'no_sortable_columns' => [-1],
                             'caption'             => $title,
                             'print'               => true,
+                            'mini_csv'            => true,
                         ]
                     );
                 } else {

pandora_console/include/class/EventSound.class.php

@@ -320,7 +320,7 @@ class EventSound extends HTML
                     [
                         'id'                  => $this->tableId,
                         'class'               => 'info_table',
-                        'style'               => 'width: 99%',
+                        'style'               => 'width: 100%',
                         'columns'             => $columns,
                         'column_names'        => $column_names,
                         'ajax_url'            => $this->ajaxController,

pandora_console/include/class/SatelliteAgent.class.php

@@ -162,7 +162,7 @@ class SatelliteAgent extends HTML
                 [
                     'id'                  => $this->tableId,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/SatelliteCollection.class.php

@@ -142,7 +142,7 @@ class SatelliteCollection extends HTML
                 [
                     'id'                  => $this->tableId,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/SnmpConsole.class.php

@@ -326,7 +326,7 @@ class SnmpConsole extends HTML
                 [
                     'id'                  => $tableId,
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'columns'             => $columns,
                     'column_names'        => $column_names,
                     'ajax_url'            => $this->ajaxController,

pandora_console/include/class/TipsWindow.class.php

@@ -452,7 +452,7 @@ class TipsWindow
                 [
                     'id'                  => 'list_tips_windows',
                     'class'               => 'info_table',
-                    'style'               => 'width: 99%',
+                    'style'               => 'width: 100%',
                     'dom_elements'        => 'lpfti',
                     'filter_main_class'   => 'box-flat white_table_graph fixed_filter_bar',
                     'columns'             => $columns,

pandora_console/include/functions_ui.php

@@ -3461,28 +3461,71 @@ function ui_progress_extend(
  * Generate needed code to print a datatables jquery plugin.
  *
  * @param array $parameters All desired data using following format:
- * [
+ *
- *   'print' => true (by default printed)
+ * ```php
- *   'id' => datatable id.
+ * $parameters = [
- *   'class' => datatable class.
+ * // JS Parameters
- *   'style' => datatable style.
+ * 'serverside' => true,
- *   'order' => [
+ * 'paging' => true,
- *      'field' => column name
+ * 'default_pagination' => $config['block_size'],
- *      'direction' => asc or desc
+ * 'searching' => false,
- *    ],
+ * 'dom_elements' => "plfrtiB",
- *   'default_pagination' => integer, default pagination is set to block_size
+ * 'pagination_options' => [default_pagination, 5, 10, 20, 100, 200, 500, 1000, "All"],
- *   'ajax_url' => 'include/ajax.php'  ajax_url.
+ * 'ordering' => true,
- *   'ajax_data' => [ operation => 1 ] extra info to be sent.
+ * 'order' => [[0, "asc"]], //['field' => 'column_name', 'direction' => 'asc/desc']
- *   'ajax_postprocess' => a javscript function to postprocess data received
+ * 'zeroRecords' => "No matching records found",
- *                         by ajax call. It is applied foreach row and must
+ * 'emptyTable' => "No data available in table",
- *                         use following format:
+ * 'no_sortable_columns' => [], //Allows the column name (db) from "columns" parameter
- * * [code]
+ * 'csv_field_separator' => ",",
- * * function (item) {
+ * 'csv_header' => true,
- * *       // Process received item, for instance, name:
+ * 'mini_csv' => false,
- * *       tmp = '<span class=label>' + item.name + '</span>';
+ * 'mini_pagination' => false,
- * *       item.name = tmp;
+ * 'mini_search' => false,
- * *   }
+ * 'drawCallback' => undefined, //'console.log(123),'
- * * [/code]
+ * 'data_element' => undefined, //Rows processed
+ * 'ajax_postprocess' => undefined, //'process_datatables_item(item)'
+ * 'ajax_data' => undefined, //Extra data to be sent ['field1' => 1, 'field2 => 0]
+ * 'ajax_url' => undefined,
+ * 'caption' => undefined,
+ *
+ * // PHP Parameters
+ * 'id' => undefined, //Used for table and form id,
+ * 'columns' =>,
+ * 'column_names' =>,
+ * 'filter_main_class' =>,
+ * 'toggle_collapsed' =>true,
+ * 'search_button_class' => 'sub filter',
+ * 'csv' =>=1,
+ * 'form' =>
+ * ..[
+ * ....'id'            => $form_id,
+ * ....'class'         => 'flex-row',
+ * ....'style'         => 'width: 100%,',
+ * ....'js'            => '',
+ * ....'html'          => $filter,
+ * ....'inputs'        => [],
+ * ....'extra_buttons' => $buttons,
+ * ..],
+ * 'no_toggle'     => false,
+ * 'form_html' => undefined,
+ * 'toggle_collapsed' => true,
+ * 'class' => "", //Datatable class.
+ * 'style' => "" ,//Datatable style.
+ * 'return' => false,
+ * 'print' => true,
+ * ]
+ *
+ * ```
+ *
+ * ```php
+ * ajax_postprocess => a javscript function to postprocess data received
+ *                        by ajax call. It is applied foreach row and must
+ *                        use following format:
+ * function (item) {
+ *       // Process received item, for instance, name:
+ *       tmp = '<span class=label>' + item.name + '</span>';
+ *       item.name = tmp;
+ *   }
  *   'columns_names' => [
  *      'column1'  :: Used as th text. Direct text entry. It could be array:
  *      OR
@@ -3499,7 +3542,6 @@ function ui_progress_extend(
  *      'column2',
  *      ...
  *   ],
- *   'no_sortable_columns' => [ indexes ] 1,2... -1 etc. Avoid sorting.
  *   'form' => [
  *      'html' => 'html code' a directly defined inputs in HTML.
  *      'extra_buttons' => [
@@ -3531,12 +3573,7 @@ function ui_progress_extend(
  *      ]
  *   ],
  *   'extra_html' => HTML content to be placed after 'filter' section.
- *   'drawCallback' => function to be called after draw. Sample in:
+ * ```
- *            https://datatables.net/examples/advanced_init/row_grouping.html
- * ]
- *   'zeroRecords' => Message when zero records obtained from filter.(Leave blank for default).
- *   'emptyTable' => Message when table data empty.(Leave blank for default).
- * End.
  *
  * @return string HTML code with datatable.
  * @throws Exception On error.
@@ -3553,6 +3590,9 @@ function ui_print_datatable(array $parameters)
         $form_id = uniqid('datatable_filter_');
     }
 
+    $parameters['table_id'] = $table_id;
+    $parameters['form_id'] = $form_id;
+
     if (!isset($parameters['columns']) || !is_array($parameters['columns'])) {
         throw new Exception('[ui_print_datatable]: You must define columns for datatable');
     }
@@ -3572,10 +3612,6 @@ function ui_print_datatable(array $parameters)
         $parameters['default_pagination'] = $config['block_size'];
     }
 
-    if (!isset($parameters['paging'])) {
-        $parameters['paging'] = true;
-    }
-
     if (!isset($parameters['filter_main_class'])) {
         $parameters['filter_main_class'] = '';
     }
@@ -3584,13 +3620,9 @@ function ui_print_datatable(array $parameters)
         $parameters['toggle_collapsed'] = true;
     }
 
-    $no_sortable_columns = json_encode([]);
-    if (isset($parameters['no_sortable_columns'])) {
-        $no_sortable_columns = json_encode($parameters['no_sortable_columns']);
-    }
-
     if (!is_array($parameters['order'])) {
-        $order = '0, "asc"';
+        $order = 0;
+        $direction = 'asc';
     } else {
         if (!isset($parameters['order']['direction'])) {
             $direction = 'asc';
@@ -3609,45 +3641,35 @@ function ui_print_datatable(array $parameters)
             }
         }
 
-        $order .= ', "'.$parameters['order']['direction'].'"';
+        $direction = $parameters['order']['direction'];
     }
 
-    if (!isset($parameters['ajax_data'])) {
+    $parameters['order']['order'] = $order;
-        $parameters['ajax_data'] = '';
+    $parameters['order']['direction'] = $direction;
+
+    foreach ($parameters['no_sortable_columns'] as $key => $find) {
+        $found = array_search(
+            $parameters['no_sortable_columns'][$key],
+            $parameters['columns']
+        );
+
+        if ($found !== false) {
+            unset($parameters['no_sortable_columns'][$key]);
+            array_push($parameters['no_sortable_columns'], $found);
+        }
+
+        if (is_int($parameters['no_sortable_columns'][$key]) === false) {
+            unset($parameters['no_sortable_columns'][$key]);
+        }
     }
 
-    $search_button_class = 'sub filter';
+    $parameters['csvTextInfo'] = __('Export current page to CSV');
+    $parameters['csvFileTitle'] = sprintf(__('export_%s_current_page_%s'), $table_id, date('Y-m-d'));
+
     if (isset($parameters['search_button_class'])) {
         $search_button_class = $parameters['search_button_class'];
-    }
-
-    if (isset($parameters['pagination_options'])) {
-        $pagination_options = $parameters['pagination_options'];
     } else {
-        $pagination_options = [
+        $search_button_class = 'sub filter';
-            [
-                $parameters['default_pagination'],
-                5,
-                10,
-                25,
-                100,
-                200,
-                500,
-                1000,
-                -1,
-            ],
-            [
-                $parameters['default_pagination'],
-                5,
-                10,
-                25,
-                100,
-                200,
-                500,
-                1000,
-                'All',
-            ],
-        ];
     }
 
     if (isset($parameters['datacolumns']) === false
@@ -3660,16 +3682,12 @@ function ui_print_datatable(array $parameters)
         $parameters['csv'] = 1;
     }
 
-    $dom_elements = '"plfrtiB"';
-    if (isset($parameters['dom_elements'])) {
-        $dom_elements = '"'.$parameters['dom_elements'].'"';
-    }
-
     $filter = '';
     // Datatable filter.
     if (isset($parameters['form']) && is_array($parameters['form'])) {
         if (isset($parameters['form']['id'])) {
             $form_id = $parameters['form']['id'];
+            $parameters['form_id'] = $form_id;
         }
 
         if (isset($parameters['form']['class'])) {
@@ -3787,10 +3805,13 @@ function ui_print_datatable(array $parameters)
         )
     );
     $processing .= '</div>';
+    $parameters['processing'] = $processing;
 
     $zeroRecords = isset($parameters['zeroRecords']) === true ? $parameters['zeroRecords'] : __('No matching records found');
     $emptyTable = isset($parameters['emptyTable']) === true ? $parameters['emptyTable'] : __('No data available in table');
 
+    $parameters['zeroRecords'] = $zeroRecords;
+    $parameters['emptyTable'] = $emptyTable;
     // Extra html.
     $extra = '';
     if (isset($parameters['extra_html']) && !empty($parameters['extra_html'])) {
@@ -3799,8 +3820,8 @@ function ui_print_datatable(array $parameters)
 
     // Base table.
     $table = '<table id="'.$table_id.'" ';
-    $table .= 'class="'.$parameters['class'].' invisible"';
+    $table .= 'class="'.$parameters['class'].'"';
-    $table .= 'style="'.$parameters['style'].'">';
+    $table .= 'style="box-sizing: border-box;'.$parameters['style'].'">';
     $table .= '<thead><tr class="datatables_thead_tr">';
 
     if (isset($parameters['column_names'])
@@ -3827,335 +3848,60 @@ function ui_print_datatable(array $parameters)
     }
 
     $table .= '</tr></thead>';
-
-    if (isset($parameters['data_element']) === true) {
-        $table .= '<tbody>';
-        foreach ($parameters['data_element'] as $row) {
-            $table .= '<tr>';
-            foreach ($row as $td_data) {
-                $table .= '<td>'.$td_data.'</td>';
-            }
-
-            $table .= '</tr>';
-        }
-
-        $table .= '</tbody>';
-
-        $js = '<script>
-            $.fn.dataTable.ext.classes.sPageButton = "pandora_pagination mini-pandora-pagination"
-            var table = $("#'.$table_id.'").DataTable({
-                "dom": "'.$parameters['dom_elements'].'"
-            });
-            $("div.spinner-fixed").hide();
-            $("table#'.$table_id.'").removeClass("invisible");
-            $("#'.$table_id.'_filter > label > input").addClass("mini-search-input");
-            if (table.page.info().pages == 1) {
-                $("#'.$table_id.'_paginate").hide();
-            }
-        </script>';
-    }
-
     $table .= '</table>';
 
-    $pagination_class = 'pandora_pagination';
+    $parameters['ajax_url_full'] = ui_get_full_url('ajax.php', false, false, false);
-    if (!empty($parameters['pagination_class'])) {
+
-        $pagination_class = $parameters['pagination_class'];
+    $parameters['spinnerLoading'] = html_print_image(
+        'images/spinner.gif',
+        true,
+        [
+            'id'    => $form_id.'_loading',
+            'class' => 'loading-search-datatables-button',
+        ]
+    );
+
+    $language = substr(get_user_language(), 0, 2);
+    if (is_metaconsole() === false) {
+        $parameters['language'] = 'include/javascript/i18n/dataTables.'.$language.'.json';
+    } else {
+        $parameters['language'] = '../../include/javascript/i18n/dataTables.'.$language.'.json';
     }
 
-    $columns = '';
+    $parameters['phpDate'] = date('Y-m-d');
-    for ($i = 1; $i <= (count($parameters['columns']) - 3); $i++) {
+    $parameters['dataElements'] = json_encode($parameters['data_element']);
-        if ($i != (count($parameters['columns']) - 3)) {
+
-            $columns .= $i.',';
+    // * START JAVASCRIPT.
-        } else {
+    if (is_metaconsole() === false) {
-            $columns .= $i;
+        $file_path = ui_get_full_url('include/javascript/datatablesFunction.js');
-        }
+    } else {
+        $file_path = ui_get_full_url('../../include/javascript/datatablesFunction.js');
     }
 
-    $export_columns = '';
+    $file_content = file_get_contents($file_path);
-    if (isset($parameters['csv_exclude_latest']) === true
+    $json_data = json_encode($parameters);
-        && $parameters['csv_exclude_latest'] === true
+    $json_config = json_encode($config);
-    ) {
-        $export_columns = ',columns: \'th:not(:last-child)\'';
-    }
 
-    if (isset($parameters['data_element']) === false || isset($parameters['print_pagination_search_csv'])) {
+    $js = '<script>';
-        if (isset($parameters['ajax_url'])) {
+    $js .= 'var dt = '.$json_data.';';
-            $type_data = 'ajax: {
+    $js .= 'var config = '.$json_config.';';
-                url: "'.ui_get_full_url('ajax.php', false, false, false).'",
+    $js .= '</script>';
-                type: "POST",
-                dataSrc: function (json) {
-                    if($("#'.$form_id.'_search_bt") != undefined) {
-                        $("#'.$form_id.'_loading").remove();
-                    }
 
-                    if (json.error) {
+    $js .= '<script>';
-                        console.error(json.error);
+    $js .= 'function '.$table_id.'(dt, config) {  ';
-                        $("#error-'.$table_id.'").html(json.error);
+    $js .= $file_content;
-                        $("#error-'.$table_id.'").dialog({
+    $js .= '}';
-                            title: "Filter failed",
+    $js .= $table_id.'(dt, config)';
-                            width: 630,
+    $js .= '</script>';
-                            resizable: true,
+    // * END JAVASCRIPT.
-                            draggable: true,
-                            modal: false,
-                            closeOnEscape: true,
-                            buttons: {
-                                "Ok" : function () {
-                                    $(this).dialog("close");
-                                }
-                            }
-                        }).parent().addClass("ui-state-error");
-                    } else {';
-
-            if (isset($parameters['ajax_return_operation']) === true
-                && empty($parameters['ajax_return_operation']) === false
-                && isset($parameters['ajax_return_operation_function']) === true
-                && empty($parameters['ajax_return_operation_function']) === false
-            ) {
-                $type_data .= '
-            if (json.'.$parameters['ajax_return_operation'].' !== undefined) {
-                '.$parameters['ajax_return_operation_function'].'(json.'.$parameters['ajax_return_operation'].');
-            }
-        ';
-            }
-
-            if (isset($parameters['ajax_postprocess'])) {
-                $type_data .= '
-                    if (json.data) {
-                        json.data.forEach(function(item) {
-                            '.$parameters['ajax_postprocess'].'
-                        });
-                    } else {
-                        json.data = {};
-                    }';
-            }
-
-            $type_data .= '
-                        return json.data;
-                    }
-                },
-                data: function (data) {
-                    if($("#button-'.$form_id.'_search_bt") != undefined) {
-                        var loading = \''.html_print_image(
-                        'images/spinner.gif',
-                        true,
-                        [
-                            'id'    => $form_id.'_loading',
-                            'class' => 'loading-search-datatables-button',
-                        ]
-                    ).'\';
-                        $("#button-'.$form_id.'_search_bt").parent().append(loading);
-                    }
-
-                    inputs = $("#'.$form_id.' :input");
-
-                    values = {};
-                    inputs.each(function() {
-                        values[this.name] = $(this).val();
-                    })
-
-                    $.extend(data, {
-                        filter: values,'."\n";
-
-            if (is_array($parameters['ajax_data'])) {
-                foreach ($parameters['ajax_data'] as $k => $v) {
-                    $type_data .= $k.':'.json_encode($v).",\n";
-                }
-            }
-
-            $type_data .= 'page: "'.$parameters['ajax_url'].'"
-                    });
-
-                    return data;
-                }
-            },';
-        } else {
-            $type_data = 'data: '.json_encode($parameters['data_element']).',';
-        }
-
-        $serverside = 'true';
-        if (isset($parameters['data_element'])) {
-            $serverside = 'false';
-        }
-
-        // Javascript controller.
-        $js = '<script type="text/javascript">
-        $(document).ready(function(){
-            $.fn.dataTable.ext.errMode = "none";
-            $.fn.dataTable.ext.classes.sPageButton = "'.$pagination_class.'";
-
-            var settings_datatable = {
-                drawCallback: function(settings) {';
-
-        if (!isset($parameters['data_element'])) {
-            $js .= 'if (dt_'.$table_id.'.page.info().pages > 1) {
-                        $("#'.$table_id.'_wrapper > .dataTables_paginate.paging_simple_numbers").show()
-                    } else {
-                        $("#'.$table_id.'_wrapper > .dataTables_paginate.paging_simple_numbers").hide()
-                    }';
-        }
-
-        $js .= 'if ($("#'.$table_id.' tr td").length == 1) {
-                    $(".datatable-msg-info-'.$table_id.'").show();
-                    $(".datatable-msg-info-'.$table_id.'").removeClass(\'invisible_important\');
-                    $("table#'.$table_id.'").hide();
-                    $("div.dataTables_paginate").hide();
-                    $("div.dataTables_info").hide();
-                    $("div.dataTables_length").hide();
-                    $("div.dt-buttons").hide();
-
-                    if (dt_'.$table_id.'.page.info().pages > 1) {
-                        $(".dataTables_paginate.paging_simple_numbers").show()
-                    }
-                } else {
-                    $(".datatable-msg-info-'.$table_id.'").hide();
-                    $("table#'.$table_id.'").show();
-                    $("div.dataTables_paginate").show();
-                    $("div.dataTables_info").show();
-                    $("div.dataTables_length").show();
-                    $("div.dt-buttons").show();
-
-                    if (dt_'.$table_id.'.page.info().pages == 1) {
-                        $(".dataTables_paginate.paging_simple_numbers").hide()
-                    }
-                }';
-
-        if (isset($parameters['drawCallback'])) {
-            $js .= $parameters['drawCallback'];
-        }
-
-        $searching = 'false';
-        if (isset($parameters['searching']) && $parameters['searching'] === true) {
-            $searching = 'true';
-        }
-
-        $ordering = 'true';
-        if (isset($parameters['ordering']) && $parameters['ordering'] === false) {
-            $ordering = 'false';
-        }
-
-        $js .= '},';
-
-        $languaje = substr(get_user_language(), 0, 2);
-
-        $js .= '
-                processing: true,
-                serverSide: '.$serverside.',
-                paging: '.$parameters['paging'].',
-                pageLength: '.$parameters['default_pagination'].',
-                searching: '.$searching.',
-                responsive: true,
-                dom: '.$dom_elements.',
-                language: {
-                    url: "/pandora_console/include/javascript/i18n/dataTables.'.$languaje.'.json",
-                    processing:"'.$processing.'",
-                    zeroRecords:"'.$zeroRecords.'",
-                    emptyTable:"'.$emptyTable.'",
-                },
-                buttons: '.$parameters['csv'].'== 1 ? [
-                    {
-                        extend: "csv",
-                        text : "'.__('Export current page to CSV').'",
-                        titleAttr: "'.__('Export current page to CSV').'",
-                        title: "export_'.$parameters['id'].'_current_page_'.date('Y-m-d').'",
-                        fieldSeparator: "'.$config['csv_divider'].'",
-                        action: function ( e, dt, node, config ) {
-                            blockResubmit(node);
-                            // Call the default csvHtml5 action method to create the CSV file
-                            $.fn.dataTable.ext.buttons.csvHtml5.action.call(this, e, dt, node, config);
-                        },
-                        exportOptions : {
-                            modifier : {
-                                // DataTables core
-                                order : "current",
-                                page : "All",
-                                search : "applied"
-                            }'.$export_columns.'
-                        },
-                    }
-                ] : [],
-                lengthMenu: '.json_encode($pagination_options).',
-                columnDefs: [
-                    { className: "no-class", targets: "_all" },
-                    { bSortable: false, targets: '.$no_sortable_columns.' }
-                ],
-                ordering: '.$ordering.',
-                initComplete: function(settings, json) {
-                    // Move elements to table_action_buttons bar.
-                    $(".action_buttons_right_content").html("<div class=\"pagination-child-div\"></div>");
-                    $(".action_buttons_right_content").html("<div class=\"pagination-child-div\"></div>");
-                    $(".action_buttons_right_content").html("<div class=\"pagination-child-div\"></div>");
-                    $(".action_buttons_right_content").html("<div class=\"pagination-child-div\"></div>");
-
-                    $(".pagination-child-div").append($("#'.$table_id.'_wrapper > .dataTables_paginate.paging_simple_numbers"));
-                    $(".pagination-child-div").append($("#'.$table_id.'_wrapper > .dataTables_length"));
-                    $(".pagination-child-div").append($("#'.$table_id.'_wrapper > .dt-buttons"));
-                    $(".pagination-child-div").append($("#'.$table_id.'_wrapper > .dataTables_filter"));
-                    $("div.spinner-fixed").hide();
-                },
-                columns: [';
-
-        foreach ($parameters['datacolumns'] as $data) {
-            if (is_array($data)) {
-                $js .= '{data : "'.$data['text'].'",className: "'.$data['class'].'"},';
-            } else {
-                $js .= '{data : "'.$data.'",className: "no-class"},';
-            }
-        }
-
-                $js .= '
-                ],
-                order: [[ '.$order.' ]],';
-                $js .= $type_data;
-                $js .= '
-            };
-
-            dt_'.$table_id.' = $("#'.$table_id.'").DataTable(settings_datatable);
-
-            $("#button-'.$form_id.'_search_bt").click(function (){
-                dt_'.$table_id.'.draw().page(0)
-            });
-            ';
-
-        if (isset($parameters['caption']) === true
-            && empty($parameters['caption']) === false
-        ) {
-            $js .= '$("#'.$table_id.'").append("<caption>'.$parameters['caption'].'</caption>");';
-            $js .= '$(".datatables_thead_tr").css("height", 0);';
-        }
-
-        if (isset($parameters['csv']) === true) {
-            $js."'$('#".$table_id."').on( 'buttons-processing', function ( e, indicator ) {
-                if ( indicator ) {
-                    console.log('a');
-                }
-                else {
-                    console.log('b');
-                }";
-        }
-
-        $js .= '$("table#'.$table_id.'").removeClass("invisible");
-            });';
-        $js .= '
-        $(function() {
-            $(document).on("preInit.dt", function (ev, settings) {
-                $("div.dataTables_length").hide();
-                $("div.dt-buttons").hide();
-            });
-        });
-
-        ';
-
-        $js .= '</script>';
-    }
-
-    // Order.
     $info_msg_arr = [];
     $info_msg_arr['message'] = $emptyTable;
     $info_msg_arr['div_class'] = 'info_box_container invisible_important datatable-msg-info-'.$table_id;
 
-    $spinner = '<div class="spinner-fixed"><span></span><span></span><span></span><span></span></div>';
+    $spinner = '<div id="'.$table_id.'-spinner" class="spinner-fixed"><span></span><span></span><span></span><span></span></div>';
 
     $info_msg = '<div>'.ui_print_info_message($info_msg_arr).'</div>';
+
     $err_msg = '<div id="error-'.$table_id.'"></div>';
     $output = $info_msg.$err_msg.$filter.$extra.$spinner.$table.$js;
     if (is_ajax() === false) {
@@ -4179,7 +3925,7 @@ function ui_print_datatable(array $parameters)
             false,
             false
         );
-        $output .= '?v='.$config['current_package'].'"/>';
+        $output .= '"/>';
         // Load tables.css.
         $output .= '<link rel="stylesheet" href="';
         $output .= ui_get_full_url(

pandora_console/include/javascript/datatablesFunction.js

@@ -0,0 +1,377 @@
+var dt = dt;
+var config = config;
+
+var datacolumns = [];
+var datacolumnsTemp = [];
+dt.datacolumns.forEach(column => {
+  if (typeof column !== "string") {
+    datacolumnsTemp = { data: column.text, className: column.class };
+    datacolumns.push(datacolumnsTemp);
+  } else {
+    datacolumnsTemp = { data: column, className: "no-class" };
+    datacolumns.push(datacolumnsTemp);
+  }
+});
+
+var paginationClass = "pandora_pagination";
+if (typeof dt.pagination_class !== "undefined") {
+  paginationClass = dt.pagination_class;
+}
+
+var processing = "";
+if (typeof dt.processing === "undefined") {
+  processing = dt.processing;
+}
+
+var ajaxReturn = "";
+var ajaxReturnFunction = "";
+if (
+  typeof dt.ajax_return_operation !== "undefined" &&
+  dt.ajax_return_operation !== "" &&
+  typeof dt.ajax_return_operation_function !== "undefined" &&
+  dt.ajax_return_operation_function !== ""
+) {
+  ajaxReturn = dt.ajax_return_operation;
+  ajaxReturnFunction = dt.ajax_return_operation_function;
+}
+
+var serverSide = true;
+if (typeof dt.data_element !== "undefined") {
+  serverSide = false;
+}
+
+var paging = true;
+if (typeof dt.paging !== "undefined") {
+  paging = dt.paging;
+}
+
+var pageLength = parseInt(dt.default_pagination);
+
+var searching = false;
+if (typeof dt.searching !== "undefined" && dt.searching === true) {
+  searching = dt.searching;
+}
+
+var dom = "plfrtiB";
+if (typeof dt.dom_elements !== "undefined") {
+  dom = dt.dom_elements;
+}
+
+var lengthMenu = [
+  [pageLength, 5, 10, 20, 100, 200, 500, 1000, -1],
+  [pageLength, 5, 10, 20, 100, 200, 500, 1000, "All"]
+];
+if (typeof dt.pagination_options !== "undefined") {
+  lengthMenu = dt.pagination_options;
+}
+
+var ordering = true;
+if (typeof dt.ordering !== "undefined" && dt.ordering === false) {
+  ordering = dt.ordering;
+}
+
+var order = [[0, "asc"]];
+if (typeof dt.order !== "undefined") {
+  order = [[dt.order.order, dt.order.direction]];
+}
+
+var zeroRecords = "";
+if (typeof dt.zeroRecords !== "undefined") {
+  zeroRecords = `${dt.zeroRecords}`;
+}
+
+var emptyTable = "";
+if (typeof dt.emptyTable !== "undefined") {
+  emptyTable = `${dt.emptyTable}`;
+}
+
+var no_sortable_columns = [];
+if (typeof dt.no_sortable_columns !== "undefined") {
+  no_sortable_columns = Object.values(dt.no_sortable_columns);
+}
+
+var columnDefs = [];
+if (typeof dt.columnDefs === "undefined") {
+  columnDefs = [
+    { className: "no-class", targets: "_all" },
+    { bSortable: false, targets: no_sortable_columns }
+  ];
+} else {
+  columnDefs = dt.columnDefs;
+}
+
+var csvClassName = "csv-button";
+if (dt.mini_csv === true) {
+  csvClassName = "mini-csv-button";
+}
+
+var csvFieldSeparator = ";";
+if (typeof dt.csv_field_separator !== "undefined") {
+  csvFieldSeparator = dt.csv_field_separator;
+}
+
+var csvHeader = true;
+if (dt.csv_header === false) {
+  csvHeader = false;
+}
+
+var csvExcludeLast = "";
+if (dt.csv_exclude_latest === true) {
+  csvExcludeLast = "th:not(:last-child)";
+}
+
+var ajaxData = "";
+if (typeof dt.ajax_data !== "undefined") {
+  ajaxData = dt.ajax_data;
+}
+
+$(document).ready(function() {
+  function checkPages() {
+    if (dt_table.page.info().pages > 1) {
+      $(
+        "div.pagination-child-div > .dataTables_paginate.paging_simple_numbers"
+      ).show();
+      $(`#${dt.id}_paginate`).show();
+    } else {
+      $(
+        "div.pagination-child-div > .dataTables_paginate.paging_simple_numbers"
+      ).hide();
+      $(`#${dt.id}_paginate`).hide();
+    }
+  }
+
+  function moveElementsToActionButtons() {
+    $(".action_buttons_right_content").html(
+      '<div class="pagination-child-div"></div>'
+    );
+    $(".pagination-child-div").append(
+      $(`#${dt.id}_wrapper > .dataTables_paginate.paging_simple_numbers`).attr(
+        "style",
+        "margin-right: 10px;"
+      )
+    );
+    $(".pagination-child-div").append(
+      $(`#${dt.id}_wrapper > .dataTables_length`)
+    );
+    $(".pagination-child-div").append($(`#${dt.id}_wrapper > .dt-buttons`));
+    $(".pagination-child-div").append(
+      $(`#${dt.id}_wrapper > .dataTables_filter`)
+    );
+  }
+
+  $.fn.dataTable.ext.errMode = "none";
+  $.fn.dataTable.ext.classes.sPageButton = paginationClass;
+
+  if (dt.mini_pagination === true) {
+    $.fn.dataTable.ext.classes.sPageButton = `${paginationClass} mini-pandora-pagination`;
+  }
+
+  var settings_datatable = {
+    processing: true,
+    responsive: true,
+    serverSide,
+    paging,
+    pageLength,
+    searching,
+    dom,
+    lengthMenu,
+    ordering,
+    order,
+    columns: eval(datacolumns),
+    columnDefs,
+    language: {
+      url: dt.language,
+      processing,
+      zeroRecords,
+      emptyTable
+    },
+    buttons:
+      dt.csv == 1
+        ? [
+            {
+              extend: "csv",
+              className: csvClassName,
+              text: dt.csvTextInfo,
+              titleAttr: dt.csvTextInfo,
+              title: dt.csvFileTitle,
+              fieldSeparator: csvFieldSeparator,
+              header: csvHeader,
+              action: function(e, dt, node, config) {
+                blockResubmit(node);
+                // Call the default csvHtml5 action method to create the CSV file
+                $.fn.dataTable.ext.buttons.csvHtml5.action.call(
+                  this,
+                  e,
+                  dt,
+                  node,
+                  config
+                );
+              },
+              exportOptions: {
+                modifier: {
+                  // DataTables core
+                  order: "current",
+                  page: "All",
+                  search: "applied"
+                },
+                columns: csvExcludeLast
+              }
+            }
+          ]
+        : [],
+    initComplete: function(settings, json) {
+      moveElementsToActionButtons();
+
+      checkPages();
+
+      $(`div#${dt.id}-spinner`).hide();
+    },
+    drawCallback: function(settings) {
+      if ($(`#${dt.id} tr td`).length == 1) {
+        $(`.datatable-msg-info-${dt.id}`)
+          .removeClass("invisible_important")
+          .show();
+        $(`table#${dt.id}`).hide();
+        $("div.pagination-child-div").hide();
+        $("div.dataTables_info").hide();
+        $(`#${dt.id}_wrapper`).hide();
+        $(`.action_buttons_right_content .pagination-child-div`).hide();
+      } else {
+        $(`.datatable-msg-info-${dt.id}`).hide();
+        $(`table#${dt.id}`).show();
+        $("div.pagination-child-div").show();
+        $("div.dataTables_info").show();
+        $(`#${dt.id}_wrapper`).show();
+
+        if (typeof dt.drawCallback !== "undefined") {
+          eval(dt.drawCallback);
+        }
+      }
+
+      $(`div#${dt.id}-spinner`).hide();
+
+      checkPages();
+    }
+  };
+
+  var ajaxOrData = {};
+  if (typeof dt.data_element == "undefined") {
+    ajaxOrData = {
+      ajax: {
+        url: dt.ajax_url_full,
+        type: "POST",
+        dataSrc: function(json) {
+          if ($(`#${dt.form_id}_search_bt`) != undefined) {
+            $(`#${dt.form_id}_loading`).remove();
+          }
+
+          if (json.error) {
+            console.error(json.error);
+            $(`#error-${dt.id}`).html(json.error);
+            $(`#error-${dt.id}`)
+              .dialog({
+                title: "Filter failed",
+                width: 630,
+                resizable: true,
+                draggable: true,
+                modal: false,
+                closeOnEscape: true,
+                buttons: {
+                  Ok: function() {
+                    $(this).dialog("close");
+                  }
+                }
+              })
+              .parent()
+              .addClass("ui-state-error");
+          } else {
+            if (json.ajaxReturn !== "undefined") {
+              eval(`${ajaxReturnFunction}(${json.ajaxReturn})`);
+            }
+
+            if (typeof dt.ajax_postprocess !== "undefined") {
+              if (json.data) {
+                json.data.forEach(function(item) {
+                  eval(dt.ajax_postprocess);
+                });
+              } else {
+                json.data = {};
+              }
+            }
+
+            return json.data;
+          }
+        },
+        data: function(data) {
+          $(`div#${dt.id}-spinner`).show();
+          if ($(`#button-${dt.form_id}_search_bt`) != undefined) {
+            var loading = `<img src="images/spinner.gif" id="${dt.form_id}_loading" class="loading-search-datatables-button" />`;
+            $(`#button-${dt.form_id}_search_bt`)
+              .parent()
+              .append(loading);
+          }
+
+          var inputs = $(`#${dt.form_id} :input`);
+
+          var values = {};
+          inputs.each(function() {
+            values[this.name] = $(this).val();
+          });
+
+          $.extend(data, ajaxData);
+
+          $.extend(data, {
+            filter: values,
+            page: dt.ajax_url
+          });
+
+          return data;
+        }
+      }
+    };
+  } else {
+    ajaxOrData = { data: dt.data_element };
+  }
+
+  $.extend(settings_datatable, ajaxOrData);
+  var dt_table = $(`#${dt.table_id}`).DataTable(settings_datatable);
+
+  $(`#button-${dt.form_id}_search_bt`).click(function() {
+    dt_table.draw().page(0);
+  });
+
+  if (typeof dt.caption !== "undefined" && dt.caption !== "") {
+    $(`#${dt.table_id}`).append(`<caption>${dt.caption}</caption>`);
+    $(".datatables_thead_tr").css("height", 0);
+  }
+
+  $(function() {
+    $(document).on("init.dt", function(ev, settings) {
+      if (dt.mini_search === true) {
+        $(`#${dt.id}_filter > label > input`).addClass("mini-search-input");
+      }
+
+      $("div.dataTables_length").show();
+      $("div.dataTables_filter").show();
+      $("div.dt-buttons").show();
+
+      if (dt_table.page.info().pages === 0) {
+        $(`.action_buttons_right_content .pagination-child-div`).hide();
+      }
+
+      if (dt_table.page.info().pages === 1) {
+        $(`div.pagination-child-div > #${dt.table_id}_paginate`).hide();
+      } else {
+        $(`div.pagination-child-div > #${dt.table_id}_paginate`).show();
+      }
+    });
+  });
+});
+
+$(function() {
+  $(document).on("preInit.dt", function(ev, settings) {
+    $(`#${dt.id}_wrapper  div.dataTables_length`).hide();
+    $(`#${dt.id}_wrapper  div.dataTables_filter`).hide();
+    $(`#${dt.id}_wrapper  div.dt-buttons`).hide();
+  });
+});

pandora_console/include/javascript/i18n/dataTables.en.json

@@ -6,7 +6,6 @@
     "infoThousands": ",",
     "lengthMenu": "Show _MENU_ entries",
     "loadingRecords": "Loading...",
-    "processing": "Processing...",
     "search": "Search:",
     "zeroRecords": "No matching records found",
     "thousands": ",",

pandora_console/include/lib/Dashboard/Widgets/DataMatrix.php

@@ -520,7 +520,7 @@ class DataMatrix extends Widget
                     [
                         'id'                  => $tableId,
                         'class'               => 'info_table',
-                        'style'               => 'width: 99%',
+                        'style'               => 'width: 100%',
                         'columns'             => $columns,
                         'column_names'        => $column_names,
                         'ajax_url'            => 'include/ajax/module',

pandora_console/include/lib/Dashboard/Widgets/ModulesByStatus.php

@@ -416,7 +416,7 @@ class ModulesByStatus extends Widget
                     [
                         'id'                 => $tableId,
                         'class'              => 'info_table align-left-important',
-                        'style'              => 'width: 99%',
+                        'style'              => 'width: 100%',
                         'columns'            => $columns,
                         'column_names'       => $column_names,
                         'ajax_url'           => 'include/ajax/module',

pandora_console/include/styles/form.css

@@ -365,3 +365,7 @@ form#modal_form_feedback > ul > li > textarea {
 form#modal_form_feedback > ul > li:not(:first-child) > label {
   margin-top: 20px !important;
 }
+
+table.dataTable {
+  box-sizing: border-box !important;
+}

pandora_console/include/styles/pandora.css

@@ -11854,7 +11854,7 @@ span.help_icon_15px > img {
 /* ==== Spinner ==== */
 .spinner-fixed {
   position: absolute;
-  left: 40%;
+  left: 45%;
   top: 40%;
   z-index: 1;
   width: 100px;
@@ -11864,6 +11864,7 @@ span.help_icon_15px > img {
   animation: animate 1.2s linear infinite;
   margin: auto;
   margin-bottom: 40px;
+  text-align: initial;
 }
 .spinner-fixed span {
   position: absolute;

pandora_console/include/styles/tables.css

@@ -378,15 +378,35 @@ a.pandora_pagination.current:hover {
   cursor: pointer;
 }
 
+.dt-button.buttons-csv.buttons-html5.mini-csv-button {
+  background-image: url(../../images/file-csv.svg);
+  background-position: 4px center;
+  height: 26px;
+  width: 31px;
+  margin-left: 10px;
+  box-shadow: 0px 0px 0px #00000000;
+  border: 0px;
+  border-radius: 0px;
+}
+
 .dt-button.buttons-csv.buttons-html5:hover {
   color: #1d7873 !important;
   border: 2px solid #1d7873 !important;
 }
 
+.dt-button.buttons-csv.buttons-html5.mini-csv-button:hover {
+  color: #00000000 !important;
+  border: 0px !important;
+}
+
 .dt-button.buttons-csv.buttons-html5:before {
   content: "csv";
 }
 
+.dt-button.buttons-csv.buttons-html5.mini-csv-button:before {
+  content: "";
+}
+
 .dt-button.buttons-csv.buttons-html5 span {
   font-size: 0;
 }

pandora_console/operation/agentes/alerts_status.php

@@ -355,7 +355,7 @@ if ($agent_view_page === true) {
         [
             'id'                  => 'alerts_status_datatable',
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $column_names,
             'no_sortable_columns' => $no_sortable_columns,

pandora_console/operation/events/events.php

@@ -2503,7 +2503,7 @@ try {
                 [
                     'id'                             => $table_id,
                     'class'                          => 'info_table events',
-                    'style'                          => 'width: 99%;',
+                    'style'                          => 'width: 100%;',
                     'ajax_url'                       => 'operation/events/events',
                     'ajax_data'                      => [
                         'get_events' => 1,

pandora_console/operation/inventory/inventory.php

@@ -801,7 +801,7 @@ if ($inventory_module !== 'basic') {
                             [
                                 'id'                  => $id_table,
                                 'class'               => 'info_table',
-                                'style'               => 'width: 99%',
+                                'style'               => 'width: 100%',
                                 'columns'             => $columns,
                                 'column_names'        => $columns,
                                 'no_sortable_columns' => [],
@@ -912,7 +912,7 @@ if ($inventory_module !== 'basic') {
                             [
                                 'id'                  => $id_table,
                                 'class'               => 'info_table',
-                                'style'               => 'width: 99%',
+                                'style'               => 'width: 100%',
                                 'columns'             => $columns,
                                 'column_names'        => $columns,
                                 'no_sortable_columns' => [],
@@ -1073,7 +1073,7 @@ if ($inventory_module !== 'basic') {
                         [
                             'id'                  => $id_table,
                             'class'               => 'info_table w100p',
-                            'style'               => 'width: 99%',
+                            'style'               => 'width: 100%',
                             'columns'             => $columns,
                             'column_names'        => $columns,
                             'no_sortable_columns' => [],
@@ -1163,7 +1163,7 @@ if ($inventory_module !== 'basic') {
                         [
                             'id'                  => $id_table,
                             'class'               => 'info_table w100p',
-                            'style'               => 'width: 99%',
+                            'style'               => 'width: 100%',
                             'columns'             => $columns,
                             'column_names'        => $columns,
                             'no_sortable_columns' => [],
@@ -1178,6 +1178,8 @@ if ($inventory_module !== 'basic') {
                             'emptyTable'          => __('No inventory found'),
                             'return'              => true,
                             'no_sortable_columns' => [],
+                            'mini_search'         => true,
+                            'mini_pagination'     => true,
                         ]
                     );
 
@@ -1194,7 +1196,7 @@ if ($inventory_module !== 'basic') {
                         [
                             'id'                          => $id_table,
                             'class'                       => 'info_table w100p',
-                            'style'                       => 'width: 99%',
+                            'style'                       => 'width: 100%',
                             'columns'                     => $columns,
                             'column_names'                => $columns,
                             'no_sortable_columns'         => [],
@@ -1223,7 +1225,7 @@ if ($inventory_module !== 'basic') {
     $agentes = [];
     $data = [];
     $class = 'info_table';
-    $style = 'width: 99%';
+    $style = 'width: 100%';
     $ordering = true;
     $searching = false;
 

pandora_console/views/calendar/list.php

@@ -105,7 +105,7 @@ try {
         [
             'id'                  => $tableId,
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $column_names,
             'ajax_url'            => $ajax_url,

pandora_console/views/cluster/list.php

@@ -82,7 +82,7 @@ try {
         [
             'id'                  => $tableId,
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $column_names,
             'ajax_url'            => $model->ajaxController,

pandora_console/views/consoles/list.php

@@ -86,7 +86,7 @@ try {
         [
             'id'                  => $tableId,
             'class'               => 'info_table',
-            'style'               => 'width: 99%',
+            'style'               => 'width: 100%',
             'columns'             => $columns,
             'column_names'        => $column_names,
             'ajax_url'            => 'include/ajax/consoles.ajax',