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

diff --git a/erp24/views/auto-plannogramma/index.php b/erp24/views/auto-plannogramma/index.php
index ef52591b0f8eb1e7c69181ef0b05f5526b755853..68cb03e865723621aba7208b1f8bb4a2084751dc 100644 (file)
--- a/erp24/views/auto-plannogramma/index.php
+++ b/erp24/views/auto-plannogramma/index.php
@@ -165,6 +165,9 @@ $this->registerJsFile('/js/autoplannogramma/autoplannogramma.js', ['position' =>
         </div>
     </div>
     <div class="table-wrapper">
+        <div class="loader-overlay d-none">
+            <div class="spinner-border text-primary" role="status"></div>
+        </div>
         <table class="table">
             <thead>
             <tr class="head">
@@ -204,9 +207,9 @@ $this->registerJsFile('/js/autoplannogramma/autoplannogramma.js', ['position' =>
             <?php foreach ($groupedCategories as $category => $subcategories): ?>
                 <tr>
                     <td class="category" style="display: flex; justify-content: flex-end;">
-                        <a class="list-group-item list-group-item-action">
-                            <?= Html::encode($category) ?> ▲
-                        </a>
+                        <span class="list-group-item list-group-item-action">
+                            <?= Html::encode($category) ?>
+                        </span>
                     </td>
                     <?php foreach ($stores as $id => $storeName): ?>
                         <td data-store-id="<?= $id ?>" data-category="<?=$category?>"></td>
@@ -217,9 +220,9 @@ $this->registerJsFile('/js/autoplannogramma/autoplannogramma.js', ['position' =>
 
                     <tr>
                         <td class="subcategory" style="display: flex; justify-content: flex-end;">
-                            <a href="#" class="list-group-item list-group-item-action subcategory-link" style="width: 95%" data-category="<?= Html::encode($category) ?>" data-subcategory="<?= Html::encode($subcategory) ?>">
-                                <?= Html::encode($subcategory) ?> ▶
-                            </a>
+                            <span class="list-group-item list-group-item-action" style="width: 95%" data-category="<?= Html::encode($category) ?>" data-subcategory="<?= Html::encode($subcategory) ?>">
+                                <?= Html::encode($subcategory) ?>
+                            </span>
                         </td>
                         <?php foreach ($stores as $id => $storeName): ?>
                             <td data-store-id="<?= $id ?>" data-category="<?= $category?>" data-subcategory="<?= $subcategory ?>"></td>
@@ -276,4 +279,22 @@ $this->registerJsFile('/js/autoplannogramma/autoplannogramma.js', ['position' =>
         padding: 10px;
         border-right: 2px solid #ddd;
     }
+
+    .list-group-item-action {
+        color:black;
+    }
+
+    .loader-overlay {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background-color: rgba(255, 255, 255, 0.7);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        z-index: 999;
+    }
+
 </style>
\ No newline at end of file

diff --git a/erp24/web/js/autoplannogramma/autoplannogramma.js b/erp24/web/js/autoplannogramma/autoplannogramma.js
index e7a04e1e783da7713b98aeed95086229d0c83967..a5ed14b009a73a273bbddecd7e268fa0c3aaf8f1 100644 (file)
--- a/erp24/web/js/autoplannogramma/autoplannogramma.js
+++ b/erp24/web/js/autoplannogramma/autoplannogramma.js
@@ -8,7 +8,7 @@ document.addEventListener("DOMContentLoaded", () => {
 
     document.querySelectorAll(".category").forEach(category => {
         category.addEventListener("click", function () {
-            let row = this.parentElement.nextElementSibling;
+            let row = this.closest("tr").nextElementSibling;
             let isOpen = row?.style.display === "table-row";
 
             while (row && !row.querySelector(".category")) {
@@ -17,7 +17,7 @@ document.addEventListener("DOMContentLoaded", () => {
             }
 
             if (!isOpen) {
-                row = this.parentElement.nextElementSibling;
+                row = this.closest("tr").nextElementSibling;
                 while (row && !row.querySelector(".category")) {
                     if (row.querySelector(".subcategory")) {
                         row.style.display = "table-row";
@@ -31,7 +31,7 @@ document.addEventListener("DOMContentLoaded", () => {
     document.querySelectorAll(".subcategory").forEach(sub => {
         sub.addEventListener("click", function (e) {
             e.stopPropagation();
-            let row = this.parentElement.nextElementSibling;
+            let row = this.closest("tr").nextElementSibling;
             let isOpen = row?.style.display === "table-row";
 
             while (row && !row.querySelector(".subcategory") && !row.querySelector(".category")) {
@@ -42,7 +42,7 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 });
 
-$('.subcategory-link').on('click', function (e) {
+$('.subcategory .list-group-item').on('click', function (e) {
     e.preventDefault();
     window.getSelection()?.removeAllRanges();
     this.blur();
@@ -60,6 +60,8 @@ $('.subcategory-link').on('click', function (e) {
     filters.category = category;
     filters.subcategory = subcategory;
 
+    $('.loader-overlay').removeClass('d-none');
+
     $.get('/auto-plannogramma/get-products', filters, response => {
         $row.nextAll('tr.inserted-row').remove();
 
@@ -72,11 +74,11 @@ $('.subcategory-link').on('click', function (e) {
 
             const subcategoryTd = $(`
                 <td class="subcategory" style="display: flex; justify-content: flex-end;">
-                    <a href="#" class="list-group-item list-group-item-action subcategory-link"
-                       style="width: 90%;"
-                       data-category="${category}" data-subcategory="${subcategory}">
+                    <span class="list-group-item list-group-item-action subcategory-link"
+                          style="width: 90%;"
+                          data-category="${category}" data-subcategory="${subcategory}">
                         ${item.name}
-                    </a>
+                    </span>
                 </td>
             `);
             tr.append(subcategoryTd);
@@ -126,8 +128,61 @@ $('.subcategory-link').on('click', function (e) {
 
             $row.after(tr);
         });
-    }).fail(xhr => alert('Ошибка: ' + xhr.responseText));
+    })
+        .fail(xhr => alert('Ошибка: ' + xhr.responseText))
+        .always(() => {
+            $('.loader-overlay').addClass('d-none');
+        });
 });
+//
+// $('.category .list-group-item').on('click', function () {
+//     let $categorySpan = $(this);
+//     let category = $categorySpan.text().trim();
+//
+//     $.get('/path/to/subcategories', { category: category }, function (subcategories) {
+//         // пример: subcategories = ["Зелень", "Овощи", "Фрукты"]
+//
+//         // удалим уже существующие строки подкатегорий
+//         $categorySpan.closest('tr').nextAll('tr').each(function () {
+//             if ($(this).find('.subcategory').length > 0) {
+//                 $(this).remove();
+//             } else {
+//                 return false; // как только наткнулись на следующую категорию — останавливаемся
+//             }
+//         });
+//
+//         // вставим строки
+//         let $categoryRow = $categorySpan.closest('tr');
+//         $.each(subcategories, function (i, subcategory) {
+//             let row = $('<tr style="display: table-row;"></tr>');
+//             let td = $('<td class="subcategory" style="display: flex; justify-content: flex-end;"></td>');
+//             let span = $('<span>', {
+//                 class: 'list-group-item list-group-item-action subcategory-link',
+//                 style: 'width: 95%',
+//                 'data-category': category,
+//                 'data-subcategory': subcategory,
+//                 text: subcategory
+//             });
+//             td.append(span);
+//             row.append(td);
+//
+//             // Добавим по колонке на каждый магазин
+//             <?php foreach ($stores as $id => $storeName): ?>
+//             row.append(
+//                 $('<td>', {
+//                     'data-store-id': '<?= $id ?>',
+//                     'data-category': category,
+//                     'data-subcategory': subcategory
+//                 })
+//             );
+//             <?php endforeach; ?>
+//
+//             $categoryRow.after(row);
+//             $categoryRow = row; // чтобы следующий вставлялся после предыдущего
+//         });
+//     });
+// });
+
 
 $('#autoplannogramma').on('input', '.input', function () {
     $(this).closest('td').find('path').attr('fill', 'red');