Komplette visuelle Umstellung nach dem generierten Style-Guide
(3d-lehrstun-de-v1.0.0). 3D-Druck-AG bekommt eine eigene Marke,
getrennt vom Teal der arduino.lehrstun.de-Schwester.
Farben: Teal #00979D -> Indigo #5B6EAE, warmes Off-White Surface
#F0EEE9 statt Kuehlweiss, Lavendel-Akzent #9B8EC4.
Fonts: Raleway (Headings), Lato (Body), Inconsolata (Mono) — lokal
gehostet in static/fonts/ (DSGVO-konform, kein Google-CDN),
via @font-face + unicode-range (latin + latin-ext).
Form: Radius/Schatten/Spacing als Tokens (--radius-*, --shadow-*).
Technik:
- base.html :root: neue --color-*/--font-*/--radius-* Tokens,
alte Variablennamen (--primary etc.) als Aliase -> alle 33
Templates ziehen sofort mit, kein Template-Rewrite noetig.
- Semantische Banner-Tokens (--info/warn/success/error-bg+text+border)
loesen ~130 Hardcoded-Pastelle ab (per sed gemappt).
- Komponenten (Card, Button, Badge, Flash, Table, Code) auf Tokens.
Alle 13 Hauptseiten gegengeprueft (HTTP 200, keine Render-Fehler).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
159 lines
8.7 KiB
HTML
159 lines
8.7 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Drucker — Admin{% endblock %}
|
|
{% block content %}
|
|
|
|
<div class="section-header" style="display:flex; justify-content:space-between; align-items:center;">
|
|
<h1>Drucker-Verwaltung</h1>
|
|
<div>
|
|
<a href="{{ url_for('oeffentlich.drucker') }}" class="btn btn-secondary">SuS-Ansicht</a>
|
|
{% if session.admin %}<a href="{{ url_for('admin.dashboard') }}" class="btn btn-secondary">← Dashboard</a>
|
|
{% else %}<a href="{{ url_for('profil.cockpit') }}" class="btn btn-secondary">← Cockpit</a>{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card" style="background:var(--warn-bg); border-left: 4px solid var(--warning);">
|
|
<strong>Hinweis:</strong> Live-Status via Bambu-Cloud-API kommt mit Etappe 5 (siehe
|
|
<code>docs/offene-fragen.md</code> — Bambu-Account muss noch geklaert werden).
|
|
Bis dahin pflegst du den Status hier manuell.
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));">
|
|
{% for d in drucker_liste %}
|
|
<div class="card {% if not d.freigegeben %}drucker-failed{% endif %}"
|
|
style="display: flex; flex-direction: column; gap: 0.8rem;
|
|
{% if not d.freigegeben %}border-left: 4px solid var(--danger);{% endif %}">
|
|
|
|
<div style="display: flex; justify-content: space-between; align-items: baseline;">
|
|
<h2 style="margin: 0; color: var(--primary-dark);">{{ d.name }}</h2>
|
|
<span style="font-size: 0.85rem; color: var(--text-light);">
|
|
{{ d.modell }}{% if not d.geschlossenes_gehaeuse %} · <span style="color: var(--danger);">offen</span>{% endif %}
|
|
</span>
|
|
</div>
|
|
|
|
{# ============== Status setzen ============== #}
|
|
<fieldset style="border: 1px solid var(--border); padding: 0.6rem; border-radius: 4px;">
|
|
<legend style="font-size: 0.8rem; color: var(--text-light); padding: 0 0.3rem;">Status</legend>
|
|
<form method="post" action="{{ url_for('admin.drucker_status_setzen', drucker_id=d.id) }}"
|
|
style="display: grid; gap: 0.4rem;">
|
|
<select name="status" style="padding: 0.4rem; border: 1px solid var(--border); border-radius: 4px;">
|
|
<option value="">— kein Status —</option>
|
|
{% for s, label in status_optionen %}
|
|
<option value="{{ s }}" {% if d.status == s %}selected{% endif %}>{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
<input type="text" name="job_name" value="{{ d.job_name or '' }}" placeholder="Job-Name (optional)"
|
|
style="padding: 0.4rem; border: 1px solid var(--border); border-radius: 4px;">
|
|
<input type="text" name="fehlermeldung" value="{{ d.fehlermeldung or '' }}" placeholder="Fehlermeldung (optional)"
|
|
style="padding: 0.4rem; border: 1px solid var(--border); border-radius: 4px;">
|
|
<button class="btn btn-primary" style="font-size: 0.85rem;">Status speichern</button>
|
|
</form>
|
|
{% if d.gepollt_am %}
|
|
<div style="font-size: 0.75rem; color: var(--text-light); margin-top: 0.4rem;">
|
|
zuletzt: {{ d.gepollt_am[:16].replace('T', ' ') }}
|
|
{% if d.manuell_gesetzt %}· manuell{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</fieldset>
|
|
|
|
{# ============== Freigabe/Sperre ============== #}
|
|
<fieldset style="border: 1px solid var(--border); padding: 0.6rem; border-radius: 4px;">
|
|
<legend style="font-size: 0.8rem; color: var(--text-light); padding: 0 0.3rem;">Reservierungs-Freigabe</legend>
|
|
{% if d.freigegeben %}
|
|
<div style="margin-bottom: 0.4rem; color: var(--success); font-weight: 600;">✅ freigegeben</div>
|
|
<form method="post" action="{{ url_for('admin.drucker_freigabe_toggle', drucker_id=d.id) }}"
|
|
style="display: grid; gap: 0.4rem;">
|
|
<input type="hidden" name="freigeben" value="0">
|
|
<input type="text" name="gesperrt_grund" placeholder="Grund fuer Sperrung (z.B. 'Filament-Wechsel')" required
|
|
style="padding: 0.4rem; border: 1px solid var(--border); border-radius: 4px;">
|
|
<button class="btn btn-secondary" style="font-size: 0.85rem; color: var(--danger);">Sperren</button>
|
|
</form>
|
|
{% else %}
|
|
<div style="margin-bottom: 0.4rem; color: var(--danger); font-weight: 600;">
|
|
🔒 gesperrt{% if d.gesperrt_grund %}: {{ d.gesperrt_grund }}{% endif %}
|
|
</div>
|
|
<form method="post" action="{{ url_for('admin.drucker_freigabe_toggle', drucker_id=d.id) }}">
|
|
<input type="hidden" name="freigeben" value="1">
|
|
<button class="btn btn-primary" style="font-size: 0.85rem;">Wieder freigeben</button>
|
|
</form>
|
|
{% endif %}
|
|
</fieldset>
|
|
|
|
{# ============== Inline-Edit: URLs + Notiz ============== #}
|
|
<fieldset style="border: 1px solid var(--border); padding: 0.6rem; border-radius: 4px;">
|
|
<legend style="font-size: 0.8rem; color: var(--text-light); padding: 0 0.3rem;">
|
|
Links & Notiz <span style="font-style: italic;">(klick zum Editieren)</span>
|
|
</legend>
|
|
|
|
<div style="font-size: 0.85rem; margin-bottom: 0.5rem;">
|
|
<strong>Manual:</strong>
|
|
<span class="edit-feld" data-tabelle="drucker" data-id="{{ d.id }}" data-feld="manual_url"
|
|
data-default="{{ d.manual or '' }}"
|
|
style="cursor: pointer; border-bottom: 1px dashed var(--text-light);">
|
|
{% if d.manual_url %}{{ d.manual_url }}
|
|
{% elif d.manual %}<em style="color: var(--text-light);">{{ d.manual }}</em>
|
|
{% else %}<em style="color: var(--text-light);">[setzen]</em>{% endif %}
|
|
</span>
|
|
{% if d.manual %}<a href="{{ d.manual }}" target="_blank" rel="noopener noreferrer" style="font-size: 0.85rem;">↗</a>{% endif %}
|
|
</div>
|
|
|
|
<div style="font-size: 0.85rem; margin-bottom: 0.5rem;">
|
|
<strong>Troubleshooting:</strong>
|
|
<span class="edit-feld" data-tabelle="drucker" data-id="{{ d.id }}" data-feld="troubleshooting_url"
|
|
style="cursor: pointer; border-bottom: 1px dashed var(--text-light);">
|
|
{% if d.troubleshooting_url %}{{ d.troubleshooting_url }}
|
|
{% elif d.troubleshooting %}<em style="color: var(--text-light);">{{ d.troubleshooting }}</em>
|
|
{% else %}<em style="color: var(--text-light);">[setzen]</em>{% endif %}
|
|
</span>
|
|
{% if d.troubleshooting %}<a href="{{ d.troubleshooting }}" target="_blank" rel="noopener noreferrer" style="font-size: 0.85rem;">↗</a>{% endif %}
|
|
</div>
|
|
|
|
<div style="font-size: 0.85rem;">
|
|
<strong>Notiz:</strong>
|
|
<span class="edit-feld" data-tabelle="drucker" data-id="{{ d.id }}" data-feld="notiz"
|
|
style="cursor: pointer; border-bottom: 1px dashed var(--text-light);">
|
|
{{ d.notiz or '[setzen]' }}
|
|
</span>
|
|
</div>
|
|
|
|
<div style="font-size: 0.75rem; color: var(--text-light); margin-top: 0.5rem; font-style: italic;">
|
|
Tipp: Wenn Manual/Troubleshooting leer, wird der Modell-Default benutzt (kursiv angezeigt).
|
|
</div>
|
|
</fieldset>
|
|
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
{# Minimalistischer Inline-Edit-Handler (prompt-basiert, kein contenteditable).
|
|
Kompatibel zum bestehenden /admin/inline-edit-Endpunkt mit der Whitelist
|
|
in routes/admin.py. #}
|
|
<script>
|
|
document.querySelectorAll('.edit-feld').forEach(function(el) {
|
|
el.addEventListener('click', function() {
|
|
var tabelle = el.dataset.tabelle;
|
|
var id = el.dataset.id;
|
|
var feld = el.dataset.feld;
|
|
var alterWert = el.textContent.trim();
|
|
if (alterWert === '[setzen]') alterWert = '';
|
|
var neu = prompt('Neuer Wert fuer ' + feld + ':', alterWert);
|
|
if (neu === null) return; // abgebrochen
|
|
var fd = new FormData();
|
|
fd.append('tabelle', tabelle);
|
|
fd.append('id', id);
|
|
fd.append('feld', feld);
|
|
fd.append('wert', neu);
|
|
fetch('{{ url_for("admin.inline_edit") }}', {method: 'POST', body: fd})
|
|
.then(function(r) { return r.json(); })
|
|
.then(function(data) {
|
|
if (data.ok) { location.reload(); }
|
|
else { alert('Fehler: ' + (data.error || 'unbekannt')); }
|
|
})
|
|
.catch(function() { alert('Verbindungsfehler'); });
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %}
|