- Introduce helper functions `_outlook_font` and `_outlook_link` for better formatting in Outlook-compatible HTML. - Update `create_outlook_html` to utilize new font and link functions, improving the overall appearance of the newsletter. - Modify CSS to add styles for a new copy dialog overlay and related components. - Refactor JavaScript to improve copy functionality and add a dialog for copying HTML content. - Update dashboard template to enhance user instructions for copying and downloading HTML content.
205 lines
9.2 KiB
HTML
205 lines
9.2 KiB
HTML
{% extends "base.html" %}
|
||
{% block content %}
|
||
<section class="card">
|
||
<h2>Newsletter erstellen</h2>
|
||
<form method="post" action="/dashboard" class="form-grid">
|
||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||
<label>Zeitraum (Tage)
|
||
<input type="number" name="days" min="1" max="90" value="{{ filters.days }}">
|
||
</label>
|
||
<label>Kategorie (optional)
|
||
<input type="text" name="category" value="{{ filters.category }}">
|
||
</label>
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="only_edited" value="true" {% if filters.only_edited %}checked{% endif %}>
|
||
Nur bearbeitete Artikel (keine neu erstellten)
|
||
</label>
|
||
<fieldset class="display-options">
|
||
<legend>Anzeige im Output</legend>
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="show_date" value="true" {% if filters.display.show_date %}checked{% endif %}>
|
||
Datum anzeigen
|
||
</label>
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="show_user" value="true" {% if filters.display.show_user %}checked{% endif %}>
|
||
Benutzer anzeigen
|
||
</label>
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="show_category" value="true" {% if filters.display.show_category %}checked{% endif %}>
|
||
Kategorie anzeigen
|
||
</label>
|
||
</fieldset>
|
||
{% if user.role in ["admin", "editor"] %}
|
||
<button type="submit">Newsletter generieren</button>
|
||
{% endif %}
|
||
</form>
|
||
{% if user.role == "admin" %}
|
||
<p><a href="/admin/users">Zur Benutzerverwaltung</a></p>
|
||
{% endif %}
|
||
{% if wiki_error %}
|
||
<p class="error">{{ wiki_error }}</p>
|
||
{% endif %}
|
||
</section>
|
||
|
||
{% if user.role in ["admin", "editor"] %}
|
||
<section class="card">
|
||
<h3>Optionaler SMTP-Versand</h3>
|
||
<form method="post" action="/newsletter/send-now" class="form-grid">
|
||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||
<input type="hidden" name="days" value="{{ filters.days }}">
|
||
<input type="hidden" name="category" value="{{ filters.category }}">
|
||
<input type="hidden" name="only_edited" value="{{ 'true' if filters.only_edited else 'false' }}">
|
||
<input type="hidden" name="show_date" value="{{ 'true' if filters.display.show_date else 'false' }}">
|
||
<input type="hidden" name="show_user" value="{{ 'true' if filters.display.show_user else 'false' }}">
|
||
<input type="hidden" name="show_category" value="{{ 'true' if filters.display.show_category else 'false' }}">
|
||
<button type="submit">Newsletter jetzt senden</button>
|
||
</form>
|
||
</section>
|
||
{% endif %}
|
||
|
||
{% if user.role == "admin" %}
|
||
<section class="card">
|
||
<h3>SMTP-Konfiguration (optional)</h3>
|
||
<form method="post" action="/admin/smtp" class="form-grid">
|
||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="enabled" value="true" {% if smtp.enabled == "true" %}checked{% endif %}>
|
||
SMTP Versand aktivieren
|
||
</label>
|
||
<label>SMTP Host
|
||
<input type="text" name="host" value="{{ smtp.host }}">
|
||
</label>
|
||
<label>SMTP Port
|
||
<input type="number" name="port" value="{{ smtp.port }}">
|
||
</label>
|
||
<label>Benutzername
|
||
<input type="text" name="username" value="{{ smtp.username }}">
|
||
</label>
|
||
<label>Passwort
|
||
<input type="password" name="password" value="{{ smtp.password }}">
|
||
</label>
|
||
<label>Absender E-Mail
|
||
<input type="email" name="from_email" value="{{ smtp.from_email }}">
|
||
</label>
|
||
<label class="checkbox">
|
||
<input type="checkbox" name="use_tls" value="true" {% if smtp.use_tls == "true" %}checked{% endif %}>
|
||
STARTTLS verwenden
|
||
</label>
|
||
<label>Verteilerliste (Komma-separiert)
|
||
<textarea rows="3" name="recipients">{{ smtp.recipients }}</textarea>
|
||
</label>
|
||
<label>Geplanter täglicher Versand (HH:MM)
|
||
<input type="time" name="schedule_time" value="{{ smtp.schedule_time }}">
|
||
</label>
|
||
<button type="submit">SMTP Einstellungen speichern</button>
|
||
</form>
|
||
</section>
|
||
{% endif %}
|
||
|
||
<section class="card">
|
||
<h3>Newsletter-Vorschau (mit Hyperlinks)</h3>
|
||
<p class="hint"><strong>Empfohlen für Outlook:</strong> „Im Browser öffnen“ → dort <strong>Strg+A</strong>, <strong>Strg+C</strong> → in Outlook <strong>Strg+V</strong>. Alternativ „Für Outlook kopieren“ und mit Rechtsklick → „Format beibehalten“ einfügen.</p>
|
||
<div class="copy-actions">
|
||
<button type="button" id="open-outlook-btn" class="btn-secondary">Im Browser öffnen</button>
|
||
<button type="button" id="copy-outlook-btn" class="btn-secondary">Für Outlook kopieren</button>
|
||
<button type="button" id="copy-html-source-btn" class="btn-secondary">HTML-Quelltext kopieren</button>
|
||
<button type="button" id="download-html-btn" class="btn-secondary">HTML herunterladen</button>
|
||
<span id="copy-status" class="copy-status" aria-live="polite"></span>
|
||
</div>
|
||
<iframe id="newsletter-preview-frame" class="newsletter-preview-frame" title="Newsletter Vorschau"></iframe>
|
||
<textarea id="newsletter-html-source" class="hidden-source" hidden readonly>{{ raw_html }}</textarea>
|
||
<textarea id="newsletter-outlook-source" class="hidden-source" hidden readonly>{{ outlook_html }}</textarea>
|
||
<textarea id="newsletter-plain-source" class="hidden-source" hidden readonly>{{ plain_text }}</textarea>
|
||
</section>
|
||
|
||
<section class="card">
|
||
<h3>Output: Nur-Text (Fallback)</h3>
|
||
<p class="hint">Enthält URLs als Text. Für klickbare Links bitte die Vorschau bzw. „Für Outlook kopieren“ verwenden.</p>
|
||
<textarea rows="16" readonly>{{ plain_text }}</textarea>
|
||
</section>
|
||
|
||
<section class="card">
|
||
<h3>Output: HTML-Quelltext</h3>
|
||
<p class="hint">Öffnet ein Fenster mit markiertem Text – dort <strong>Strg+C</strong> drücken. Funktioniert auch ohne HTTPS.</p>
|
||
<div class="textarea-actions">
|
||
<button type="button" id="copy-html-source-btn-2" class="btn-secondary">HTML-Quelltext kopieren</button>
|
||
<button type="button" id="download-html-source-btn" class="btn-secondary">HTML-Quelltext herunterladen</button>
|
||
</div>
|
||
<textarea id="newsletter-html-display" rows="12" readonly>{{ raw_html }}</textarea>
|
||
</section>
|
||
|
||
<section class="card">
|
||
<h3>Neue Artikel ({{ articles_new|length }})</h3>
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Titel</th>
|
||
{% if filters.display.show_date %}<th>Zeit</th>{% endif %}
|
||
{% if filters.display.show_user %}<th>Benutzer</th>{% endif %}
|
||
{% if filters.display.show_category %}<th>Kategorien</th>{% endif %}
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for item in articles_new %}
|
||
<tr>
|
||
<td><a href="{{ wiki_article_url(item.title) }}" target="_blank" rel="noopener">{{ item.title }}</a></td>
|
||
{% if filters.display.show_date %}<td>{{ item.timestamp }}</td>{% endif %}
|
||
{% if filters.display.show_user %}<td>{{ item.user }}</td>{% endif %}
|
||
{% if filters.display.show_category %}<td>{{ item.categories|join(", ") }}</td>{% endif %}
|
||
</tr>
|
||
{% else %}
|
||
<tr><td colspan="4">Keine neuen Artikel im gewählten Zeitraum.</td></tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<section class="card">
|
||
<h3>Bearbeitete Artikel ({{ articles_edited|length }})</h3>
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Titel</th>
|
||
{% if filters.display.show_date %}<th>Zeit</th>{% endif %}
|
||
{% if filters.display.show_user %}<th>Benutzer</th>{% endif %}
|
||
{% if filters.display.show_category %}<th>Kategorien</th>{% endif %}
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for item in articles_edited %}
|
||
<tr>
|
||
<td><a href="{{ wiki_article_url(item.title) }}" target="_blank" rel="noopener">{{ item.title }}</a></td>
|
||
{% if filters.display.show_date %}<td>{{ item.timestamp }}</td>{% endif %}
|
||
{% if filters.display.show_user %}<td>{{ item.user }}</td>{% endif %}
|
||
{% if filters.display.show_category %}<td>{{ item.categories|join(", ") }}</td>{% endif %}
|
||
</tr>
|
||
{% else %}
|
||
<tr><td colspan="4">Keine bearbeiteten Artikel im gewählten Zeitraum.</td></tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<section class="card">
|
||
<h3>Versandprotokoll (letzte 20)</h3>
|
||
<table>
|
||
<thead><tr><th>Zeit</th><th>Status</th><th>Betreff</th><th>Empfänger</th><th>Details</th></tr></thead>
|
||
<tbody>
|
||
{% for log in send_logs %}
|
||
<tr>
|
||
<td>{{ log.created_at }}</td>
|
||
<td>{{ log.status }}</td>
|
||
<td>{{ log.subject }}</td>
|
||
<td>{{ log.recipients }}</td>
|
||
<td>{{ log.detail }}</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
{% endblock %}
|
||
|
||
{% block scripts %}
|
||
<script src="/static/js/newsletter.js?v=5"></script>
|
||
{% endblock %}
|