"Refactor template files for improved organization and readability (feat)"

This commit is contained in:
2025-05-29 14:44:03 +02:00
parent 96ae5730b8
commit 87b54d1cea
4 changed files with 583 additions and 212 deletions

View File

@@ -105,60 +105,98 @@
</div>
{% elif request.status == 'approved' %}
<!-- OTP-Code anzeigen -->
{% if otp_code %}
<div class="bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-700 rounded-xl p-6 mb-4">
<div class="text-center">
<h3 class="text-lg font-medium text-green-800 dark:text-green-200 mb-4">Ihr Zugangscode</h3>
<div class="bg-white dark:bg-slate-700 rounded-lg border-2 border-green-300 dark:border-green-600 p-4 mb-4">
<code class="text-3xl font-mono font-bold text-green-800 dark:text-green-200 tracking-widest">{{ otp_code }}</code>
<div class="mb-8 p-6 bg-gradient-to-r from-green-50 to-emerald-50 dark:from-green-900/20 dark:to-emerald-900/20 border border-green-200 dark:border-green-700 rounded-2xl">
<div class="flex items-center mb-4">
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center mr-4">
<svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
</div>
<p class="text-sm text-green-700 dark:text-green-300">
<strong>Wichtig:</strong> Dieser Code ist nur einmalig verwendbar und wird nach der Nutzung gelöscht.
</p>
</div>
</div>
{% endif %}
<!-- Job-Informationen -->
{% if job %}
<div class="bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-700 rounded-xl p-4 mb-4">
<h3 class="text-sm font-medium text-blue-800 dark:text-blue-200 mb-2">Ihr Druckjob</h3>
<div class="space-y-2 text-sm text-blue-700 dark:text-blue-300">
<div class="flex justify-between">
<span>Job-ID:</span>
<span class="font-medium">#{{ job.id }}</span>
</div>
<div class="flex justify-between">
<span>Geplanter Start:</span>
<span class="font-medium">{{ job.start_at|format_datetime }}</span>
</div>
<div class="flex justify-between">
<span>Geplantes Ende:</span>
<span class="font-medium">{{ job.end_at|format_datetime }}</span>
</div>
<div class="flex justify-between">
<span>Status:</span>
<span class="font-medium capitalize">
{% if job.status == 'scheduled' %}Geplant{% elif job.status == 'running' %}Läuft{% elif job.status == 'finished' %}Abgeschlossen{% else %}{{ job.status }}{% endif %}
</span>
<div>
<h3 class="text-lg font-semibold text-green-800 dark:text-green-200">Anfrage genehmigt!</h3>
<p class="text-green-700 dark:text-green-300">Ihr Druckauftrag wurde genehmigt und ist bereit zum Start.</p>
</div>
</div>
{% if otp_code %}
<!-- Code-Anzeige -->
<div class="bg-white dark:bg-slate-800 rounded-xl p-6 mb-6 border border-green-200 dark:border-green-700">
<h4 class="text-lg font-semibold text-slate-900 dark:text-white mb-4 text-center">Ihr Zugangscode</h4>
<!-- 6-stelliger Code in schönen Boxen -->
<div class="flex justify-center space-x-3 mb-4">
{% for char in otp_code %}
<div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-indigo-600 text-white rounded-xl flex items-center justify-center text-2xl font-bold shadow-lg">
{{ char }}
</div>
{% endfor %}
</div>
<!-- Code zum Kopieren -->
<div class="text-center mb-4">
<div class="inline-flex items-center bg-slate-100 dark:bg-slate-700 rounded-lg px-4 py-2">
<span class="text-lg font-mono font-bold text-slate-900 dark:text-white mr-3" id="otpCode">{{ otp_code }}</span>
<button onclick="copyCode()" class="text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300" title="Code kopieren">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"/>
</svg>
</button>
</div>
</div>
<!-- Wichtige Hinweise -->
<div class="bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-700 rounded-lg p-4 mb-4">
<div class="flex items-start">
<div class="w-6 h-6 bg-amber-500 rounded-full flex items-center justify-center mr-3 mt-0.5">
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.732-.833-2.5 0L3.734 16.5c-.77.833.192 2.5 1.732 2.5z"/>
</svg>
</div>
<div>
<h5 class="font-semibold text-amber-800 dark:text-amber-200 mb-2">Wichtige Hinweise:</h5>
<ul class="text-sm text-amber-700 dark:text-amber-300 space-y-1">
<li>• Dieser Code ist nur <strong>einmalig verwendbar</strong></li>
<li>• Notieren Sie sich den Code oder speichern Sie diese Seite</li>
<li>• Bei Verlust des Codes kontaktieren Sie den Administrator</li>
</ul>
</div>
</div>
</div>
<!-- Start-Button -->
<div class="text-center">
<a href="{{ url_for('guest.guest_start_job_form') }}"
class="inline-flex items-center px-8 py-4 bg-gradient-to-r from-green-600 to-emerald-600 text-white font-semibold rounded-2xl hover:from-green-700 hover:to-emerald-700 transform transition-all duration-300 hover:scale-105 shadow-lg">
<svg class="w-6 h-6 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.828 14.828a4 4 0 01-5.656 0M9 10h1m4 0h1m-6 4h.01M12 5v.01M12 19v.01M12 12h.01M12 9a3 3 0 100-6 3 3 0 000 6zm0 0a3 3 0 100 6 3 3 0 000-6z"/>
</svg>
Job jetzt starten
</a>
</div>
</div>
{% elif show_start_link %}
<!-- Code bereits vorhanden, aber noch nicht verwendet -->
<div class="bg-white dark:bg-slate-800 rounded-xl p-6 border border-green-200 dark:border-green-700">
<div class="text-center">
<div class="w-16 h-16 bg-gradient-to-r from-blue-500 to-indigo-500 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-3a1 1 0 011-1h2.586l6.243-6.243A6 6 0 0121 9z"/>
</svg>
</div>
<h4 class="text-lg font-semibold text-slate-900 dark:text-white mb-2">Zugangscode bereits generiert</h4>
<p class="text-slate-600 dark:text-slate-400 mb-6">Ihr persönlicher Code wurde bereits erstellt und ist bereit zur Verwendung.</p>
<a href="{{ url_for('guest.guest_start_job_form') }}"
class="inline-flex items-center px-8 py-4 bg-gradient-to-r from-blue-600 to-indigo-600 text-white font-semibold rounded-2xl hover:from-blue-700 hover:to-indigo-700 transform transition-all duration-300 hover:scale-105 shadow-lg">
<svg class="w-6 h-6 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-3a1 1 0 011-1h2.586l6.243-6.243A6 6 0 0121 9z"/>
</svg>
Code eingeben und starten
</a>
</div>
</div>
{% endif %}
</div>
<!-- Job starten (nur wenn OTP verfügbar und Job noch nicht gestartet) -->
{% if otp_code and job.status == 'scheduled' %}
<div class="text-center">
<button onclick="startJob()" id="startJobBtn"
class="px-8 py-4 bg-gradient-to-r from-green-500 to-green-600 text-white text-lg font-medium rounded-xl hover:from-green-600 hover:to-green-700 transition-all duration-300 shadow-lg disabled:opacity-50 disabled:cursor-not-allowed">
3D-Druck jetzt starten
</button>
<p class="text-xs text-slate-500 dark:text-slate-400 mt-2">
Sie haben bis {{ (job.start_at|as_datetime + timedelta(minutes=5))|format_datetime }} Zeit, den Druck zu starten
</p>
</div>
{% endif %}
{% endif %}
{% elif request.status == 'denied' %}
<div class="bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-700 rounded-xl p-4">