Ordner-Zuweisung als klickbare Tabelle statt Checkboxen

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kroonk
2026-04-16 22:06:43 +02:00
parent 2dcd559501
commit 2c040b651d
3 changed files with 66 additions and 36 deletions

View File

@@ -7,8 +7,6 @@
<link rel="stylesheet" href="/assets/css/main.min.css" />
<style>
.admin-section { background: rgba(0,0,0,0.5); padding: 2em; margin-bottom: 2em; border-radius: 4px; }
.folder-check { display: inline-block; margin: 5px 10px; padding: 8px 12px; background: rgba(255,255,255,0.1); border-radius: 4px; }
.folder-check label { cursor: pointer; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 10px; border-bottom: 1px solid rgba(255,255,255,0.2); }
.badge { display: inline-block; padding: 2px 8px; border-radius: 3px; font-size: 0.8em; }
@@ -17,6 +15,14 @@
.badge-client { background: #4CAF50; }
.badge-expired { background: #666; }
.btn-small { padding: 4px 10px; font-size: 0.85em; margin: 2px; cursor: pointer; }
.folder-row { cursor: pointer; transition: background 0.2s; }
.folder-row:hover { background: rgba(255,255,255,0.1); }
.folder-row.assigned { background: rgba(76,175,80,0.25); }
.folder-row.assigned:hover { background: rgba(76,175,80,0.35); }
.folder-status { font-weight: bold; }
.folder-status.yes { color: #4CAF50; }
.folder-status.no { color: #888; }
#folder-table-wrap { display: none; margin-top: 1em; }
</style>
</head>
<body class="is-preload">
@@ -65,13 +71,17 @@
<div class="admin-section">
<h2>Ordner-Zuweisung</h2>
<p>Weise Unterordner aus dem Websitebilder-Verzeichnis einem Nutzer zu.</p>
<select id="user-select" style="margin-bottom: 1em;">
<p>Waehle einen Nutzer und klicke auf Ordner um sie zuzuweisen oder zu entfernen.</p>
<select id="user-select">
<option value="">Nutzer waehlen...</option>
</select>
<div id="folder-checkboxes" style="display:flex; flex-wrap:wrap; gap:5px; margin-bottom:1em;"></div>
<button id="save-assignments">Zuweisung Speichern</button>
<span id="assign-status" style="margin-left:10px;"></span>
<div id="folder-table-wrap">
<table id="folder-table">
<thead><tr><th><i class="fa fa-folder"></i> Ordner</th><th style="width:120px; text-align:center;">Status</th></tr></thead>
<tbody id="folder-tbody"></tbody>
</table>
<span id="assign-status" style="display:inline-block; margin-top:10px;"></span>
</div>
</div>
<div class="admin-section">