Feature: WYSIWYG-Editor, Gitea-Sync, Signaturen-Verwaltung
- WYSIWYG-Editor mit contenteditable statt Textarea (MDI-Icons, System-Fonts, Farbwähler) - Gitea-Sync: Templates per Abteilung aus Git-Repo laden/hochladen mit Commit-Author - Abteilungsordner + _gemeinsam Ordner, einzelnes Pull/Push pro Vorlage - Sync-Status pro Vorlage (grün/rot/grau Ampel), persistent über Neustarts - Signaturen-Tab: Identitäten bearbeiten, aus Datei laden, Sync über signatures/ Ordner - Persönliche Signaturen für geteilte E-Mail-Adressen (pro Mitarbeiter) - Tab-Navigation: Vorlagen, Signaturen, Synchronisierung - Auto-Pull beim Thunderbird-Start (Templates + Signaturen)
This commit is contained in:
Kendrick Bollens
@@ -3,6 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Vorlagen verwalten</title>
|
||||
<link rel="stylesheet" href="../lib/mdi/mdi-editor.css">
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
|
||||
@@ -32,6 +33,38 @@
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
.tab-bar {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
margin-bottom: 24px;
|
||||
border-bottom: 2px solid #e0e0e0;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
background: none;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #777;
|
||||
cursor: pointer;
|
||||
border-bottom: 2px solid transparent;
|
||||
margin-bottom: -2px;
|
||||
transition: color 0.15s, border-color 0.15s;
|
||||
}
|
||||
|
||||
.tab-btn:hover { color: #4a7c59; }
|
||||
|
||||
.tab-btn.active {
|
||||
color: #4a7c59;
|
||||
border-bottom-color: #4a7c59;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.tab-content { display: none; }
|
||||
.tab-content.active { display: block; }
|
||||
|
||||
/* Cards */
|
||||
.card {
|
||||
background: white;
|
||||
@@ -64,7 +97,7 @@
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
input[type="text"], textarea {
|
||||
input[type="text"], input[type="password"], textarea {
|
||||
width: 100%;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid #d0d0d0;
|
||||
@@ -75,22 +108,166 @@
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
|
||||
input[type="text"]:focus, textarea:focus {
|
||||
input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
|
||||
outline: none;
|
||||
border-color: #4a7c59;
|
||||
box-shadow: 0 0 0 2px rgba(74, 124, 89, 0.15);
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
input[type="file"] {
|
||||
font-size: 13px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Editor */
|
||||
.editor-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 2px;
|
||||
padding: 6px 8px;
|
||||
background: #fafafa;
|
||||
border: 1px solid #d0d0d0;
|
||||
border-bottom: none;
|
||||
border-radius: 6px 6px 0 0;
|
||||
}
|
||||
|
||||
.editor-toolbar button {
|
||||
padding: 4px 8px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
font-size: 13px;
|
||||
color: #555;
|
||||
transition: background 0.1s, border-color 0.1s;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.editor-toolbar button:hover {
|
||||
background: #e8f0eb;
|
||||
border-color: #c0d4c7;
|
||||
}
|
||||
|
||||
.editor-toolbar .sep {
|
||||
width: 1px;
|
||||
background: #ddd;
|
||||
margin: 2px 4px;
|
||||
}
|
||||
|
||||
.editor-toolbar select {
|
||||
padding: 3px 6px;
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.font-combo {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.font-combo input {
|
||||
width: 140px;
|
||||
padding: 3px 6px;
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.font-combo input:focus {
|
||||
outline: none;
|
||||
border-color: #4a7c59;
|
||||
}
|
||||
|
||||
.font-dropdown {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 200px;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
background: white;
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.12);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.font-dropdown.open { display: block; }
|
||||
|
||||
.font-option {
|
||||
padding: 5px 8px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.font-option:hover, .font-option.active {
|
||||
background: #e8f0eb;
|
||||
color: #4a7c59;
|
||||
}
|
||||
|
||||
#editor-area {
|
||||
width: 100%;
|
||||
min-height: 220px;
|
||||
max-height: 500px;
|
||||
overflow-y: auto;
|
||||
border: 1px solid #d0d0d0;
|
||||
border-radius: 0 0 6px 6px;
|
||||
background: white;
|
||||
padding: 10px 12px;
|
||||
outline: none;
|
||||
font-family: "Segoe UI", Verdana, sans-serif;
|
||||
font-size: 13px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#editor-area:focus {
|
||||
border-color: #4a7c59;
|
||||
box-shadow: 0 0 0 2px rgba(74, 124, 89, 0.15);
|
||||
}
|
||||
|
||||
#editor-area:empty::before {
|
||||
content: "Sehr geehrte/r ...";
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
#editor-area ul, #editor-area ol {
|
||||
padding-left: 24px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
/* Sync indicator dot */
|
||||
.sync-dot {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
margin-right: 6px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.sync-dot.in-sync { background: #4caf50; }
|
||||
.sync-dot.out-of-sync { background: #f44336; }
|
||||
.sync-dot.unknown { background: #bbb; }
|
||||
|
||||
.sync-indicator {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
color: #777;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.editor-wrapper {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn {
|
||||
display: inline-block;
|
||||
@@ -170,6 +347,26 @@
|
||||
transition: background 0.1s, border-color 0.1s;
|
||||
}
|
||||
|
||||
.template-actions .push-btn,
|
||||
.template-actions .pull-btn {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
}
|
||||
.template-actions .push-btn {
|
||||
color: #4a7c59;
|
||||
}
|
||||
.template-actions .push-btn:hover {
|
||||
background: #e8f0eb;
|
||||
border-color: #4a7c59;
|
||||
}
|
||||
.template-actions .pull-btn {
|
||||
color: #2874a6;
|
||||
}
|
||||
.template-actions .pull-btn:hover {
|
||||
background: #e8f0fb;
|
||||
border-color: #2874a6;
|
||||
}
|
||||
|
||||
.template-actions .edit-btn:hover {
|
||||
background: #e8f0eb;
|
||||
border-color: #4a7c59;
|
||||
@@ -203,44 +400,297 @@
|
||||
font-weight: 500;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Sync settings */
|
||||
.sync-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 10px 14px;
|
||||
border-radius: 6px;
|
||||
font-size: 13px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sync-status.connected {
|
||||
background: #e8f5e9;
|
||||
color: #2e7d32;
|
||||
}
|
||||
|
||||
.sync-status.disconnected {
|
||||
background: #fff3e0;
|
||||
color: #e65100;
|
||||
}
|
||||
|
||||
.sync-status.error {
|
||||
background: #ffebee;
|
||||
color: #c62828;
|
||||
}
|
||||
|
||||
.form-group { margin-bottom: 12px; }
|
||||
.form-group label { margin-bottom: 4px; }
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.form-row .form-group { flex: 1; }
|
||||
|
||||
.sync-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
#sync-log {
|
||||
margin-top: 12px;
|
||||
font-size: 12px;
|
||||
color: #777;
|
||||
max-height: 120px;
|
||||
overflow-y: auto;
|
||||
font-family: monospace;
|
||||
background: #fafafa;
|
||||
padding: 8px 10px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #e0e0e0;
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h2>Vorlagen verwalten</h2>
|
||||
|
||||
<!-- Import Section -->
|
||||
<div class="card">
|
||||
<div class="card-title">HTML-Dateien importieren</div>
|
||||
<div class="card-desc">Wähle eine oder mehrere .html Dateien aus (z.B. vom Netzlaufwerk).<br>Dateiname = Vorlagen-Name. Bestehende Vorlagen mit gleichem Namen werden überschrieben.</div>
|
||||
<input type="file" id="import-files" accept=".html,.htm" multiple>
|
||||
<br>
|
||||
<button type="button" class="btn btn-primary" id="import-button">Importieren</button>
|
||||
<span id="import-status" class="status-badge"></span>
|
||||
<!-- Tab Navigation -->
|
||||
<div class="tab-bar">
|
||||
<button class="tab-btn active" data-tab="templates">Vorlagen</button>
|
||||
<button class="tab-btn" data-tab="signatures">Signaturen</button>
|
||||
<button class="tab-btn" data-tab="sync">Synchronisierung</button>
|
||||
</div>
|
||||
|
||||
<!-- Add/Edit Section -->
|
||||
<div class="card">
|
||||
<div class="card-title" id="form-legend">Neue Vorlage erstellen</div>
|
||||
<form id="template-form">
|
||||
<input type="hidden" id="template-id">
|
||||
<label for="template-name">Titel</label>
|
||||
<input type="text" id="template-name" required placeholder="z.B. Buchungsbestätigung">
|
||||
<label for="template-content">Inhalt (HTML)</label>
|
||||
<textarea id="template-content" required placeholder="<p>Sehr geehrte/r ...</p>"></textarea>
|
||||
<button type="submit" class="btn btn-primary" id="save-button">Speichern</button>
|
||||
<button type="button" class="btn btn-secondary" id="cancel-edit" style="display: none;">Abbrechen</button>
|
||||
</form>
|
||||
<!-- Tab: Vorlagen -->
|
||||
<div id="tab-templates" class="tab-content active">
|
||||
|
||||
<!-- Import Section -->
|
||||
<div class="card">
|
||||
<div class="card-title">HTML-Dateien importieren</div>
|
||||
<div class="card-desc">Wähle eine oder mehrere .html Dateien aus (z.B. vom Netzlaufwerk).<br>Dateiname = Vorlagen-Name. Bestehende Vorlagen mit gleichem Namen werden überschrieben.</div>
|
||||
<input type="file" id="import-files" accept=".html,.htm" multiple>
|
||||
<br>
|
||||
<button type="button" class="btn btn-primary" id="import-button">Importieren</button>
|
||||
<span id="import-status" class="status-badge"></span>
|
||||
</div>
|
||||
|
||||
<!-- Add/Edit Section -->
|
||||
<div class="card">
|
||||
<div class="card-title" id="form-legend">Neue Vorlage erstellen</div>
|
||||
<form id="template-form">
|
||||
<input type="hidden" id="template-id">
|
||||
<label for="template-name">Titel</label>
|
||||
<input type="text" id="template-name" required placeholder="z.B. Buchungsbestätigung">
|
||||
|
||||
<label>Inhalt</label>
|
||||
<div class="editor-wrapper">
|
||||
<div class="editor-toolbar">
|
||||
<button type="button" data-cmd="bold" title="Fett"><span class="mdi mdi-format-bold"></span></button>
|
||||
<button type="button" data-cmd="italic" title="Kursiv"><span class="mdi mdi-format-italic"></span></button>
|
||||
<button type="button" data-cmd="underline" title="Unterstrichen"><span class="mdi mdi-format-underline"></span></button>
|
||||
<button type="button" data-cmd="strikeThrough" title="Durchgestrichen"><span class="mdi mdi-format-strikethrough"></span></button>
|
||||
<div class="sep"></div>
|
||||
<select data-cmd="fontSize" title="Schriftgröße">
|
||||
<option value="">Größe</option>
|
||||
<option value="1">Klein</option>
|
||||
<option value="2">Normal</option>
|
||||
<option value="3">Mittel</option>
|
||||
<option value="4">Groß</option>
|
||||
<option value="5">Sehr groß</option>
|
||||
</select>
|
||||
<div class="font-combo" id="font-combo">
|
||||
<input type="text" id="font-input" title="Schriftart" placeholder="Schriftart" autocomplete="off">
|
||||
<div class="font-dropdown" id="font-dropdown"></div>
|
||||
</div>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="foreColor" data-val="ask" title="Textfarbe"><span class="mdi mdi-format-color-text"></span></button>
|
||||
<button type="button" data-cmd="hiliteColor" data-val="ask" title="Hintergrundfarbe"><span class="mdi mdi-format-color-highlight"></span></button>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="insertOrderedList" title="Nummerierte Liste"><span class="mdi mdi-format-list-numbered"></span></button>
|
||||
<button type="button" data-cmd="insertUnorderedList" title="Aufzählung"><span class="mdi mdi-format-list-bulleted"></span></button>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="justifyLeft" title="Links ausrichten"><span class="mdi mdi-format-align-left"></span></button>
|
||||
<button type="button" data-cmd="justifyCenter" title="Zentrieren"><span class="mdi mdi-format-align-center"></span></button>
|
||||
<button type="button" data-cmd="justifyRight" title="Rechts ausrichten"><span class="mdi mdi-format-align-right"></span></button>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="createLink" data-val="ask" title="Link einfügen"><span class="mdi mdi-link"></span></button>
|
||||
<button type="button" data-cmd="removeFormat" title="Formatierung entfernen"><span class="mdi mdi-format-clear"></span></button>
|
||||
</div>
|
||||
<div id="editor-area" contenteditable="true"></div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary" id="save-button">Speichern</button>
|
||||
<button type="button" class="btn btn-secondary" id="cancel-edit" style="display: none;">Abbrechen</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Sync actions for templates -->
|
||||
<div class="card">
|
||||
<div class="sync-indicator" id="tpl-sync-indicator">
|
||||
<span class="sync-dot unknown"></span>
|
||||
<span>Sync-Status unbekannt</span>
|
||||
</div>
|
||||
<div style="display:flex;gap:8px;align-items:center;">
|
||||
<button type="button" class="btn btn-secondary" id="sync-pull-button">Vom Server laden</button>
|
||||
<button type="button" class="btn btn-primary" id="sync-push-button">Änderungen hochladen</button>
|
||||
<span id="sync-sync-status" class="status-badge"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Template List -->
|
||||
<h3>Gespeicherte Vorlagen</h3>
|
||||
<div class="toolbar">
|
||||
<button type="button" class="btn btn-secondary" id="select-all-button">Alle auswählen</button>
|
||||
<button type="button" class="btn btn-danger" id="delete-selected-button">Ausgewählte löschen</button>
|
||||
</div>
|
||||
<div id="templates-list">
|
||||
<p id="no-templates">Keine Vorlagen vorhanden.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Template List -->
|
||||
<h3>Gespeicherte Vorlagen</h3>
|
||||
<div class="toolbar">
|
||||
<button type="button" class="btn btn-secondary" id="select-all-button">Alle auswählen</button>
|
||||
<button type="button" class="btn btn-danger" id="delete-selected-button">Ausgewählte löschen</button>
|
||||
<!-- Tab: Signaturen -->
|
||||
<div id="tab-signatures" class="tab-content">
|
||||
|
||||
<!-- Sync actions for signatures -->
|
||||
<div class="card">
|
||||
<div class="sync-indicator" id="sig-sync-indicator">
|
||||
<span class="sync-dot unknown"></span>
|
||||
<span>Sync-Status unbekannt</span>
|
||||
</div>
|
||||
<div style="display:flex;gap:8px;align-items:center;">
|
||||
<button type="button" class="btn btn-secondary" id="sig-sync-pull">Vom Server laden</button>
|
||||
<button type="button" class="btn btn-primary" id="sig-sync-push">Signaturen hochladen</button>
|
||||
<span id="sig-sync-status" class="status-badge"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-title">E-Mail Signaturen verwalten</div>
|
||||
<div class="card-desc">Hier kannst du die Signaturen deiner Thunderbird-Identitäten bearbeiten. Änderungen werden direkt in Thunderbird übernommen.</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="sig-identity-select">Identität / E-Mail-Adresse</label>
|
||||
<select id="sig-identity-select" style="width:100%;padding:8px 10px;border:1px solid #d0d0d0;border-radius:6px;font-size:13px;">
|
||||
<option value="">— Bitte wählen —</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group" style="display:flex;align-items:center;gap:8px;">
|
||||
<input type="checkbox" id="sig-personal-toggle" style="width:16px;height:16px;accent-color:#4a7c59;">
|
||||
<label for="sig-personal-toggle" style="margin-bottom:0;cursor:pointer;">Persönliche Signatur verwenden</label>
|
||||
<span id="sig-personal-info" style="font-size:11px;color:#999;"></span>
|
||||
</div>
|
||||
|
||||
<label>Signatur</label>
|
||||
<div class="editor-wrapper">
|
||||
<div class="editor-toolbar" id="sig-toolbar">
|
||||
<button type="button" data-cmd="bold" title="Fett"><span class="mdi mdi-format-bold"></span></button>
|
||||
<button type="button" data-cmd="italic" title="Kursiv"><span class="mdi mdi-format-italic"></span></button>
|
||||
<button type="button" data-cmd="underline" title="Unterstrichen"><span class="mdi mdi-format-underline"></span></button>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="foreColor" data-val="ask" title="Textfarbe"><span class="mdi mdi-format-color-text"></span></button>
|
||||
<button type="button" data-cmd="hiliteColor" data-val="ask" title="Hintergrundfarbe"><span class="mdi mdi-format-color-highlight"></span></button>
|
||||
<div class="sep"></div>
|
||||
<button type="button" data-cmd="createLink" data-val="ask" title="Link einfügen"><span class="mdi mdi-link"></span></button>
|
||||
<button type="button" data-cmd="removeFormat" title="Formatierung entfernen"><span class="mdi mdi-format-clear"></span></button>
|
||||
</div>
|
||||
<div id="sig-editor-area" contenteditable="true" style="min-height:120px;max-height:400px;overflow-y:auto;border:1px solid #d0d0d0;border-radius:0 0 6px 6px;background:white;padding:10px 12px;outline:none;font-family:'Segoe UI',Verdana,sans-serif;font-size:13px;color:#333;"></div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top:10px;display:flex;gap:8px;align-items:center;">
|
||||
<button type="button" class="btn btn-primary" id="sig-save-button">Signatur speichern</button>
|
||||
<button type="button" class="btn btn-secondary" id="sig-import-file-btn">Aus Datei laden</button>
|
||||
<input type="file" id="sig-import-file" accept=".html,.htm" style="display:none;">
|
||||
<span id="sig-status" class="status-badge"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="templates-list">
|
||||
<p id="no-templates">Keine Vorlagen vorhanden.</p>
|
||||
|
||||
<!-- Tab: Synchronisierung -->
|
||||
<div id="tab-sync" class="tab-content">
|
||||
|
||||
<!-- Benutzer & Abteilung -->
|
||||
<div class="card">
|
||||
<div class="card-title">Benutzer & Abteilung</div>
|
||||
<div class="card-desc">Dein Name wird bei Änderungen im Commit gespeichert, damit nachvollziehbar ist wer was geändert hat.</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="sync-author-name">Dein Name</label>
|
||||
<input type="text" id="sync-author-name" placeholder="z.B. Max Mustermann">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="sync-author-email">Deine E-Mail (optional)</label>
|
||||
<input type="text" id="sync-author-email" placeholder="z.B. max@hotel-park-soltau.de">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="sync-department">Abteilung</label>
|
||||
<div style="display:flex; gap:8px; align-items:start;">
|
||||
<select id="sync-department" style="flex:1; padding:8px 10px; border:1px solid #d0d0d0; border-radius:6px; font-size:13px;">
|
||||
<option value="">— Bitte wählen —</option>
|
||||
</select>
|
||||
<button type="button" class="btn btn-secondary" id="refresh-departments" title="Abteilungen neu laden" style="white-space:nowrap;">Aktualisieren</button>
|
||||
</div>
|
||||
<div class="card-desc" style="margin-top:6px;">Du erhältst Vorlagen aus deiner Abteilung + dem gemeinsamen Ordner (<code>_gemeinsam</code>).</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Repository-Verbindung -->
|
||||
<div class="card">
|
||||
<div class="card-title">Git-Repository Verbindung</div>
|
||||
<div class="card-desc">Verbinde das Plugin mit einem Gitea/Forgejo Repository, um Vorlagen zentral zu verwalten und zwischen Mitarbeitern zu synchronisieren.</div>
|
||||
|
||||
<div id="sync-status-bar" class="sync-status disconnected">
|
||||
Nicht verbunden
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="sync-url">Server-URL</label>
|
||||
<input type="text" id="sync-url" placeholder="https://git.example.com">
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="sync-owner">Repository-Besitzer</label>
|
||||
<input type="text" id="sync-owner" placeholder="z.B. benutzername">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="sync-repo">Repository-Name</label>
|
||||
<input type="text" id="sync-repo" placeholder="z.B. email-vorlagen">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="sync-branch">Branch</label>
|
||||
<input type="text" id="sync-branch" placeholder="main" value="main">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="sync-token">API-Token</label>
|
||||
<input type="password" id="sync-token" placeholder="Token aus Gitea-Einstellungen">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sync-actions">
|
||||
<button type="button" class="btn btn-primary" id="save-sync-config">Verbindung speichern</button>
|
||||
<button type="button" class="btn btn-secondary" id="test-sync-connection">Verbindung testen</button>
|
||||
<span id="sync-action-status" class="status-badge"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="sync-log"></div>
|
||||
</div>
|
||||
|
||||
<script src="templates_options.js"></script>
|
||||
|
||||
Reference in New Issue
Block a user