Revisione JS datatables per inclusione footer in esportazione

assets/src/js/functions/datatables.js

@@ -38,34 +38,32 @@ function start_datatables() {
     start_local_datatables();
 
     $('.main-records').each(function () {
-        var $this = $(this);
+        const $this = $(this);
 
         // Controlla che la tabella non sia già inizializzata
         if (!$.fn.DataTable.isDataTable('#' + $this.attr('id'))) {
-            var id_module = $this.data('idmodule');
+            const id_module = $this.data('idmodule');
-            var id_plugin = $this.data('idplugin');
+            const id_plugin = $this.data('idplugin');
-            var id_parent = $this.data('idparent');
+            const id_parent = $this.data('idparent');
 
             // Parametri di ricerca da url o sessione
-            var search = getTableSearch();
+            const search = getTableSearch();
 
-            var column_search = [];
+            const column_search = [];
             $this.find("th").each(function () {
-                var id = $(this).attr('id').replace("th_", "");
+                const id = $(this).attr('id').replace("th_", "");
-                var single_value = search["search_" + id] ? search["search_" + id] : "";
+                const single_value = search["search_" + id] ? search["search_" + id] : "";
 
                 column_search.push({
                     "sSearch": single_value,
                 });
             });
 
-            var tempo_attesa_ricerche = (globals.tempo_attesa_ricerche * 1000);
-
             $this.on('preInit.dt', function (ev, settings) {
                 $('#mini-loader').show();
             });
 
-            var table = $this.DataTable({
+            const table = $this.DataTable({
                 language: globals.translations.datatables,
                 autoWidth: true,
                 dom: "ti",
@@ -97,9 +95,100 @@ function start_datatables() {
                     style: 'multi',
                     selector: 'td:first-child'
                 },
-                buttons: [
+                buttons: getDatatablesButtons($this),
+                scroller: {
+                    loadingIndicator: true,
+                    displayBuffer: globals.dataload_page_buffer,
+                },
+                ajax: {
+                    url: "ajax_dataload.php?id_module=" + id_module + "&id_plugin=" + id_plugin + "&id_parent=" + id_parent,
+                    type: 'GET',
+                    dataSrc: "data",
+                },
+                initComplete: initComplete,
+                drawCallback: drawCallback,
+                footerCallback: footerCallback,
+            });
+
+            table.on('processing.dt', function (e, settings, processing) {
+                if (processing) {
+                    $('#mini-loader').show();
+                } else {
+                    $('#mini-loader').hide();
+                }
+            })
+        }
+    });
+}
+
+/**
+ * Funzione per evitare il sorting al click della colonna.
+ * Utilizzata per evitare il sorting nelle ricerche.
+ * @param {*} e
+ */
+function stopTableSorting(e) {
+    if (!e) var e = window.event;
+    e.cancelBubble = true;
+    if (e.stopPropagation) e.stopPropagation();
+}
+
+/**
+ * Funzione per resettare il campo di ricerca in una specifica colonna.
+ * @param {string} type
+ */
+function resetTableSearch(type) {
+    if (type == null) $('[id^=th_] input').val('').trigger('keyup');
+    else $('[id^=th_' + type + '] input').val('').trigger('keyup');
+}
+
+/**
+ * Sostituisce i caratteri speciali per la ricerca attraverso le tabelle Datatables.
+ *
+ * @param {string} field
+ * @return string
+ */
+function searchFieldName(field) {
+    return field.replace(' ', '-').replace('.', '');
+}
+
+/**
+ * Salva nella sessione la ricerca per le tabelle Datatables.
+ *
+ * @param {int} module_id
+ * @param {string} field
+ * @param {mixed} value
+ */
+function searchTable(module_id, field, value) {
+    session_set('module_' + module_id + ',' + 'search_' + searchFieldName(field), value, 0);
+}
+
+/**
+ * Restituisce i valori di ricerca impostati nell'URL della pagina.
+ * @returns {{}}
+ */
+function getTableSearch() {
+    // Parametri di ricerca da url o sessione
+    const search = getUrlVars();
+
+    globals.search.forEach(function (value, index, array) {
+        if (search[array[index]] === undefined) {
+            search[array[index]] = array[value];
+        }
+    });
+
+    return search;
+}
+
+/**
+ * Restituisce i pulsanti da generare per la tabella Datatables.
+ * @returns
+ */
+function getDatatablesButtons(table) {
+    return [
+        // Pulsante di esportazione CSV
         {
             extend: 'csv',
+            footer: true,
             fieldSeparator: ";",
             exportOptions: {
                 modifier: {
@@ -115,31 +204,36 @@ function start_datatables() {
                 }
             }
         },
+        // Pulsante di esportazione tramite copia
         {
             extend: 'copy',
+            footer: true,
             exportOptions: {
                 modifier: {
                     selected: true
                 }
             }
         },
+        // Pulsante di esportazione via stampa della tabella
         {
             extend: 'print',
             autoPrint: true,
-                        footer: true,
+            footer: false, // Non funzionante in Firefox, e saltuarmente in Chrome
             customize: function (win) {
-                            $(win.document.body)
+                const datatable = getTable(table).datatable;
-                                .css('font-size', '10pt')
+
-                                .append(
+                const footer = datatable.table().footer().children[0];
-                                    '<table class="main-records table table-condensed table-bordered dataTable"><tfoot><tr><td></td><td class="pull-right">' + $('#summable').text() + '</td><td></td></tr></tfoot></table>'
+                console.log(footer);
-                                );
+
-                            $(win.document.body).find('table')
+                const body = $(win.document.body);
+                body.find('table')
                     .addClass('compact')
-                                .css('font-size', 'inherit');
+                    .css('font-size', 'inherit')
-                            $(win.document.body).find('td:first-child')
+                    .append(footer);
-                                .addClass('hide');
+
-                            $(win.document.body).find('th:first-child')
+                body.find('td:first-child, th:first-child')
                     .addClass('hide');
+
             },
             exportOptions: {
                 modifier: {
@@ -147,8 +241,10 @@ function start_datatables() {
                 }
             }
         },
+        // Pulsante di esportazione in formato Excel
         {
             extend: 'excel',
+            footer: true,
             exportOptions: {
                 modifier: {
                     selected: true
@@ -164,37 +260,32 @@ function start_datatables() {
                 }
             }
         },
+        // Pulsante di esportazione in formato PDF
         {
             extend: 'pdf',
+            footer: true,
             exportOptions: {
                 modifier: {
                     selected: true
                 }
             }
         },
-                ],
+    ];
-                scroller: {
+}
-                    loadingIndicator: true,
+
-                    displayBuffer: globals.dataload_page_buffer,
+function initComplete(settings) {
-                },
+    const api = this.api();
-                ajax: {
+    const search = getTableSearch();
-                    url: "ajax_dataload.php?id_module=" + id_module + "&id_plugin=" + id_plugin + "&id_parent=" + id_parent,
-                    type: 'GET',
-                    dataSrc: "data",
-                },
-                initComplete: function (settings) {
-                    var api = this.api();
-                    var search = getTableSearch();
 
     api.columns('.search').every(function () {
-                        var column = this;
+        const column = this;
 
         // Valore predefinito della ricerca
-                        var tempo;
+        let tempo;
-                        var header = $(column.header());
+        const header = $(column.header());
-                        var name = header.attr('id').replace('th_', '');
+        const name = header.attr('id').replace('th_', '');
 
-                        var value = search['search_' + name] ? search['search_' + name] : '';
+        const value = search['search_' + name] ? search['search_' + name] : '';
 
         $('<br><input type="text" style="width:100%" class="form-control' + (value ? ' input-searching' : '') + '" placeholder="' + globals.translations.filter + '..." value="' + value.replace(/"/g, '&quot;') + '"><i class="deleteicon fa fa-times fa-2x' + (value ? '' : ' hide') + '"></i>')
             .appendTo(column.header())
@@ -222,12 +313,14 @@ function start_datatables() {
                 }
 
                 // Impostazione delle sessioni per le ricerche del modulo e del campo specificati
-                                var module_id = $this.data('idmodule'); //+ "-" + $this.data('idplugin');
+                const module_id = $this.data('idmodule'); //+ "-" + $this.data('idplugin');
-                                var field = $(this).parent().attr('id').replace('th_', '');
+                const field = $(this).parent().attr('id').replace('th_', '');
-                                var value = $(this).val();
+                const value = $(this).val();
                 if (e.keyCode == 13 || $(this).val() == '') {
                     start_search(module_id, field, value);
                 } else {
+                    const tempo_attesa_ricerche = (globals.tempo_attesa_ricerche * 1000);
+
                     tempo = window.setTimeout(start_search, tempo_attesa_ricerche, module_id, field, value);
                 }
             });
@@ -246,9 +339,11 @@ function start_datatables() {
     $('.deleteicon').on("click", function (e) {
         resetTableSearch($(this).parent().attr("id").replace("th_", ""));
     });
-                },
+}
-                drawCallback: function (settings) {
+
-                    var api = new $.fn.dataTable.Api(settings);
+function drawCallback(settings) {
+    const table = getTable(settings.nTable);
+    const datatable = table.datatable;
 
     $(".dataTables_sizing .deleteicon").addClass('hide');
 
@@ -261,7 +356,7 @@ function start_datatables() {
     });
 
     $("[data-link]").each(function () {
-                        var $link = $(this);
+        const $link = $(this);
         $(this).parent().not('.bound').addClass('bound').click(function (event) {
             if ($link.data('type') === 'dialog') {
                 launch_modal(globals.translations.details, $link.data('link'));
@@ -273,18 +368,19 @@ function start_datatables() {
     });
 
     // Reimposto il flag sulle righe ricaricate selezionate in precedenza
-                    var selected = $this.data('selected') ? $this.data('selected').split(';') : [];
+    const selected = table.getSelectedRows();
-                    table.rows().every(function (rowIdx) {
+    datatable.rows().every(function (rowIdx) {
-                        if ($.inArray(this.id().toString(), selected) !== -1) {
+        if (selected.includes(this.id())) {
-                            table.row(':eq(' + rowIdx + ')', {
+            datatable.row(':eq(' + rowIdx + ')', {
                 page: 'current'
             }).select();
         }
     });
-                },
+}
-                footerCallback: function (row, data, start, end, display) {
+
-                    var i = -1;
+function footerCallback(row, data, start, end, display) {
-                    var json = this.api().ajax.json();
+    let i = -1;
+    const json = this.api().ajax.json();
 
     this.api().columns().every(function () {
         if (json.summable[i] !== undefined) {
@@ -295,68 +391,6 @@ function start_datatables() {
 
         i++;
     });
-                }
-            });
-
-            table.on('processing.dt', function (e, settings, processing) {
-                if (processing) {
-                    $('#mini-loader').show();
-                } else {
-                    $('#mini-loader').hide();
-                }
-            })
-        }
-    });
-}
-
-function stopTableSorting(e) {
-    if (!e) var e = window.event;
-    e.cancelBubble = true;
-    if (e.stopPropagation) e.stopPropagation();
-}
-
-function resetTableSearch(type) {
-    if (type == null) $('[id^=th_] input').val('').trigger('keyup');
-    else $('[id^=th_' + type + '] input').val('').trigger('keyup');
-}
-
-function reset(type) {
-    return resetTableSearch(type);
-}
-
-/**
- * Sostituisce i caratteri speciali per la ricerca attraverso le tabelle Datatables.
- *
- * @param string field
- *
- * @return string
- */
-function searchFieldName(field) {
-    return field.replace(' ', '-').replace('.', '');
-}
-
-/**
- * Salva nella sessione la ricerca per le tabelle Datatables.
- *
- * @param int module_id
- * @param string field
- * @param mixed value
- */
-function searchTable(module_id, field, value) {
-    session_set('module_' + module_id + ',' + 'search_' + searchFieldName(field), value, 0);
-}
-
-function getTableSearch() {
-    // Parametri di ricerca da url o sessione
-    var search = getUrlVars();
-
-    globals.search.forEach(function (value, index, array) {
-        if (search[array[index]] === undefined) {
-            search[array[index]] = array[value];
-        }
-    });
-
-    return search;
 }
 
 /**
@@ -425,13 +459,13 @@ function getTable(selector) {
 
             // Aggiornamento del footer nel caso sia richiesto
             if (globals.restrict_summables_to_selected) {
-                this.updateSelectedFooter();
+                this.updateFooterForSelectedRows();
             }
         },
         addSelectedRows: function (row_ids) {
             row_ids = Array.isArray(row_ids) ? row_ids : [row_ids];
             row_ids.forEach(function (item, index) {
-                selected.set(item, true);
+                selected.set(item.toString(), true);
             });
 
             this.saveSelectedRows();
@@ -439,7 +473,7 @@ function getTable(selector) {
         removeSelectedRows: function (row_ids) {
             row_ids = Array.isArray(row_ids) ? row_ids : [row_ids];
             row_ids.forEach(function (item, index) {
-                selected.delete(item);
+                selected.delete(item.toString());
             });
 
             this.saveSelectedRows();
@@ -449,12 +483,14 @@ function getTable(selector) {
             this.saveSelectedRows();
         },
 
-        // Aggiornamento dei campi summable
+        /**
-        updateSelectedFooter: function () {
+         * Nuovi valori dei campi summable
-            let datatable = this.datatable;
+         * @returns
+         */
+        getSelectedRowsFooter: function () {
             let ids = this.getSelectedRows();
 
-            $.ajax({
+            return $.ajax({
                 url: globals.rootdir + "/ajax.php",
                 type: "POST",
                 dataType: "json",
@@ -463,8 +499,17 @@ function getTable(selector) {
                     id_plugin: this.id_plugin,
                     op: "summable-results",
                     ids: ids,
+                }
+            });
         },
-                success: function (response) {
+
+        /**
+         * Aggiornamento dei campi summable
+         */
+        updateFooterForSelectedRows: function () {
+            let datatable = this.datatable;
+
+            this.getSelectedRowsFooter().then(function (response) {
                 for (let [column, value] of Object.entries(response)) {
                     let index = parseInt(column) + 1;
                     let sel = datatable.column(index).footer();
@@ -472,7 +517,6 @@ function getTable(selector) {
                         .attr("id", "summable")
                         .html(value);
                 }
-                }
             });
         },
     };