ricevute - fix loader bloccato

resources/views/layouts/app.blade.php

@@ -456,6 +456,57 @@
 
     @livewireScripts
 
+    <script>
+        function newexportaction(e, dt, button, config, cb) {
+            var self = this;
+            var oldStart = dt.settings()[0]._iDisplayStart;
+
+            dt.one('preXhr', function (e, s, data) {
+                data.start = 0;
+                data.length = 10000;
+            });
+
+            dt.one('preDraw', function (e, settings) {
+                if (button[0].className.includes('buttons-copy')) {
+                    $.fn.dataTable.ext.buttons.copyHtml5.action.call(self, e, dt, button, config, cb);
+                } else if (button[0].className.includes('buttons-excel')) {
+                    ($.fn.dataTable.ext.buttons.excelHtml5.available(dt, config) 
+                        ? $.fn.dataTable.ext.buttons.excelHtml5
+                        : $.fn.dataTable.ext.buttons.excelFlash
+                    ).action.call(self, e, dt, button, config, cb);
+                } else if (button[0].className.includes('buttons-csv')) {
+                    ($.fn.dataTable.ext.buttons.csvHtml5.available(dt, config)
+                        ? $.fn.dataTable.ext.buttons.csvHtml5
+                        : $.fn.dataTable.ext.buttons.csvFlash
+                    ).action.call(self, e, dt, button, config, cb);
+                } else if (button[0].className.includes('buttons-pdf')) {
+                    ($.fn.dataTable.ext.buttons.pdfHtml5.available(dt, config)
+                        ? $.fn.dataTable.ext.buttons.pdfHtml5
+                        : $.fn.dataTable.ext.buttons.pdfFlash
+                    ).action.call(self, e, dt, button, config, cb);
+                } else if (button[0].className.includes('buttons-print')) {
+                    $.fn.dataTable.ext.buttons.print.action.call(self, e, dt, button, config, cb);
+                }
+
+                // Ripristina la paginazione
+                dt.one('preXhr', function (e, s, data) {
+                    settings._iDisplayStart = oldStart;
+                    data.start = oldStart;
+                    data.length = s._iDisplayLength;
+                });
+
+                // Reload con callback (DataTables 2.x)
+                dt.ajax.reload(() => {
+                    if (typeof cb === 'function') cb();
+                }, false);
+
+                return false;
+            });
+            // Requery the server with the new one-time export settings
+            dt.ajax.reload();
+        };
+    </script>
+
     @stack('scripts')
 
     <script>
@@ -479,47 +530,6 @@
                 $(this).popover('hide');
             });
         });
-        function newexportaction(e, dt, button, config) {
-            var self = this;
-            var oldStart = dt.settings()[0]._iDisplayStart;
-            dt.one('preXhr', function (e, s, data) {
-                // Just this once, load all data from the server...
-                data.start = 0;
-                data.length = 10000;
-                dt.one('preDraw', function (e, settings) {
-                    // Call the original action function
-                    if (button[0].className.indexOf('buttons-copy') >= 0) {
-                        $.fn.dataTable.ext.buttons.copyHtml5.action.call(self, e, dt, button, config);
-                    } else if (button[0].className.indexOf('buttons-excel') >= 0) {
-                        $.fn.dataTable.ext.buttons.excelHtml5.available(dt, config) ?
-                            $.fn.dataTable.ext.buttons.excelHtml5.action.call(self, e, dt, button, config) :
-                            $.fn.dataTable.ext.buttons.excelFlash.action.call(self, e, dt, button, config);
-                    } else if (button[0].className.indexOf('buttons-csv') >= 0) {
-                        $.fn.dataTable.ext.buttons.csvHtml5.available(dt, config) ?
-                            $.fn.dataTable.ext.buttons.csvHtml5.action.call(self, e, dt, button, config) :
-                            $.fn.dataTable.ext.buttons.csvFlash.action.call(self, e, dt, button, config);
-                    } else if (button[0].className.indexOf('buttons-pdf') >= 0) {
-                        $.fn.dataTable.ext.buttons.pdfHtml5.available(dt, config) ?
-                            $.fn.dataTable.ext.buttons.pdfHtml5.action.call(self, e, dt, button, config) :
-                            $.fn.dataTable.ext.buttons.pdfFlash.action.call(self, e, dt, button, config);
-                    } else if (button[0].className.indexOf('buttons-print') >= 0) {
-                        $.fn.dataTable.ext.buttons.print.action(e, dt, button, config);
-                    }
-                    dt.one('preXhr', function (e, s, data) {
-                        // DataTables thinks the first item displayed is index 0, but we're not drawing that.
-                        // Set the property to what it was before exporting.
-                        settings._iDisplayStart = oldStart;
-                        data.start = oldStart;
-                    });
-                    // Reload the grid with the original page. Otherwise, API functions like table.cell(this) don't work properly.
-                    setTimeout(dt.ajax.reload, 0);
-                    // Prevent rendering of the full data to the DOM
-                    return false;
-                });
-            });
-            // Requery the server with the new one-time export settings
-            dt.ajax.reload();
-        };
     </script>
 
 </body>

