Update bas_vk_tab.html

bas_vk_tab.html

@@ -182,9 +182,9 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
             <option value="b_mess">Реплики</option>          
             <option value="curator">Куратор</option>
             <option value="shop_st">Статус покупки</option>
-            <option value="ws_stop">Стутус подписки</option>
+            <option value="ws_stop">Статус подписки</option>
             <option value="web_st">Вебинары</option>
-            <option value="fin_prog">Прогрес по воронке</option>
+            <option value="fin_prog">Прогресс по воронке</option>
             <option value="pr4">Канал трафика</option>
             <option value="pr5">Дата</option>
             <option value="key_pr">Ключ PR</option>
@@ -208,7 +208,7 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
         <button id="download-xlsx">Скачать в XLSX</button>
         <button id="download-json">Рассылка по выбранным</button>
         <button id="take-for-yourself">Взять себе</button>
-        <button id="download-json-new">Скачать JSON</button> <!-- Новая кнопка для скачивания JSON -->
+        <button id="download-json-new">Скачать JSON</button>
     </div>
     <div id="example-table"></div>
 
@@ -334,15 +334,36 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
                             {title:"Дата", field:"data_t", width:95},
                         ],
                     });
+
+                    // Filtering functionality
+                    document.getElementById('filter-field').addEventListener('change', updateFilter);
+                    document.getElementById('filter-type').addEventListener('change', updateFilter);
+                    document.getElementById('filter-value').addEventListener('input', updateFilter);
+
+                    function updateFilter() {
+                        var field = document.getElementById('filter-field').value;
+                        var type = document.getElementById('filter-type').value;
+                        var value = document.getElementById('filter-value').value;
+                        
+                        if (field && type) {
+                            table.setFilter(field, type, value);
+                        }
+                    }
+
                     // Clear filter
                     document.getElementById('filter-clear').addEventListener('click', function() {
+                        document.getElementById('filter-field').value = "";
+                        document.getElementById('filter-type').value = "=";
+                        document.getElementById('filter-value').value = "";
                         table.clearFilter(true);
                     });
+
                     // Download XLSX functionality
                     document.getElementById('download-xlsx').addEventListener('click', function() {
                         table.download("xlsx", "data.xlsx");
                     });
-                    // Download JSON functionality
+
+                    // Download JSON functionality for selected rows
                     document.getElementById('download-json').addEventListener('click', function() {
                         var selectedRows = table.getSelectedData();
                         var jsonData = JSON.stringify(selectedRows);
@@ -355,7 +376,8 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
                         a.click();
                         URL.revokeObjectURL(url);
                     });
-                    // New Download JSON functionality
+
+                    // New Download JSON functionality for all data
                     document.getElementById('download-json-new').addEventListener('click', function() {
                         var jsonData = JSON.stringify(data);
                         var blob = new Blob([jsonData], { type: 'application/json' });
@@ -367,10 +389,10 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
                         a.click();
                         URL.revokeObjectURL(url);
                     });
+
                     // Take for yourself functionality
                     document.getElementById('take-for-yourself').addEventListener('click', function() {
                         var selectedRows = table.getSelectedData();
-                        // Your logic to handle selected rows
                         console.log('Selected rows:', selectedRows);
                     });
                 })