sort in reclamations reports

resources/views/reports/index.blade.php

@@ -247,11 +247,11 @@
                         Общий свод по МАФ
                     </h4>
                     <div class="table-responsive js-subtable-scroll">
-                        <table class="table">
+                        <table class="table js-sortable-table" id="table-mafs">
                             <thead>
                                 <tr>
-                                    <th>Артикул МАФ</th>
-                                    <th>Кол-во</th>
+                                    <th class="sortable" data-col="0" data-dir="asc" style="cursor:pointer;user-select:none">Артикул МАФ <span class="sort-icon"></span></th>
+                                    <th class="sortable" data-col="1" data-dir="asc" style="cursor:pointer;user-select:none">Кол-во <span class="sort-icon"></span></th>
                                 </tr>
                             </thead>
                             <tbody>
@@ -271,11 +271,11 @@
                         Общий свод по деталям
                     </h4>
                     <div class="table-responsive js-subtable-scroll">
-                        <table class="table">
+                        <table class="table js-sortable-table" id="table-details">
                             <thead>
                                 <tr>
-                                    <th>Деталь</th>
-                                    <th>Кол-во</th>
+                                    <th class="sortable" data-col="0" data-dir="asc" style="cursor:pointer;user-select:none">Деталь <span class="sort-icon"></span></th>
+                                    <th class="sortable" data-col="1" data-dir="asc" style="cursor:pointer;user-select:none">Кол-во <span class="sort-icon"></span></th>
                                 </tr>
                             </thead>
                             <tbody>
@@ -420,6 +420,62 @@
             },
         });
 
+        // Сортировка таблиц рекламаций
+        function sortTable(table, colIndex, dir) {
+            const tbody = table.querySelector('tbody');
+            const rows = Array.from(tbody.querySelectorAll('tr'));
+            rows.sort((a, b) => {
+                const aVal = a.cells[colIndex].textContent.trim();
+                const bVal = b.cells[colIndex].textContent.trim();
+                const aNum = parseFloat(aVal);
+                const bNum = parseFloat(bVal);
+                const isNum = !isNaN(aNum) && !isNaN(bNum);
+                let cmp = isNum ? aNum - bNum : aVal.localeCompare(bVal, 'ru');
+                return dir === 'desc' ? -cmp : cmp;
+            });
+            rows.forEach(r => tbody.appendChild(r));
+        }
+
+        function initSortableTable(table, defaultCol, defaultDir) {
+            const headers = table.querySelectorAll('th.sortable');
+            let currentCol = defaultCol;
+            let currentDir = defaultDir;
+
+            function updateIcons() {
+                headers.forEach(h => {
+                    const icon = h.querySelector('.sort-icon');
+                    const col = parseInt(h.dataset.col);
+                    if (col === currentCol) {
+                        icon.innerHTML = currentDir === 'asc'
+                            ? '<i class="bi bi-arrow-down-square-fill text-primary"></i>'
+                            : '<i class="bi bi-arrow-up-square-fill text-primary"></i>';
+                    } else {
+                        icon.innerHTML = '';
+                    }
+                });
+            }
+
+            headers.forEach(th => {
+                th.addEventListener('click', () => {
+                    const col = parseInt(th.dataset.col);
+                    if (col === currentCol) {
+                        currentDir = currentDir === 'asc' ? 'desc' : 'asc';
+                    } else {
+                        currentCol = col;
+                        currentDir = col === 1 ? 'desc' : 'asc';
+                    }
+                    sortTable(table, currentCol, currentDir);
+                    updateIcons();
+                });
+            });
+
+            sortTable(table, currentCol, currentDir);
+            updateIcons();
+        }
+
+        document.querySelectorAll('.js-sortable-table').forEach(table => {
+            initSortableTable(table, 1, 'desc');
+        });
 
     </script>
 @endpush