feat: DB-Explorer, Scanner-KeyTypes-Setting, Stripe-Checker, Anthropic-Auth-Fix, Progress-Tracking
Backend:
- Neuer Database Explorer Endpoint (GET /api/admin/db/tables, GET /api/admin/db/tables/{name})
- DatabaseService: public GetConnection() Methode
- StripeKeyChecker: 2-Schritt-Check (/v1/balance + /v1/account), erkennt Live/Test, Balance, Account-Details
- AnthropicKeyChecker: Auth-Header fix (x-api-key für API-Keys, Bearer für OAuth), 400-Handler für credit balance
- KeyPatterns: Stripe einkommentiert, Krea AI Pattern, AllTypes-Array, MinLength 4
- ServerSettingsService: string_array Typ (Get/SetStringArray), ScannerKeyTypes Setting mit Checkbox-Optionen
- ServerSettingsEndpoint: string_array Speichern (Array/CSV)
- KeyScannerService: GetActiveSearchPatterns() filtert nach ScannerKeyTypes, Progress-Tracking
- GitHubEventScannerService: CheckNewKeys nur für aktuelle Poll-Keys (statt alle unchecked), klarere Log-Meldung
Frontend:
- Database Explorer Page: Tabellenliste mit Klick -> Tabelleninhalt, Pagination, sticky Header
- Server Settings: Checkbox-Gruppe für string_array (Alle/Keine Buttons)
- API Keys: adoptedApiKeyId Fix (leerer String == null)
- Dashboard: DB-Explorer Link für Admins
- Scan-Progress: Live-Fortschritt mit Phase/Detail/Counter
This commit is contained in:
Meleki committed
1 parent
3cd35ebbfa
commit
e61f3ef082
15 files changed
+642
-33
No files matched your search
@@ -730,3 +730,156 @@ a.admin-user-meta {
|
||||
text-align: right;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* ── Checkbox Group (string_array Settings) ── */
|
||||
|
||||
.checkbox-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.checkbox-group-actions {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.checkbox-group-actions .btn-xs {
|
||||
padding: 2px 8px;
|
||||
font-size: 0.75em;
|
||||
border-radius: var(--border-radius);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.checkbox-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
padding: 4px 8px;
|
||||
border: 1px solid var(--f1-border);
|
||||
border-radius: var(--border-radius);
|
||||
cursor: pointer;
|
||||
font-size: 0.85em;
|
||||
background: color-mix(in srgb, var(--f1-bg) 25%, transparent);
|
||||
transition: border-color 0.15s, background 0.15s;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.checkbox-item:hover {
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
.checkbox-item:has(input:checked) {
|
||||
border-color: var(--accent);
|
||||
background: color-mix(in srgb, var(--accent) 15%, transparent);
|
||||
}
|
||||
|
||||
.checkbox-item input[type="checkbox"] {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
accent-color: var(--accent);
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* ── Database Explorer ── */
|
||||
|
||||
.db-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.db-table th,
|
||||
.db-table td {
|
||||
padding: 8px 12px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.db-table th {
|
||||
background: var(--bg-secondary);
|
||||
font-weight: 600;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.db-table tbody tr:hover {
|
||||
background: color-mix(in srgb, var(--accent) 8%, transparent);
|
||||
}
|
||||
|
||||
.db-table-row.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.db-table-row.clickable:hover .db-table-name {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.db-table-name {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.db-table-name i {
|
||||
margin-right: 6px;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.db-table-num {
|
||||
text-align: right !important;
|
||||
font-variant-numeric: tabular-nums;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.db-table-wrapper {
|
||||
overflow-x: auto;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
|
||||
.db-data-table td {
|
||||
max-width: 300px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-family: var(--font-mono, monospace);
|
||||
font-size: .85em;
|
||||
}
|
||||
|
||||
.db-null {
|
||||
opacity: .3;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.db-info-bar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 0;
|
||||
font-size: .9em;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.db-pagination {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.db-page-info {
|
||||
font-size: .85em;
|
||||
}
|
||||
|
||||
.db-back-link {
|
||||
opacity: .6;
|
||||
transition: opacity .15s;
|
||||
}
|
||||
|
||||
.db-back-link:hover {
|
||||
opacity: 1;
|
||||
color: var(--accent);
|
||||
}
|
||||
@@ -59,6 +59,7 @@
|
||||
<a id="dashboardAdminLink" class="dashboard-link" hidden>Benutzerverwaltung</a>
|
||||
<a id="dashboardApiKeysLink" class="dashboard-link" hidden>API-Keys</a>
|
||||
<a id="dashboardServerSettingsLink" class="dashboard-link" hidden>Servereinstellungen</a>
|
||||
<a id="dashboardDbExplorerLink" class="dashboard-link" hidden>Datenbank</a>
|
||||
<a id="dashboardProfileLink" class="dashboard-link">Mein Profil</a>
|
||||
</div>
|
||||
</header>
|
||||
@@ -533,6 +534,18 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id="tpl-db-explorer">
|
||||
<div class="page form-page">
|
||||
<header>
|
||||
<button class="back-btn icon-btn" data-page="dashboard"><i class="fa fa-arrow-left"></i></button>
|
||||
<h1 id="dbExplorerTitle">Datenbank-Explorer</h1>
|
||||
</header>
|
||||
<div class="page-content">
|
||||
<div id="dbExplorerContent"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id="tpl-server-settings">
|
||||
<div class="page form-page">
|
||||
<header>
|
||||
@@ -710,6 +723,7 @@
|
||||
<script src="js/pages/admin-page.js"></script>
|
||||
<script src="js/pages/api-keys-page.js"></script>
|
||||
<script src="js/pages/server-settings-page.js"></script>
|
||||
<script src="js/pages/db-explorer-page.js"></script>
|
||||
<script src="js/pages/shared-page.js"></script>
|
||||
<script src="js/app.js"></script>
|
||||
</body>
|
||||
|
||||
@@ -410,7 +410,7 @@ registerPage('api-keys', {
|
||||
scannedList.appendChild(backRow);
|
||||
|
||||
// Toolbar: "Ungeprüfte prüfen"-Button
|
||||
var visibleKeys = scannedKeys.filter(function(sk) { return sk.adoptedApiKeyId == null; });
|
||||
var visibleKeys = scannedKeys.filter(function(sk) { return !sk.adoptedApiKeyId; });
|
||||
var uncheckedKeys = visibleKeys.filter(function(sk) { return sk.status === 'unchecked'; });
|
||||
if (uncheckedKeys.length > 0) {
|
||||
var toolbar = document.createElement('div');
|
||||
|
||||
@@ -34,6 +34,13 @@ registerPage('dashboard', {
|
||||
e.preventDefault();
|
||||
navigateTo('server-settings');
|
||||
});
|
||||
|
||||
var dbExplorerLink = document.getElementById('dashboardDbExplorerLink');
|
||||
dbExplorerLink.hidden = false;
|
||||
dbExplorerLink.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
navigateTo('db-explorer');
|
||||
});
|
||||
}
|
||||
|
||||
// Globaler Click-Handler zum Schließen aller Card-Menüs
|
||||
|
||||
@@ -0,0 +1,182 @@
|
||||
// ── Database Explorer Page ──
|
||||
|
||||
registerPage('db-explorer', {
|
||||
async init() {
|
||||
if (!currentUser || !currentUser.isAdmin) {
|
||||
navigateTo('dashboard');
|
||||
return;
|
||||
}
|
||||
|
||||
var titleEl = document.getElementById('dbExplorerTitle');
|
||||
var contentEl = document.getElementById('dbExplorerContent');
|
||||
var currentTable = null;
|
||||
|
||||
await loadTables();
|
||||
|
||||
async function loadTables() {
|
||||
currentTable = null;
|
||||
titleEl.textContent = 'Datenbank-Explorer';
|
||||
|
||||
try {
|
||||
var resp = await fetch('/api/admin/db/tables');
|
||||
var data = await resp.json();
|
||||
|
||||
contentEl.innerHTML = '';
|
||||
var table = document.createElement('table');
|
||||
table.className = 'db-table';
|
||||
|
||||
var thead = document.createElement('thead');
|
||||
thead.innerHTML = '<tr><th>Tabelle</th><th>Spalten</th><th>Zeilen</th></tr>';
|
||||
table.appendChild(thead);
|
||||
|
||||
var tbody = document.createElement('tbody');
|
||||
data.tables.forEach(function(t) {
|
||||
var tr = document.createElement('tr');
|
||||
tr.className = 'db-table-row clickable';
|
||||
|
||||
var tdName = document.createElement('td');
|
||||
tdName.innerHTML = '<i class="fa fa-table"></i> ' + esc(t.name);
|
||||
tdName.className = 'db-table-name';
|
||||
|
||||
var tdCols = document.createElement('td');
|
||||
tdCols.textContent = t.columns;
|
||||
tdCols.className = 'db-table-num';
|
||||
|
||||
var tdRows = document.createElement('td');
|
||||
tdRows.textContent = t.rows.toLocaleString();
|
||||
tdRows.className = 'db-table-num';
|
||||
|
||||
tr.appendChild(tdName);
|
||||
tr.appendChild(tdCols);
|
||||
tr.appendChild(tdRows);
|
||||
|
||||
tr.addEventListener('click', function() {
|
||||
loadTableData(t.name, 1);
|
||||
});
|
||||
|
||||
tbody.appendChild(tr);
|
||||
});
|
||||
|
||||
table.appendChild(tbody);
|
||||
contentEl.appendChild(table);
|
||||
} catch (err) {
|
||||
contentEl.innerHTML = '<p class="error">Fehler beim Laden: ' + esc(err.message) + '</p>';
|
||||
}
|
||||
}
|
||||
|
||||
async function loadTableData(name, page) {
|
||||
currentTable = name;
|
||||
titleEl.innerHTML = '<span class="db-back-link">Datenbank-Explorer</span> <i class="fa fa-chevron-right" style="opacity:.4;font-size:.7em;margin:0 .3em"></i> ' + esc(name);
|
||||
|
||||
// Back-Link klickbar
|
||||
titleEl.querySelector('.db-back-link').style.cursor = 'pointer';
|
||||
titleEl.querySelector('.db-back-link').addEventListener('click', function() {
|
||||
loadTables();
|
||||
});
|
||||
|
||||
try {
|
||||
var resp = await fetch('/api/admin/db/tables/' + encodeURIComponent(name) + '?page=' + page + '&pageSize=100');
|
||||
var data = await resp.json();
|
||||
|
||||
contentEl.innerHTML = '';
|
||||
|
||||
// Info-Zeile
|
||||
var info = document.createElement('div');
|
||||
info.className = 'db-info-bar';
|
||||
info.innerHTML = '<span>' + data.pagination.totalRows.toLocaleString() + ' Zeilen</span>';
|
||||
|
||||
// Pagination
|
||||
if (data.pagination.totalPages > 1) {
|
||||
var pagDiv = document.createElement('span');
|
||||
pagDiv.className = 'db-pagination';
|
||||
|
||||
if (page > 1) {
|
||||
var prevBtn = document.createElement('button');
|
||||
prevBtn.className = 'btn btn-small';
|
||||
prevBtn.innerHTML = '<i class="fa fa-chevron-left"></i>';
|
||||
prevBtn.addEventListener('click', function() { loadTableData(name, page - 1); });
|
||||
pagDiv.appendChild(prevBtn);
|
||||
}
|
||||
|
||||
var pageInfo = document.createElement('span');
|
||||
pageInfo.className = 'db-page-info';
|
||||
pageInfo.textContent = 'Seite ' + page + ' / ' + data.pagination.totalPages;
|
||||
pagDiv.appendChild(pageInfo);
|
||||
|
||||
if (page < data.pagination.totalPages) {
|
||||
var nextBtn = document.createElement('button');
|
||||
nextBtn.className = 'btn btn-small';
|
||||
nextBtn.innerHTML = '<i class="fa fa-chevron-right"></i>';
|
||||
nextBtn.addEventListener('click', function() { loadTableData(name, page + 1); });
|
||||
pagDiv.appendChild(nextBtn);
|
||||
}
|
||||
|
||||
info.appendChild(pagDiv);
|
||||
}
|
||||
|
||||
contentEl.appendChild(info);
|
||||
|
||||
// Tabelle mit Daten
|
||||
var wrapper = document.createElement('div');
|
||||
wrapper.className = 'db-table-wrapper';
|
||||
|
||||
var table = document.createElement('table');
|
||||
table.className = 'db-table db-data-table';
|
||||
|
||||
// Header aus Spalten-Info
|
||||
var thead = document.createElement('thead');
|
||||
var headerRow = document.createElement('tr');
|
||||
data.columns.forEach(function(col) {
|
||||
var th = document.createElement('th');
|
||||
th.textContent = col.name;
|
||||
if (col.pk) th.innerHTML += ' <i class="fa fa-key" style="opacity:.4;font-size:.75em"></i>';
|
||||
th.title = col.type + (col.notnull ? ' NOT NULL' : '') + (col.pk ? ' PRIMARY KEY' : '');
|
||||
headerRow.appendChild(th);
|
||||
});
|
||||
thead.appendChild(headerRow);
|
||||
table.appendChild(thead);
|
||||
|
||||
// Body
|
||||
var tbody = document.createElement('tbody');
|
||||
if (data.rows.length === 0) {
|
||||
var emptyRow = document.createElement('tr');
|
||||
var emptyCell = document.createElement('td');
|
||||
emptyCell.colSpan = data.columns.length;
|
||||
emptyCell.className = 'db-empty';
|
||||
emptyCell.textContent = 'Keine Daten';
|
||||
emptyRow.appendChild(emptyCell);
|
||||
tbody.appendChild(emptyRow);
|
||||
} else {
|
||||
data.rows.forEach(function(row) {
|
||||
var tr = document.createElement('tr');
|
||||
data.columns.forEach(function(col) {
|
||||
var td = document.createElement('td');
|
||||
var val = row[col.name];
|
||||
if (val === null || val === undefined) {
|
||||
td.innerHTML = '<span class="db-null">NULL</span>';
|
||||
} else {
|
||||
var str = String(val);
|
||||
if (str.length > 120) {
|
||||
td.textContent = str.substring(0, 120) + '…';
|
||||
td.title = str;
|
||||
} else {
|
||||
td.textContent = str;
|
||||
}
|
||||
}
|
||||
tr.appendChild(td);
|
||||
});
|
||||
tbody.appendChild(tr);
|
||||
});
|
||||
}
|
||||
|
||||
table.appendChild(tbody);
|
||||
wrapper.appendChild(table);
|
||||
contentEl.appendChild(wrapper);
|
||||
} catch (err) {
|
||||
contentEl.innerHTML = '<p class="error">Fehler beim Laden: ' + esc(err.message) + '</p>';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
destroy() {}
|
||||
});
|
||||
@@ -26,7 +26,54 @@ registerPage('server-settings', {
|
||||
label.setAttribute('for', 'ss-' + s.key);
|
||||
field.appendChild(label);
|
||||
|
||||
if (s.inputType === 'toggle') {
|
||||
if (s.inputType === 'checkboxes' && s.options) {
|
||||
var cbGroup = document.createElement('div');
|
||||
cbGroup.className = 'checkbox-group';
|
||||
cbGroup.id = 'ss-' + s.key;
|
||||
var selected = Array.isArray(s.value) ? s.value : [];
|
||||
|
||||
// Select All / Deselect All Buttons
|
||||
var cbActions = document.createElement('div');
|
||||
cbActions.className = 'checkbox-group-actions';
|
||||
var selectAllBtn = document.createElement('button');
|
||||
selectAllBtn.type = 'button';
|
||||
selectAllBtn.className = 'btn btn-xs';
|
||||
selectAllBtn.textContent = 'Alle';
|
||||
var deselectAllBtn = document.createElement('button');
|
||||
deselectAllBtn.type = 'button';
|
||||
deselectAllBtn.className = 'btn btn-xs';
|
||||
deselectAllBtn.textContent = 'Keine';
|
||||
cbActions.appendChild(selectAllBtn);
|
||||
cbActions.appendChild(deselectAllBtn);
|
||||
cbGroup.appendChild(cbActions);
|
||||
|
||||
var checkboxes = [];
|
||||
for (var oi = 0; oi < s.options.length; oi++) {
|
||||
var opt = s.options[oi];
|
||||
var cbItem = document.createElement('label');
|
||||
cbItem.className = 'checkbox-item';
|
||||
var cb2 = document.createElement('input');
|
||||
cb2.type = 'checkbox';
|
||||
cb2.value = opt.id;
|
||||
cb2.checked = selected.indexOf(opt.id) !== -1;
|
||||
checkboxes.push(cb2);
|
||||
var cbText = document.createElement('span');
|
||||
cbText.textContent = opt.name;
|
||||
cbItem.appendChild(cb2);
|
||||
cbItem.appendChild(cbText);
|
||||
cbGroup.appendChild(cbItem);
|
||||
}
|
||||
|
||||
selectAllBtn.addEventListener('click', function() {
|
||||
for (var ci = 0; ci < checkboxes.length; ci++) checkboxes[ci].checked = true;
|
||||
});
|
||||
deselectAllBtn.addEventListener('click', function() {
|
||||
for (var ci = 0; ci < checkboxes.length; ci++) checkboxes[ci].checked = false;
|
||||
});
|
||||
|
||||
inputs[s.key] = { _checkboxes: checkboxes };
|
||||
field.appendChild(cbGroup);
|
||||
} else if (s.inputType === 'toggle') {
|
||||
var toggleLabel = document.createElement('label');
|
||||
toggleLabel.className = 'toggle-label';
|
||||
|
||||
@@ -111,6 +158,12 @@ registerPage('server-settings', {
|
||||
data[def.key] = input.checked;
|
||||
} else if (def.type === 'int') {
|
||||
data[def.key] = parseInt(input.value, 10) || 0;
|
||||
} else if (def.type === 'string_array' && input._checkboxes) {
|
||||
var vals = [];
|
||||
for (var ci = 0; ci < input._checkboxes.length; ci++) {
|
||||
if (input._checkboxes[ci].checked) vals.push(input._checkboxes[ci].value);
|
||||
}
|
||||
data[def.key] = vals;
|
||||
} else {
|
||||
data[def.key] = input.value;
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user