V0.1
This commit is contained in:
157
public/options.html
Normal file
157
public/options.html
Normal file
@@ -0,0 +1,157 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Optionen — SDS CRM</title>
|
||||
<link rel="stylesheet" href="/css/style.css" />
|
||||
<link rel="stylesheet" href="/css/pages/options.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<h1><a href="/start.html">SDS CRM</a></h1>
|
||||
<nav id="main-nav" aria-label="Hauptnavigation"></nav>
|
||||
</header>
|
||||
<main id="app" class="main">
|
||||
<p id="page-loading" class="muted">Lade …</p>
|
||||
<p id="page-error" class="error" hidden></p>
|
||||
<div id="page-main" class="stack options-page" hidden>
|
||||
<p><a href="/start.html">← Start</a></p>
|
||||
<h2>Optionen</h2>
|
||||
<p class="muted">Integrationen für das CRM. Werte werden in der Datenbank gespeichert.</p>
|
||||
<form id="form-opt" class="stack">
|
||||
<div class="card options-section ldap-section">
|
||||
<button
|
||||
type="button"
|
||||
class="ldap-section-toggle"
|
||||
id="ldap-toggle"
|
||||
aria-expanded="true"
|
||||
aria-controls="ldap-section-body"
|
||||
>
|
||||
<span class="ldap-section-heading">LDAP-Synchronisation</span>
|
||||
<span class="ldap-chevron" aria-hidden="true">▲</span>
|
||||
</button>
|
||||
<div class="ldap-section-body" id="ldap-section-body">
|
||||
<h4 class="ldap-subtitle">LDAP-Konfiguration</h4>
|
||||
<label class="row-inline ldap-sync-check">
|
||||
<input type="checkbox" name="ldap_syncEnabled" id="ldap_syncEnabled" value="on" />
|
||||
LDAP-Synchronisation aktivieren
|
||||
</label>
|
||||
<div class="form-grid-2">
|
||||
<label
|
||||
>LDAP-Server URL
|
||||
<input
|
||||
name="ldap_serverUrl"
|
||||
id="ldap_serverUrl"
|
||||
type="text"
|
||||
placeholder="ldap://…"
|
||||
autocomplete="off"
|
||||
/></label>
|
||||
<label
|
||||
>Base DN
|
||||
<input name="ldap_searchBase" id="ldap_searchBase" placeholder="DC=…" autocomplete="off"
|
||||
/></label>
|
||||
<label>Bind DN (optional) <input name="ldap_bindDn" id="ldap_bindDn" autocomplete="off" /></label>
|
||||
<label
|
||||
>Bind Passwort (optional)
|
||||
<input
|
||||
name="ldap_bindPassword"
|
||||
id="ldap_bindPassword"
|
||||
type="password"
|
||||
value=""
|
||||
autocomplete="new-password"
|
||||
placeholder="Leer lassen um nicht zu ändern"
|
||||
/></label>
|
||||
</div>
|
||||
<label class="full-width"
|
||||
>User Search Filter
|
||||
<textarea
|
||||
name="ldap_userSearchFilter"
|
||||
id="ldap_userSearchFilter"
|
||||
rows="4"
|
||||
spellcheck="false"
|
||||
class="ldap-filter-ta"
|
||||
></textarea>
|
||||
</label>
|
||||
<div class="form-grid-ldap-attr">
|
||||
<label
|
||||
>Username-Attribut
|
||||
<input
|
||||
name="ldap_usernameAttribute"
|
||||
id="ldap_usernameAttribute"
|
||||
placeholder="sAMAccountName"
|
||||
/></label>
|
||||
<label
|
||||
>Vorname-Attribut
|
||||
<input name="ldap_firstNameAttribute" id="ldap_firstNameAttribute" placeholder="givenName"
|
||||
/></label>
|
||||
<label
|
||||
>Nachname-Attribut
|
||||
<input name="ldap_lastNameAttribute" id="ldap_lastNameAttribute" placeholder="sn"
|
||||
/></label>
|
||||
</div>
|
||||
<label class="full-width"
|
||||
>Sync-Intervall (Minuten)
|
||||
<input
|
||||
name="ldap_syncIntervalMinutes"
|
||||
id="ldap_syncIntervalMinutes"
|
||||
type="number"
|
||||
min="0"
|
||||
step="1"
|
||||
value="1440"
|
||||
/></label>
|
||||
<p class="muted ldap-hint">0 = nur manuelle Synchronisation</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card options-section sync-panel">
|
||||
<h3 class="options-section-title">Synchronisation</h3>
|
||||
<div class="sync-actions">
|
||||
<button type="button" class="btn-ldap-sync-now" id="btn-ldap-sync-now">
|
||||
Synchronisation jetzt starten
|
||||
</button>
|
||||
</div>
|
||||
<p class="muted sync-last-line" id="ldap-last-sync">Letzte Synchronisation: —</p>
|
||||
<h4 class="sync-log-title">Sync-Log (letzte 10 Einträge)</h4>
|
||||
<div class="table-wrap sync-log-table-wrap">
|
||||
<table class="sync-log-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Zeitpunkt</th>
|
||||
<th>Typ</th>
|
||||
<th>Status</th>
|
||||
<th>Benutzer synchronisiert</th>
|
||||
<th>Fehlermeldung</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="sync-log-body"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card options-section">
|
||||
<h3 class="options-section-title">TeamViewer</h3>
|
||||
<p class="muted">
|
||||
API-Aufrufe nutzen den Header
|
||||
<code>Authorization: Bearer <token></code> (nur das Token ohne das Wort „Bearer“
|
||||
eintragen).
|
||||
</p>
|
||||
<label
|
||||
>Bearer-Token
|
||||
<input
|
||||
name="tv_bearerToken"
|
||||
id="tv_bearerToken"
|
||||
type="password"
|
||||
autocomplete="off"
|
||||
placeholder="your_token"
|
||||
spellcheck="false"
|
||||
/></label>
|
||||
<label>Hinweise <textarea name="tv_notes" id="tv_notes" rows="2"></textarea></label>
|
||||
</div>
|
||||
<div class="options-actions">
|
||||
<button type="submit" class="btn-config-save">Konfiguration speichern</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
<script type="module" src="/js/pages/options.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user