Stammvertreter-Auswahl als A–Z sortiertes Dropdown

Im Vertretungs-Dialog ersetzt ein Dropdown die Kachel-Auswahl; Sidebar- und Admin-Liste ebenfalls nach Name sortiert.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Christian Heubaum
2026-10-07 00:01:12 +02:00
parent bb9186d759
commit 2bcf6095ab
2 changed files with 13 additions and 17 deletions

View File

@@ -1734,7 +1734,7 @@
<div id="sub-sv-picker" style="display:none;margin-bottom:12px;">
<div style="font-size:0.75rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;">Stammvertreter wählen</div>
<div id="sub-sv-list" style="display:flex;flex-wrap:wrap;gap:8px;max-height:110px;overflow-y:auto;"></div>
<select id="sub-sv-select" onchange="if(this.value) pickStammvertreter(this.value)" style="width:100%;padding:8px;border:1px solid var(--border);border-radius:6px;font-size:0.9rem;"></select>
<hr style="margin:12px 0 0;border:none;border-top:1px solid var(--border);">
</div>
@@ -2133,10 +2133,14 @@ function deleteStammvertreter(svId) {
renderStammvertreterSection();
}
function sortSvByName(list) {
return [...list].sort((a, b) => (a.name || '').localeCompare(b.name || '', 'de', { sensitivity: 'base' }));
}
function renderStammvertreterSection() {
const container = document.getElementById('sv-list-container');
if (!container) return;
const list = loadStammvertreter();
const list = sortSvByName(loadStammvertreter());
if (list.length === 0) {
container.innerHTML = `<div style="color:var(--muted);font-size:0.82rem;padding:2px 0 8px;">Noch keine gespeichert. → <a href="admin.html" target="_blank" style="color:var(--red);">Admin öffnen</a> zum Importieren aus anderen Chaptern.</div>`;
return;
@@ -2154,23 +2158,15 @@ function renderStammvertreterSection() {
}
function renderSvPicker() {
const list = loadStammvertreter();
const list = sortSvByName(loadStammvertreter());
const picker = document.getElementById('sub-sv-picker');
const container = document.getElementById('sub-sv-list');
if (!picker || !container) return;
const select = document.getElementById('sub-sv-select');
if (!picker || !select) return;
if (list.length === 0) { picker.style.display = 'none'; return; }
picker.style.display = '';
container.innerHTML = '';
list.forEach(sv => {
const photoHtml = sv.photoB64
? `<img src="${sv.photoB64}" style="width:32px;height:32px;border-radius:50%;object-fit:cover;">`
: `<div style="width:32px;height:32px;border-radius:50%;background:${getColor(sv.name)};display:flex;align-items:center;justify-content:center;color:white;font-size:0.68rem;font-weight:700;">${getInitials(sv.name)}</div>`;
const card = document.createElement('div');
card.style.cssText = 'display:flex;align-items:center;gap:7px;padding:6px 9px;background:#f8f9fa;border:1px solid var(--border);border-radius:8px;cursor:pointer;';
card.innerHTML = `${photoHtml}<div><div style="font-size:0.79rem;font-weight:600;">${escHtml(sv.name)}</div><div style="font-size:0.69rem;color:var(--muted);">${escHtml(sv.company||'')}</div></div>`;
card.onclick = () => pickStammvertreter(sv.id);
container.appendChild(card);
});
select.innerHTML = '<option value="">– Stammvertreter auswählen –</option>' + list.map(sv =>
`<option value="${escHtml(sv.id)}">${escHtml(sv.name)}${sv.company ? ' · ' + escHtml(sv.company) : ''}</option>`
).join('');
}
function pickStammvertreter(svId) {