Roland/Assetmanager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Privacy Policy DSGVO with sheets for categories, export-, check- and first erase-functions

Browse Source
This commit is contained in:
Roland
2026-08-08 10:16:36 +00:00
parent daac478714
commit daeb08c054
15 changed files with 162 additions and 526 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/static/js/asset-columns.js
-6
View File
@@ -224,12 +224,6 @@
}
});
window.addEventListener('asset-table-column-width-changed', event => {
if (!event.detail?.table || event.detail.table === table) {
applyHidden();
}
});
applyHidden();
window.dispatchEvent(new CustomEvent('asset-table-columns-ready', {
detail: { table }
app/static/js/browser-state.js
+1 -42
View File
@@ -35,35 +35,15 @@
return control.name || control.dataset.field || cell?.dataset.field || `filter-${index}`;
}
function restoreSort(table, index, force = false) {
if (!force && table.dataset.browserSortRestored === '1') return;
if (typeof table.assetApplySort !== 'function') return;
const key = `${tableKey(table, index)}:sort`;
let state = null;
try { state = JSON.parse(api.get(key) || 'null'); } catch (_) {}
if (state?.field && (state.direction === 'asc' || state.direction === 'desc')) {
table.assetApplySort(state.field, state.direction, {silent: true});
} else {
table.assetUpdateRowNumbers?.();
}
table.dataset.browserSortRestored = '1';
}
function restoreTable(table, index) {
if (table.dataset.browserStateReady === '1') return;
if (table.dataset.serverFilters === '1') {
table.dataset.browserStateReady = '1';
restoreSort(table, index);
return;
}
const restoreStarted = performance.now();
const controls = filterControls(table);
if (!controls.length) {
table.dataset.browserStateReady = '1';
restoreSort(table, index);
return;
}
if (!controls.length) return;
table.dataset.browserStateReady = '1';
const key = `${tableKey(table, index)}:filters`;
@@ -91,7 +71,6 @@
if (typeof table.assetApplyFilters === 'function') {
table.assetApplyFilters();
}
restoreSort(table, index);
table.dataset.browserStateRestored = '1';
window.dispatchEvent(new CustomEvent('asset-table-state-ready', { detail: { table } }));
const duration = performance.now() - restoreStarted;
@@ -130,25 +109,5 @@
api.remove(key);
});
window.addEventListener('asset-table-sort-changed', event => {
const table = event.detail?.table;
if (!(table instanceof HTMLTableElement)) return;
const tables = [...document.querySelectorAll('table')];
const index = tables.indexOf(table);
const key = `${tableKey(table, index >= 0 ? index : 0)}:sort`;
api.set(key, JSON.stringify({
field: event.detail?.field || '',
direction: event.detail?.direction || 'asc'
}));
});
window.addEventListener('asset-table-content-reloaded', event => {
const table = event.detail?.table;
if (!(table instanceof HTMLTableElement)) return;
const tables = [...document.querySelectorAll('table')];
const index = tables.indexOf(table);
restoreSort(table, index >= 0 ? index : 0, true);
});
perf?.end('browser-state:gesamtes Modul');
})();
app/static/js/table-tools.js
+28 -334
View File
@@ -163,104 +163,6 @@
const headerRow = thead.rows[0];
// Add a purely visual row-number column before every real table column.
// It is recalculated after filtering, sorting and partial server reloads and
// therefore never represents a database identifier.
if (!headerRow.querySelector('th[data-row-number-column="1"]')) {
const numberHeader = document.createElement('th');
numberHeader.className = 'table-row-number-header';
numberHeader.dataset.rowNumberColumn = '1';
numberHeader.dataset.noSort = '1';
numberHeader.dataset.noFilter = '1';
numberHeader.textContent = '#';
numberHeader.title = document.body.dataset.rowNumberLabel || 'Row number';
headerRow.insertBefore(numberHeader, headerRow.firstChild);
}
const numberHeader = headerRow.querySelector('th[data-row-number-column="1"]');
const rowNumberStoragePart = table.dataset.storageKey || table.id || window.location.pathname;
const rowNumberWidthKey = `assetmanager:table:${rowNumberStoragePart}:row-number-width`;
const defaultRowNumberWidth = 64;
const minimumRowNumberWidth = 48;
const maximumRowNumberWidth = 180;
function readStoredRowNumberWidth() {
try {
const stored = Number.parseInt(window.localStorage.getItem(rowNumberWidthKey) || '', 10);
if (Number.isFinite(stored)) {
return Math.min(maximumRowNumberWidth, Math.max(minimumRowNumberWidth, stored));
}
} catch (_) {}
return defaultRowNumberWidth;
}
function applyRowNumberWidth(width) {
const normalized = Math.min(maximumRowNumberWidth, Math.max(minimumRowNumberWidth, Math.round(width)));
table.style.setProperty('--table-row-number-width', `${normalized}px`);
table.dataset.rowNumberWidth = String(normalized);
return normalized;
}
function installRowNumberResizer() {
if (!numberHeader || numberHeader.querySelector('.table-row-number-resizer')) return;
const handle = document.createElement('span');
handle.className = 'table-row-number-resizer';
handle.setAttribute('role', 'separator');
handle.setAttribute('aria-orientation', 'vertical');
handle.tabIndex = 0;
handle.title = document.body.dataset.rowNumberResizeLabel || 'Drag to change column width';
numberHeader.appendChild(handle);
const saveWidth = width => {
const normalized = applyRowNumberWidth(width);
try { window.localStorage.setItem(rowNumberWidthKey, String(normalized)); } catch (_) {}
};
handle.addEventListener('pointerdown', event => {
event.preventDefault();
event.stopPropagation();
const startX = event.clientX;
const startWidth = Number.parseInt(table.dataset.rowNumberWidth || '', 10) || defaultRowNumberWidth;
handle.setPointerCapture?.(event.pointerId);
document.documentElement.classList.add('table-column-resizing');
const move = moveEvent => applyRowNumberWidth(startWidth + moveEvent.clientX - startX);
const finish = finishEvent => {
saveWidth(Number.parseInt(table.dataset.rowNumberWidth || '', 10) || startWidth);
handle.releasePointerCapture?.(finishEvent.pointerId);
document.documentElement.classList.remove('table-column-resizing');
handle.removeEventListener('pointermove', move);
handle.removeEventListener('pointerup', finish);
handle.removeEventListener('pointercancel', finish);
};
handle.addEventListener('pointermove', move);
handle.addEventListener('pointerup', finish);
handle.addEventListener('pointercancel', finish);
});
handle.addEventListener('keydown', event => {
if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') return;
event.preventDefault();
const current = Number.parseInt(table.dataset.rowNumberWidth || '', 10) || defaultRowNumberWidth;
saveWidth(current + (event.key === 'ArrowRight' ? 8 : -8));
});
}
applyRowNumberWidth(readStoredRowNumberWidth());
installRowNumberResizer();
function ensureRowNumberCells() {
[...tbody.rows].forEach(row => {
if (row.querySelector('td[data-row-number-column="1"]')) return;
const cell = document.createElement('td');
cell.className = 'table-row-number-cell';
cell.dataset.rowNumberColumn = '1';
cell.setAttribute('aria-hidden', 'true');
row.insertBefore(cell, row.firstChild);
});
}
ensureRowNumberCells();
const isAssetTable = table.id === 'asset-table';
const usesServerFilters = table.dataset.serverFilters === '1';
let serverFilterTimer = null;
@@ -271,19 +173,15 @@
// real data-field keys on its movable columns; selection and action
// columns must remain without a field key.
if (!isAssetTable) {
let syntheticIndex = 0;
[...headerRow.cells].forEach(header => {
if (header.dataset.rowNumberColumn === '1') return;
[...headerRow.cells].forEach((header, index) => {
if (!header.dataset.field) {
header.dataset.field = `__col_${syntheticIndex}`;
header.dataset.field = `__col_${index}`;
header.dataset.syntheticField = '1';
}
syntheticIndex += 1;
});
[...tbody.rows].forEach(row => {
[...row.cells].forEach((cell, index) => {
if (cell.dataset.rowNumberColumn === '1') return;
const header = headerRow.cells[index];
if (header && !cell.dataset.field) {
cell.dataset.field = header.dataset.field;
@@ -299,160 +197,6 @@
const filterDefinitions = [];
// User-resizable widths for all real table columns. Widths are stored per
// table and column key. The visual row-number column keeps its dedicated
// implementation above because it is generated dynamically.
const columnWidthsStorageKey = `assetmanager:table:${rowNumberStoragePart}:column-widths`;
const minimumColumnWidth = 56;
const maximumColumnWidth = 900;
function readStoredColumnWidths() {
try {
const parsed = JSON.parse(window.localStorage.getItem(columnWidthsStorageKey) || '{}');
return parsed && typeof parsed === 'object' && !Array.isArray(parsed) ? parsed : {};
} catch (_) {
return {};
}
}
let storedColumnWidths = readStoredColumnWidths();
function columnStorageKey(header, columnIndex) {
return header?.dataset.field || header?.dataset.serverFilterName || `__column_${columnIndex}`;
}
function normalizedColumnWidth(width) {
return Math.min(maximumColumnWidth, Math.max(minimumColumnWidth, Math.round(width)));
}
function applyColumnWidth(columnIndex, width, options = {}) {
const header = headerRow.cells[columnIndex];
if (!header || header.dataset.rowNumberColumn === '1') return null;
const normalized = normalizedColumnWidth(width);
const cells = [header, filterRow.cells[columnIndex], ...[...tbody.rows].map(row => row.cells[columnIndex])];
cells.filter(Boolean).forEach(cell => {
cell.style.width = `${normalized}px`;
cell.style.minWidth = `${normalized}px`;
cell.style.maxWidth = `${normalized}px`;
});
header.dataset.userColumnWidth = String(normalized);
// The asset list calculates its scroll width from data-column-width.
// Keep that existing mechanism in sync instead of introducing a second
// competing table-width calculation.
if (isAssetTable && header.dataset.field) {
header.dataset.columnWidth = String(normalized);
window.dispatchEvent(new CustomEvent('asset-table-column-width-changed', {
detail: { table, field: header.dataset.field, width: normalized }
}));
}
if (options.save) {
storedColumnWidths[columnStorageKey(header, columnIndex)] = normalized;
try {
window.localStorage.setItem(columnWidthsStorageKey, JSON.stringify(storedColumnWidths));
} catch (_) {}
}
return normalized;
}
function applyStoredColumnWidths() {
[...headerRow.cells].forEach((header, columnIndex) => {
if (header.dataset.rowNumberColumn === '1') return;
const stored = Number.parseInt(storedColumnWidths[columnStorageKey(header, columnIndex)], 10);
if (Number.isFinite(stored)) applyColumnWidth(columnIndex, stored);
});
}
function resetColumnWidth(columnIndex) {
const header = headerRow.cells[columnIndex];
if (!header || header.dataset.rowNumberColumn === '1') return;
delete storedColumnWidths[columnStorageKey(header, columnIndex)];
try {
window.localStorage.setItem(columnWidthsStorageKey, JSON.stringify(storedColumnWidths));
} catch (_) {}
[header, filterRow.cells[columnIndex], ...[...tbody.rows].map(row => row.cells[columnIndex])]
.filter(Boolean)
.forEach(cell => {
cell.style.removeProperty('width');
cell.style.removeProperty('min-width');
cell.style.removeProperty('max-width');
});
delete header.dataset.userColumnWidth;
if (isAssetTable && header.dataset.field) {
const configured = Number.parseInt(header.dataset.defaultColumnWidth || '', 10);
const fallback = Number.isFinite(configured) ? configured : 180;
header.dataset.columnWidth = String(fallback);
window.dispatchEvent(new CustomEvent('asset-table-column-width-changed', {
detail: { table, field: header.dataset.field, width: fallback }
}));
}
}
function installColumnResizers() {
[...headerRow.cells].forEach((header, columnIndex) => {
if (header.dataset.rowNumberColumn === '1' || header.colSpan > 1) return;
if (header.querySelector(':scope > .table-column-resizer')) return;
if (isAssetTable && !header.dataset.defaultColumnWidth) {
header.dataset.defaultColumnWidth = header.dataset.columnWidth || '';
}
const handle = document.createElement('span');
handle.className = 'table-column-resizer';
handle.setAttribute('role', 'separator');
handle.setAttribute('aria-orientation', 'vertical');
handle.tabIndex = 0;
handle.title = document.body.dataset.rowNumberResizeLabel || 'Drag to change column width';
header.appendChild(handle);
handle.addEventListener('click', event => {
event.preventDefault();
event.stopPropagation();
});
handle.addEventListener('dblclick', event => {
event.preventDefault();
event.stopPropagation();
resetColumnWidth(columnIndex);
});
handle.addEventListener('pointerdown', event => {
event.preventDefault();
event.stopPropagation();
const startX = event.clientX;
const startWidth = Math.round(header.getBoundingClientRect().width);
handle.setPointerCapture?.(event.pointerId);
document.documentElement.classList.add('table-column-resizing');
const move = moveEvent => applyColumnWidth(columnIndex, startWidth + moveEvent.clientX - startX);
const finish = finishEvent => {
const current = Number.parseInt(header.dataset.userColumnWidth || '', 10) || startWidth;
applyColumnWidth(columnIndex, current, { save: true });
handle.releasePointerCapture?.(finishEvent.pointerId);
document.documentElement.classList.remove('table-column-resizing');
handle.removeEventListener('pointermove', move);
handle.removeEventListener('pointerup', finish);
handle.removeEventListener('pointercancel', finish);
};
handle.addEventListener('pointermove', move);
handle.addEventListener('pointerup', finish);
handle.addEventListener('pointercancel', finish);
});
handle.addEventListener('keydown', event => {
if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') return;
event.preventDefault();
event.stopPropagation();
const current = Number.parseInt(header.dataset.userColumnWidth || '', 10)
|| Math.round(header.getBoundingClientRect().width);
applyColumnWidth(columnIndex, current + (event.key === 'ArrowRight' ? 12 : -12), { save: true });
});
});
}
function filterStatusTarget() {
const wrapper = table.closest(
'#asset-table-scroll, .management-table-scroll, .table-scroll, .table-wrap, .sticky-table'
@@ -547,22 +291,16 @@
}
function rebuildMissingCellKeys() {
ensureRowNumberCells();
if (isAssetTable) {
applyStoredColumnWidths();
return;
}
if (isAssetTable) return;
[...tbody.rows].forEach(row => {
[...row.cells].forEach((cell, index) => {
if (cell.dataset.rowNumberColumn === '1') return;
const header = headerRow.cells[index];
if (header && !cell.dataset.field) {
cell.dataset.field = header.dataset.field;
}
});
});
applyStoredColumnWidths();
}
function numericFilterMatches(rawValue, rawTerm) {
@@ -667,20 +405,6 @@
else serverFilterTimer = window.setTimeout(navigate, 700);
}
function updateRowNumbers() {
let visibleIndex = 0;
[...tbody.rows].forEach(row => {
const cell = row.querySelector('td[data-row-number-column="1"]');
if (!cell) return;
if (row.hidden) {
cell.textContent = '';
return;
}
visibleIndex += 1;
cell.textContent = String(visibleIndex);
});
}
function applyFilters() {
rebuildMissingCellKeys();
@@ -695,7 +419,6 @@
const serverTotal = Number.parseInt(table.dataset.serverFilterTotal || '', 10);
const total = Number.isFinite(serverTotal) ? serverTotal : tbody.rows.length;
updateFilterPresentation(active, tbody.rows.length, total);
updateRowNumbers();
window.dispatchEvent(new CustomEvent('asset-table-filter-changed', {
detail: {
table,
@@ -724,7 +447,6 @@
});
updateFilterPresentation(active, visibleRows, tbody.rows.length);
updateRowNumbers();
window.dispatchEvent(new CustomEvent('asset-table-filter-changed', {
detail: {
@@ -736,43 +458,6 @@
}));
}
function applySort(field, direction, options = {}) {
const header = [...headerRow.cells].find(item => item.dataset.field === field);
if (!header || header.dataset.noSort) return false;
const columnIndex = header.cellIndex;
[...headerRow.cells].forEach(item => {
delete item.dataset.sortDirection;
item.classList.remove('sort-asc', 'sort-desc');
});
const normalizedDirection = direction === 'desc' ? 'desc' : 'asc';
header.dataset.sortDirection = normalizedDirection;
header.classList.add(normalizedDirection === 'asc' ? 'sort-asc' : 'sort-desc');
const rows = [...tbody.rows];
rows.sort((left, right) => {
const definition = { field, columnIndex };
const result = compareValues(
textValue(cellForDefinition(left, definition)),
textValue(cellForDefinition(right, definition))
);
return normalizedDirection === 'asc' ? result : -result;
});
const fragment = document.createDocumentFragment();
rows.forEach(row => fragment.appendChild(row));
tbody.appendChild(fragment);
applyFilters();
if (!options.silent) {
window.dispatchEvent(new CustomEvent('asset-table-sort-changed', {
detail: { table, field, direction: normalizedDirection }
}));
}
return true;
}
[...headerRow.cells].forEach((header, columnIndex) => {
const field = header.dataset.field || '';
const serverName = header.dataset.serverFilterName || '';
@@ -783,18 +468,37 @@
header.addEventListener('click', event => {
if (event.target.closest('input,button,a,select,textarea,label')) return;
const direction = header.dataset.sortDirection === 'asc' ? 'desc' : 'asc';
applySort(field, direction);
[...headerRow.cells].forEach(item => {
delete item.dataset.sortDirection;
item.classList.remove('sort-asc', 'sort-desc');
});
header.dataset.sortDirection = direction;
header.classList.add(direction === 'asc' ? 'sort-asc' : 'sort-desc');
const rows = [...tbody.rows];
rows.sort((left, right) => {
const definition = { field, columnIndex };
const result = compareValues(
textValue(cellForDefinition(left, definition)),
textValue(cellForDefinition(right, definition))
);
return direction === 'asc' ? result : -result;
});
const fragment = document.createDocumentFragment();
rows.forEach(row => fragment.appendChild(row));
tbody.appendChild(fragment);
applyFilters();
});
}
const filterCell = document.createElement('th');
if (field) filterCell.dataset.field = field;
filterCell.dataset.columnIndex = String(columnIndex);
if (header.dataset.rowNumberColumn === '1') {
filterCell.dataset.rowNumberColumn = '1';
filterCell.className = 'table-row-number-filter';
}
if (!header.dataset.noFilter && (!usesServerFilters || serverName)) {
const input = document.createElement('input');
@@ -837,8 +541,6 @@
});
thead.appendChild(filterRow);
installColumnResizers();
applyStoredColumnWidths();
// Editable cells are always read live, so changed values immediately
// participate in filtering without a stale cache.
@@ -851,8 +553,6 @@
});
table.assetApplyFilters = applyFilters;
table.assetApplySort = (field, direction, options = {}) => applySort(field, direction, options);
table.assetUpdateRowNumbers = updateRowNumbers;
table.assetRebuildFilterCache = rebuildMissingCellKeys;
table.dataset.tableToolsReady = '1';
ensureFilterStatus();
@@ -886,13 +586,7 @@
const table = event.detail?.table;
if (table?.assetRebuildFilterCache) {
table.assetRebuildFilterCache();
const sortedHeader = table.tHead?.rows?.[0]?.querySelector('[data-sort-direction]');
if (sortedHeader?.dataset.field && table.assetApplySort) {
table.assetApplySort(sortedHeader.dataset.field, sortedHeader.dataset.sortDirection, {silent: true});
} else {
table.assetApplyFilters?.();
}
table.assetUpdateRowNumbers?.();
table.assetApplyFilters?.();
}
});
})();