diff --git a/public/app.js b/public/app.js index b1ea692..bc12259 100644 --- a/public/app.js +++ b/public/app.js @@ -218,6 +218,8 @@ function loadColumnVisibility() { return null; } +// ✅ Показываем меню выбора столбцов + // ✅ Показываем меню выбора столбцов function showColumnManager() { if (!table || !currentMeta) { @@ -241,6 +243,26 @@ function showColumnManager() { // Получаем все колонки const columns = table.getColumns(); + // ✅ Фильтруем служебные колонки + const userColumns = columns.filter(col => { + const field = col.getField(); + const definition = col.getDefinition(); + + // Исключаем колонку с чекбоксами (может быть undefined, __tabulator_row_selection и т.д.) + if (!field || field === 'undefined' || field.startsWith('__tabulator')) { + return false; + } + + // Исключаем колонки с formatter: "rowSelection" + if (definition.formatter === 'rowSelection') { + return false; + } + + return true; + }); + + console.log('📋 Столбцов для настройки:', userColumns.length); + // Кнопки управления html += '
'; html += ''; @@ -249,12 +271,8 @@ function showColumnManager() { html += '
'; - columns.forEach(col => { + userColumns.forEach(col => { const field = col.getField(); - - // Пропускаем колонку с чекбоксами - if (field === '__tabulator_row_selection') return; - const definition = col.getDefinition(); const visible = col.isVisible(); const title = definition.title || field; @@ -267,7 +285,7 @@ function showColumnManager() {
@@ -348,6 +366,7 @@ function showColumnManager() { + // selectTable async function selectTable(schema, tableName) { @@ -543,11 +562,11 @@ async function selectTable(schema, tableName) { selectableRowsCheck: function(row) { return true; }, columns: columns, - layout: "fitData", // ✅ Изменено с fitColumns на fitData - resizableColumns: true, // ✅ Разрешаем изменять ширину столбцов - resizableColumnFit: false, // ✅ Выключаем авто-подгонку при ресайзе + layout: "fitDataStretch", // ✅ Изменено - растягивает столбцы для заполнения + подгоняет под данные + resizableColumns: true, + resizableColumnFit: false, - columnMinWidth: 100, // ✅ Минимальная ширина столбца + columnMinWidth: 100, pagination: true, paginationMode: "remote", diff --git a/public/index.html b/public/index.html index 8a3c4b1..8f36868 100644 --- a/public/index.html +++ b/public/index.html @@ -255,7 +255,42 @@ color: #b3e5fc; font-style: normal; } - +/* ✅ Синхронизация ширины заголовков и столбцов */ + .tabulator { + border: none; + background-color: white; + overflow: auto !important; + } + + .tabulator .tabulator-header { + background-color: #f5f5f5; + border-bottom: 2px solid #ddd; + overflow: visible !important; /* Важно для синхронизации */ + } + + .tabulator .tabulator-header .tabulator-col { + background-color: #f5f5f5; + } + + .tabulator .tabulator-tableholder { + overflow: auto !important; + } + + .tabulator .tabulator-table { + width: auto !important; + } + + /* ✅ Минимальная ширина столбцов */ + .tabulator-col { + min-width: 100px !important; + } + + /* ✅ Фиксируем первый столбец с чекбоксами */ + .tabulator-col[tabulator-field=""] { + width: 40px !important; + min-width: 40px !important; + max-width: 40px !important; + }