resources/views/livewire/receipt.blade.php

@@ -83,52 +83,54 @@
     <section id="resume-table">
         <div class="compare--chart_wrapper d-none"></div>
 
-        <table class="table tablesaw tableHead tablesaw-stack table--lista_ricevute" id="tablesaw-350" width="100%">
-            <thead>
-                <tr>
-                    <th scope="col">Anno</th>
-                    <th scope="col">N°</th>
-                    <th scope="col">Cognome</th>
-                    <th scope="col">Nome</th>
-                    <th scope="col">Stato</th>
-                    <th scope="col">Data</th>
-                    <th scope="col">Importo</th>
-                    <th scope="col">...</th>
-                </tr>
-            </thead>
-            <tbody id="checkall-target">
-                @if(false)
-                    @foreach($records as $record)
-                        <tr>
-                            <td>{{$record->year}}</td>
-                            <td>{{$record->number}}</td>
-                            <td>{{$record->type == 'IN' ? ($record->member->last_name) : 'Uscita'}}</td>
-                            <td>{{$record->type == 'IN' ? ($record->member->first_name) : ''}}</td>
-                            <td>
-                                <span class="tablesaw-cell-content">
-                                    <span
-                                        class="badge tessera-badge {{$record->status == 1 ? 'active' : 'suspended'}}">{{$record->status == 1 ? 'Attivo' : 'Annullata'}}</span>
-                                </span>
-                            </td>
-                            <td>{{date("d/m/Y", strtotime($record->date))}}</td>
-                            <td>{{formatPrice($record->rows->sum('amount'))}}</td>
-                            <td>
-                                <button type="button" class="btn u"
-                                    onclick="document.location.href='/in?id={{$record->record_id}}'" data-bs-toggle="popover"
-                                    data-bs-trigger="hover focus" data-bs-placement="bottom"
-                                    data-bs-content="Visualizza ricevuta"><i class="fa-regular fa-eye"></i></button>
-                                <a target="_blank" class="btn  u" href="/receipt/{{$record->id}}" data-bs-toggle="popover"
-                                    data-bs-trigger="hover focus" data-bs-placement="bottom"
-                                    data-bs-content="Stampa ricevuta"><i class="fa-regular fa-file-lines"></i></a>
-                                <a target="_blank" class="btn u" onclick="sendMail({{$record->id}})"><i
-                                        class="fa-regular fa-envelope" data-bs-toggle="popover" data-bs-trigger="hover focus"
-                                        data-bs-placement="bottom" data-bs-content="Invia email"></i></a>
-                            </td>
-                        </tr>
-                    @endforeach
-                @endif
-            </tbody>
-        </table>
+        <div>
+            <table class="table tablesaw tableHead tablesaw-stack table--lista_ricevute" id="tablesaw-350" width="100%">
+                <thead>
+                    <tr>
+                        <th scope="col">Anno</th>
+                        <th scope="col">N°</th>
+                        <th scope="col">Cognome</th>
+                        <th scope="col">Nome</th>
+                        <th scope="col">Stato</th>
+                        <th scope="col">Data</th>
+                        <th scope="col">Importo</th>
+                        <th scope="col">...</th>
+                    </tr>
+                </thead>
+                <tbody id="checkall-target">
+                    @if(false)
+                        @foreach($records as $record)
+                            <tr>
+                                <td>{{$record->year}}</td>
+                                <td>{{$record->number}}</td>
+                                <td>{{$record->type == 'IN' ? ($record->member->last_name) : 'Uscita'}}</td>
+                                <td>{{$record->type == 'IN' ? ($record->member->first_name) : ''}}</td>
+                                <td>
+                                    <span class="tablesaw-cell-content">
+                                        <span
+                                            class="badge tessera-badge {{$record->status == 1 ? 'active' : 'suspended'}}">{{$record->status == 1 ? 'Attivo' : 'Annullata'}}</span>
+                                    </span>
+                                </td>
+                                <td>{{date("d/m/Y", strtotime($record->date))}}</td>
+                                <td>{{formatPrice($record->rows->sum('amount'))}}</td>
+                                <td>
+                                    <button type="button" class="btn u"
+                                        onclick="document.location.href='/in?id={{$record->record_id}}'" data-bs-toggle="popover"
+                                        data-bs-trigger="hover focus" data-bs-placement="bottom"
+                                        data-bs-content="Visualizza ricevuta"><i class="fa-regular fa-eye"></i></button>
+                                    <a target="_blank" class="btn  u" href="/receipt/{{$record->id}}" data-bs-toggle="popover"
+                                        data-bs-trigger="hover focus" data-bs-placement="bottom"
+                                        data-bs-content="Stampa ricevuta"><i class="fa-regular fa-file-lines"></i></a>
+                                    <a target="_blank" class="btn u" onclick="sendMail({{$record->id}})"><i
+                                            class="fa-regular fa-envelope" data-bs-toggle="popover" data-bs-trigger="hover focus"
+                                            data-bs-placement="bottom" data-bs-content="Invia email"></i></a>
+                                </td>
+                            </tr>
+                        @endforeach
+                    @endif
+                </tbody>
+            </table>
+        </div>
         <br>
     </section>
 
