scroll table parts

2026-05-04 12:10:12 +02:00
parent ce00247d1c
commit 813bd66f96
2 changed files with 268 additions and 54 deletions
@@ -2463,4 +2463,142 @@ $(document).on("click", "#showHideImageBtn", function () {
            "<i class='fas fa-eye' style='font-size: 0.8rem;'></i><i class='fas fa-image ms-1' style='font-size: 0.8rem;'></i>",
        );
    }
+
+    if (typeof window.applyPartsColumnWidths === "function") {
+        setTimeout(window.applyPartsColumnWidths, 150);
+    }
 });
+// ===================
+// RESIZABLE PARTS TABLE COLUMNS - FIXED COLGROUP VERSION
+// ===================
+(function () {
+    // Larghezze default per indice colonna (0-based)
+    const defaultWidths = [55, 320, 360, 150, 230];
+    const savedWidths = [...defaultWidths];
+
+    function getColgroup() {
+        return $("#partsTableColgroup");
+    }
+
+    function syncColgroupToHeaders() {
+        const $table = $("#partsTable");
+        const $ths = $table.find("thead tr:first th");
+        const $colgroup = getColgroup();
+        const thCount = $ths.length;
+
+        // Assicura che ci siano esattamente tante <col> quante <th>
+        while ($colgroup.find("col").length < thCount) {
+            $colgroup.append("<col>");
+        }
+        while ($colgroup.find("col").length > thCount) {
+            $colgroup.find("col:last").remove();
+        }
+
+        // Applica le larghezze salvate
+        $colgroup.find("col").each(function (i) {
+            const w = savedWidths[i] !== undefined ? savedWidths[i] : 150;
+            $(this).css("width", w + "px");
+        });
+
+        // Imposta larghezza totale della tabella = somma colonne (evita reflow)
+        const total = savedWidths.slice(0, thCount).reduce((a, b) => a + b, 0);
+        $table.css("width", total + "px");
+    }
+
+    function applyColumnWidth(colIndex, newWidth) {
+        const w = Math.max(40, Math.round(newWidth));
+        savedWidths[colIndex] = w;
+
+        const $col = getColgroup().find("col").eq(colIndex);
+        if ($col.length) {
+            $col.css("width", w + "px");
+        }
+
+        // Aggiorna larghezza totale tabella senza toccare le altre colonne
+        const thCount = $("#partsTable thead tr:first th").length;
+        const total = savedWidths.slice(0, thCount).reduce((a, b) => a + b, 0);
+        $("#partsTable").css("width", total + "px");
+    }
+
+    function addResizers() {
+        const $table = $("#partsTable");
+        if (!$table.length) return;
+
+        $table.find("thead tr:first th").each(function (colIndex) {
+            const $th = $(this);
+
+            // Salta colonna Num (indice 0) — non ridimensionabile
+            if (colIndex === 0) return;
+
+            // Non aggiungere due volte
+            if ($th.find(".parts-resizer").length) return;
+
+            const $resizer = $("<span class='parts-resizer'></span>");
+            $th.css("position", "relative"); // necessario per il posizionamento assoluto
+            $th.append($resizer);
+
+            $resizer.on("mousedown", function (e) {
+                e.preventDefault();
+                e.stopPropagation();
+
+                const startX = e.pageX;
+                // Leggi la larghezza ESATTA dalla <col>, non dal <th>
+                const startWidth =
+                    savedWidths[colIndex] !== undefined
+                        ? savedWidths[colIndex]
+                        : parseInt(
+                              getColgroup()
+                                  .find("col")
+                                  .eq(colIndex)
+                                  .css("width"),
+                              10,
+                          ) || 150;
+
+                $("body")
+                    .css("user-select", "none")
+                    .css("cursor", "col-resize");
+
+                $(document).on("mousemove.partsResize", function (ev) {
+                    const delta = ev.pageX - startX;
+                    applyColumnWidth(colIndex, startWidth + delta);
+                });
+
+                $(document).on("mouseup.partsResize", function () {
+                    $("body").css("user-select", "").css("cursor", "");
+                    $(document).off(".partsResize");
+                });
+            });
+        });
+    }
+
+    function init() {
+        syncColgroupToHeaders();
+        addResizers();
+    }
+
+    // Init al primo show del modale
+    $(document).on("shown.bs.modal", "#partsModal", function () {
+        setTimeout(init, 120);
+    });
+
+    // Re-init dopo ogni AJAX (nuove righe, caricamenti)
+    $(document).ajaxComplete(function () {
+        if ($("#partsModal").hasClass("show")) {
+            setTimeout(syncColgroupToHeaders, 200);
+            setTimeout(addResizers, 220);
+        }
+    });
+
+    // Re-init dopo aggiunta/rimozione righe
+    $(document).on(
+        "click",
+        ".add-row-global, .add-mix-global, .add-mix-row, .remove-row, #renumberPartsBtn, #clonePartsBtn",
+        function () {
+            setTimeout(syncColgroupToHeaders, 120);
+            setTimeout(addResizers, 140);
+        },
+    );
+
+    window.initPartsResizableColumns = init;
+    window.applyPartsColumnWidths = syncColgroupToHeaders;
+})();