ERP-360 Сборка страницы автопм

diff --git a/erp24/web/js/autoplannogramma/autoplannogramma.js b/erp24/web/js/autoplannogramma/autoplannogramma.js
index 0fd2b4e7fb6654509a00cad7a99b1ce04135531d..236716425d1cf7fe12a0073625011bd662b60cc6 100644 (file)
--- a/erp24/web/js/autoplannogramma/autoplannogramma.js
+++ b/erp24/web/js/autoplannogramma/autoplannogramma.js
@@ -42,74 +42,147 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 });
 
-response.forEach(item => {
-    const tr = $('<tr class="inserted-row"></tr>');
-
-    const subcategoryTd = $(`
-        <td class="subcategory d-flex justify-content-end">
-            <span class="list-group-item list-group-item-action subcategory-link w-90"
-                  data-category="${category}" data-subcategory="${subcategory}">
-                ${item.name}
-            </span>
-        </td>
-    `);
-    tr.append(subcategoryTd);
-
-    const valuesMap = Object.fromEntries(item.values.map(val => [
-        val.store_id,
-        {
-            quantity: val.quantity,
-            id: val.id,
-            title: val.title || {}
-        }
-    ]));
+$('.subcategory .list-group-item').on('click', function (e) {
+    e.preventDefault();
 
-    $('table thead th').each(function (index) {
-        const $th = $(this);
-        const storeId = $th.data('store-id');
+    window.getSelection()?.removeAllRanges();
+    $(this).blur();
 
-        if (storeId === undefined) return;
+    const week = $('#week').val();
+    const year = $('#year').val();
+    if (!week || !year || isNaN(week) || isNaN(year)) {
+        alert('Необходимо выбрать действительные значения года и недели');
+        return;
+    }
 
-        const isVisible = $(`table tbody tr:first td:eq(${index})`).is(':visible');
-        if (!isVisible) return;
+    const $link = $(this);
+    const category = $link.data('category');
+    const subcategory = $link.data('subcategory');
+    const $row = $link.closest('tr');
 
-        const val = valuesMap[storeId];
-        if (!val) {
-            tr.append(`<td data-store-id="${storeId}"></td>`);
-            return;
-        }
+    // Get filter data
+    const filters = getFilterData();
+    filters.month = getMonthByWeek(week, year, true);
+    filters.category = category;
+    filters.subcategory = subcategory;
 
-        const tooltipTitle = generateTitleString(val.title);
-        const encodedTooltip = $('<div>').text(tooltipTitle).html();
-
-        const td = $(`
-            <td data-store-id="${storeId}">
-                <div class="d-flex align-items-center">
-                    <input type="number" class="btn btn-primary input w-100"
-                           value="${val.quantity}"
-                           data-id="${val.id}"
-                           data-guid="${item.product_id}"
-                           data-store_id="${storeId}"
-                           title="${encodedTooltip}"
-                           data-bs-toggle="tooltip"
-                           data-bs-placement="top"
-                           data-original-value="${val.quantity}">
-                    <button class="reject-btn border-0 bg-transparent cursor-pointer">
-                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-                            <path d="M20 11v5a1 1 0 0 1-2 0v-4H7.414l1.293 1.293a1 1 0 0 1-1.414 1.414l-3-3a1 1 0 0 1 0-1.416l3-3a1 1 0 1 1 1.414 1.416L7.414 10H19a1 1 0 0 1 1 1z"
-                                  fill="grey" stroke="none"/>
-                        </svg>
-                    </button>
-                </div>
-            </td>
-        `);
-
-        tr.append(td);
-    });
+    // Show loading overlay
+    $('.loader-overlay').removeClass('d-none');
+
+    $.ajax({
+        url: '/auto-plannogramma/get-products',
+        method: 'GET',
+        data: filters,
+        success: function (response) {
+            // Remove existing inserted rows
+            $row.nextAll('tr.inserted-row').remove();
+
+            if (!response || !Array.isArray(response) || response.length === 0) {
+                alert('Нет планограммы для выбранного периода');
+                return;
+            }
+
+            // Generate title string function
+            const generateTitleString = (titleObj) => {
+                if (!titleObj || typeof titleObj !== 'object') return '';
+                return Object.entries(titleObj)
+                    .map(([type, groups]) => {
+                        if (typeof groups !== 'object') return '';
+                        const groupParts = Object.entries(groups)
+                            .map(([group, value]) => `${group}: ${value}`);
+                        return `${type} — ${groupParts.join(', ')}`;
+                    })
+                    .filter(Boolean)
+                    .join(' | ');
+            };
+
+            // Create document fragment for better performance
+            const fragment = document.createDocumentFragment();
+
+            response.forEach(item => {
+                const tr = $('<tr>').addClass('inserted-row');
+
+                // Create subcategory cell
+                const subcategoryTd = $(`
+                        <td class="subcategory d-flex justify-content-end">
+                            <span class="list-group-item list-group-item-action subcategory-link w-90"
+                                  data-category="${category}" 
+                                  data-subcategory="${subcategory}">
+                                ${item.name || ''}
+                            </span>
+                        </td>
+                    `);
+                tr.append(subcategoryTd);
+
+                // Map values for easier access
+                const valuesMap = new Map(item.values?.map(val => [
+                    val.store_id,
+                    {
+                        quantity: val.quantity || 0,
+                        id: val.id || '',
+                        title: val.title || {}
+                    }
+                ]) || []);
+
+                // Process table headers
+                $('table thead th').each(function (index) {
+                    const $th = $(this);
+                    const storeId = $th.data('store-id');
+
+                    if (storeId === undefined) return;
+
+                    const isVisible = $(`table tbody tr:first td:eq(${index})`).is(':visible');
+                    if (!isVisible) return;
+
+                    const val = valuesMap.get(storeId) || {quantity: 0, id: '', title: {}};
+                    const tooltipTitle = generateTitleString(val.title);
+                    const encodedTooltip = $('<div>').text(tooltipTitle).html();
+
+                    const td = $(`
+                            <td data-store-id="${storeId}">
+                                <div class="d-flex align-items-center">
+                                    <input type="number" 
+                                           class="btn btn-primary input w-100"
+                                           value="${val.quantity}"
+                                           data-id="${val.id}"
+                                           data-guid="${item.product_id || ''}"
+                                           data-store_id="${storeId}"
+                                           title="${encodedTooltip}"
+                                           data-bs-toggle="tooltip"
+                                           data-bs-placement="top"
+                                           data-original-value="${val.quantity}">
+                                    <button class="reject-btn border-0 bg-transparent cursor-pointer">
+                                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+                                            <path d="M20 11v5a1 1 0 0 1-2 0v-4H7.414l1.293 1.293a1 1 0 0 1-1.414 1.414l-3-3a1 1 0 0 1 0-1.416l3-3a1 1 0 1 1 1.414 1.416L7.414 10H19a1 1 0 0 1 1 1z"
+                                                  fill="grey" stroke="none"/>
+                                        </svg>
+                                    </button>
+                                </div>
+                            </td>
+                        `);
+
+                    tr.append(td);
+                });
+
+                fragment.appendChild(tr[0]);
+            });
+
+            // Append all rows at once
+            $row.after(fragment);
 
-    $row.after(tr);
+            // Initialize Bootstrap tooltips
+            $('[data-bs-toggle="tooltip"]').tooltip();
+        },
+        error: function (xhr) {
+            alert('Ошибка: ' + (xhr.responseText || 'Неизвестная ошибка сервера'));
+        },
+        complete: function () {
+            $('.loader-overlay').addClass('d-none');
+        }
+    });
 });
 
+
 $('.category .list-group-item').on('click', function () {
     const $categorySpan = $(this);
     const category = $categorySpan.text().trim();