@@ -248,7 +250,7 @@
             $('.filterStatus').select2({ "language": { "noResults": function () { return "Nessun risultato"; } } });
             $('.filterMember').select2({ "language": { "noResults": function () { return "Nessun risultato"; } } });
 
-            loadDataTable();
+            // loadDataTable();
         });
 
         Livewire.on('load-data-table', () => {
@@ -327,27 +329,23 @@
 
 
         function loadDataTable() {
-            if ($.fn.DataTable.isDataTable('#tablesaw-350')) {
-                $('#tablesaw-350').DataTable().destroy();
-            }
+            const url = '/get_receipts?filterStatus=' + $('.filterStatus').val() + '&filterFrom=' + $('.filterFrom').val() + '&filterTo=' + $('.filterTo').val() + '&filterMember=' + $('.filterMember').val();
 
-            var filterStatus = $('.filterStatus').val();
-            localStorage.setItem("filterStatusReceipt", filterStatus);
+            localStorage.setItem("filterStatusReceipt", $('.filterStatus').val());
+            localStorage.setItem("filterFromReceipt", $('.filterFrom').val());
+            localStorage.setItem("filterToReceipt", $('.filterTo').val());
+            localStorage.setItem("filterMemberReceipt", $('.filterMember').val());
 
-            var filterFrom = $('.filterFrom').val();
-            localStorage.setItem("filterFromReceipt", filterFrom);
-
-            var filterTo = $('.filterTo').val();
-            localStorage.setItem("filterToReceipt", filterTo);
-
-            var filterMember = $('.filterMember').val();
-            localStorage.setItem("filterMemberReceipt", filterMember);
+            if ($.fn.dataTable.isDataTable('#tablesaw-350')) {
+                $('#tablesaw-350').DataTable().ajax.url(url).load();
+                return;
+            }
 
             var table = $('#tablesaw-350').DataTable({
                 serverSide: true,
                 processing: true, // Add this to show processing indicator
                 ajax: {
-                    url: '/get_receipts?filterStatus=' + filterStatus + '&filterFrom=' + filterFrom + '&filterTo=' + filterTo + '&filterMember=' + filterMember,
+                    url: url,
                     dataSrc: function(json) {
                         console.log("Response:", json); // Debug the response
                         return json.data;
@@ -408,21 +406,24 @@
                                 text: 'ESPORTA',
                                 buttons: [
                                     {
-                                        extend: 'excelHtml5', "action": newexportaction,
+                                        extend: 'excelHtml5',
+                                        action: newexportaction,
                                         title: 'Ricevute',
                                         exportOptions: {
                                             columns: ":not(':last')"
                                         }
                                     },
                                     {
-                                        extend: 'pdfHtml5', "action": newexportaction,
+                                        extend: 'pdfHtml5',
+                                        action: newexportaction,
                                         title: 'Ricevute',
                                         exportOptions: {
                                             columns: ":not(':last')"
                                         }
                                     },
                                     {
-                                        extend: 'print', "action": newexportaction,
+                                        extend: 'print',
+                                        action: newexportaction,
                                         text: 'Stampa',
                                         title: 'Ricevute',
                                         exportOptions: {
@@ -443,10 +444,10 @@
                 },
                 order: [[0, 'desc'], [1, 'asc']],
                 pagingType: 'numbers',
-                "language": {
+                language: {
                     "url": "/assets/js/Italian.json"
                 },
-                "fnInitComplete": function (oSettings, json) {
+                fnInitComplete: function (oSettings, json) {
                     var html = '&nbsp;<a href="#" class="showHideFilter btn--ui"><i class="fa-solid fa-sliders"></i></a>';
                     $(".dt-search").append(html);
                 }