add group export

2026-06-17 08:14:10 +02:00
parent 2f271265e9
commit e98660134a
8 changed files with 558 additions and 0 deletions
@@ -4166,3 +4166,191 @@ document.getElementById('btnRestoreColors')?.addEventListener('click', () => {
    setTimeout(() => openSettingsModal(), 200);
  }
 })();
+
+// =============================================================
+// Gruppen-Export
+// =============================================================
+
+const GexState = {
+  searchResults: [],
+  selectedGroup: null,
+  members: null,
+  memberFilter: '',
+};
+
+function openGroupExportModal() {
+  if (!State.connected) { toast('Bitte zuerst verbinden.', 'warn'); return; }
+  GexState.searchResults = [];
+  GexState.selectedGroup = null;
+  GexState.members = null;
+  GexState.memberFilter = '';
+  document.getElementById('gexSearch').value = '';
+  document.getElementById('gexMemberFilter').value = '';
+  document.getElementById('gexSearchResults').innerHTML = '<div class="gex-hint">Mindestens 2 Zeichen eingeben.</div>';
+  document.getElementById('gexMembersArea').innerHTML = '<div class="gex-hint">Gruppe auswählen um Mitglieder zu laden.</div>';
+  document.getElementById('gexMembersTitle').textContent = 'Mitglieder';
+  document.getElementById('gexStats').textContent = '';
+  document.getElementById('gexExportBtn').disabled = true;
+  document.getElementById('modalGroupExport').classList.remove('hidden');
+  setTimeout(() => document.getElementById('gexSearch').focus(), 80);
+}
+
+document.getElementById('btnGroupExport')?.addEventListener('click', openGroupExportModal);
+
+// Suche mit Debounce
+let _gexSearchTimer = null;
+document.getElementById('gexSearch')?.addEventListener('input', e => {
+  clearTimeout(_gexSearchTimer);
+  const q = e.target.value.trim();
+  if (q.length < 2) {
+    GexState.searchResults = [];
+    document.getElementById('gexSearchResults').innerHTML = '<div class="gex-hint">Mindestens 2 Zeichen eingeben.</div>';
+    return;
+  }
+  document.getElementById('gexSearchResults').innerHTML = '<div class="gex-loading"><div class="spinner" style="width:14px;height:14px;border-width:2px;"></div><span>Suche…</span></div>';
+  _gexSearchTimer = setTimeout(() => _gexDoSearch(q), 350);
+});
+
+async function _gexDoSearch(q) {
+  try {
+    const data = await api(`/api/groups/search?q=${encodeURIComponent(q)}`);
+    GexState.searchResults = data.items || [];
+    _gexRenderResults();
+  } catch (e) {
+    document.getElementById('gexSearchResults').innerHTML = `<div class="gex-error">Suche fehlgeschlagen: ${escapeHtml(e.message)}</div>`;
+  }
+}
+
+function _gexRenderResults() {
+  const el = document.getElementById('gexSearchResults');
+  if (!el) return;
+  const items = GexState.searchResults;
+  if (items.length === 0) {
+    el.innerHTML = '<div class="gex-empty">Keine Gruppen gefunden.</div>';
+    return;
+  }
+  el.innerHTML = items.map(g => `
+    <div class="gex-group-item ${GexState.selectedGroup?.Id === g.Id ? 'selected' : ''}"
+         data-id="${escapeHtml(g.Id)}" data-name="${escapeHtml(g.DisplayName)}">
+      <div class="gex-group-name">${escapeHtml(g.DisplayName)}</div>
+      ${g.Description ? `<div class="gex-group-desc">${escapeHtml(g.Description)}</div>` : ''}
+    </div>
+  `).join('');
+  el.querySelectorAll('.gex-group-item').forEach(item => {
+    item.addEventListener('click', () => _gexSelectGroup(item.dataset.id, item.dataset.name));
+  });
+}
+
+async function _gexSelectGroup(id, name) {
+  GexState.selectedGroup = { Id: id, DisplayName: name };
+  GexState.members = null;
+  GexState.memberFilter = '';
+  document.getElementById('gexMemberFilter').value = '';
+  _gexRenderResults();  // aktualisiert selected-Highlight
+  document.getElementById('gexMembersTitle').textContent = `Mitglieder — ${name}`;
+  document.getElementById('gexStats').textContent = '';
+  document.getElementById('gexExportBtn').disabled = true;
+  document.getElementById('gexMembersArea').innerHTML =
+    '<div class="gex-loading"><div class="spinner" style="width:16px;height:16px;border-width:2px;"></div><span>Mitglieder werden aufgelöst (inkl. verschachtelte Gruppen)…</span></div>';
+
+  try {
+    const data = await api(`/api/groups/${encodeURIComponent(id)}/members/export`);
+    GexState.members = data;
+    _gexRenderMembers();
+    document.getElementById('gexExportBtn').disabled = data.count === 0;
+    let stats = `${data.count} Benutzer`;
+    if (data.duplicates > 0) stats += ` · ${data.duplicates} Duplikate aus Verschachtelung entfernt`;
+    stats += ` · ${data.resolvedMs}ms`;
+    document.getElementById('gexStats').textContent = stats;
+  } catch (e) {
+    document.getElementById('gexMembersArea').innerHTML =
+      `<div class="gex-error">Fehler beim Laden: ${escapeHtml(e.message)}</div>`;
+  }
+}
+
+// Live-Filter für die Mitgliederliste
+document.getElementById('gexMemberFilter')?.addEventListener('input', e => {
+  GexState.memberFilter = e.target.value.trim().toLowerCase();
+  _gexApplyFilter();
+});
+
+function _gexApplyFilter() {
+  const q = GexState.memberFilter;
+  document.querySelectorAll('#gexMembersArea .gex-user-item').forEach(row => {
+    const text = row.dataset.search || '';
+    row.classList.toggle('hidden-filter', q !== '' && !text.includes(q));
+  });
+  // Pfad-Gruppen ohne sichtbare Zeilen ausblenden
+  document.querySelectorAll('#gexMembersArea .gex-path-group').forEach(pg => {
+    const visible = pg.querySelectorAll('.gex-user-item:not(.hidden-filter)').length > 0;
+    pg.style.display = visible ? '' : 'none';
+  });
+}
+
+function _gexRenderMembers() {
+  const area = document.getElementById('gexMembersArea');
+  if (!area || !GexState.members) return;
+  const m = GexState.members;
+
+  if (m.count === 0) {
+    area.innerHTML = '<div class="gex-empty">Keine Benutzer in dieser Gruppe gefunden.</div>';
+    return;
+  }
+
+  // Nach SourcePath gruppieren
+  const byPath = new Map();
+  for (const u of m.users) {
+    const p = u.SourcePath || m.groupName;
+    if (!byPath.has(p)) byPath.set(p, []);
+    byPath.get(p).push(u);
+  }
+
+  let html = `<div class="gex-summary">${m.count} Benutzer`;
+  if (m.duplicates > 0) html += ` (${m.duplicates} Duplikate aus verschachtelten Gruppen zusammengeführt)`;
+  html += '</div>';
+
+  for (const [path, users] of byPath.entries()) {
+    html += `<div class="gex-path-group">
+      <div class="gex-path-head">${escapeHtml(path)} <span class="count-badge">${users.length}</span></div>
+      <div class="gex-user-list">`;
+    for (const u of users) {
+      const upn = u.UserPrincipalName || u.Mail || u.Id;
+      const searchKey = `${(u.DisplayName || '').toLowerCase()} ${upn.toLowerCase()}`;
+      html += `<div class="gex-user-item" data-search="${escapeHtml(searchKey)}">
+        <span class="gex-user-name">${escapeHtml(u.DisplayName || '—')}</span>
+        <span class="gex-user-upn">${escapeHtml(upn)}</span>
+      </div>`;
+    }
+    html += '</div></div>';
+  }
+
+  area.innerHTML = html;
+  if (GexState.memberFilter) _gexApplyFilter();
+}
+
+document.getElementById('gexExportBtn')?.addEventListener('click', () => {
+  if (!GexState.members?.users) return;
+  const m = GexState.members;
+  const rows = [['DisplayName', 'UserPrincipalName', 'Mail', 'SourcePath', 'GroupId', 'GroupName']];
+  for (const u of m.users) {
+    rows.push([
+      u.DisplayName || '',
+      u.UserPrincipalName || '',
+      u.Mail || '',
+      u.SourcePath || m.groupName,
+      m.groupId,
+      m.groupName,
+    ]);
+  }
+  const csv = rows.map(r =>
+    r.map(v => `"${String(v).replace(/"/g, '""')}"`).join(',')
+  ).join('\r\n');
+  const blob = new Blob(['' + csv], { type: 'text/csv;charset=utf-8;' });
+  const url  = URL.createObjectURL(blob);
+  const a    = document.createElement('a');
+  a.href     = url;
+  a.download = `${m.groupName.replace(/[^a-zA-Z0-9_-]/g, '_')}-members.csv`;
+  a.click();
+  URL.revokeObjectURL(url);
+  toast(`${m.count} Benutzer exportiert.`, 'ok');
+});