feat: authenticated booking

2025-10-24 17:07:08 +02:00
parent 647a25a78f
commit b63804df88
13 changed files with 866 additions and 50 deletions
@@ -0,0 +1,103 @@
+{% extends 'layout.html.twig' %}
+
+{% block content %}
+    {% include '_partials/_flashes.html.twig' %}
+
+    <h1 class="mb-4">
+        Neue Buchung
+    </h1>
+
+    <div class="bg-blue-50 border border-blue-200 rounded-lg p-6 mb-6">
+        <h2 class="text-blue-900 font-semibold text-lg mb-3">
+            Optional: Anmelden für schnelleres Buchen
+        </h2>
+        <p class="text-blue-800 mb-2">
+            Melde dich an, um deine persönlichen Daten automatisch in die Buchung zu übernehmen.
+            Dies ist <strong>vollständig optional</strong> – du kannst auch ohne Anmeldung als Gast fortfahren.
+        </p>
+    </div>
+
+    <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+        {# Login Form #}
+        <div>
+            <h3 class="mb-4 font-semibold text-lg">
+                Mit bestehendem Account anmelden
+            </h3>
+
+            {% if error %}
+                {% include '_partials/_alert.html.twig' with { 'level': 'error', messages: [ error.messageKey|trans(error.messageData, 'security') ] } %}
+            {% endif %}
+
+            <form action="{{ path('app_login') }}" method="post" {{ stimulus_action('loading', 'toggle') }}>
+                <div class="mb-4">
+                    <label for="username" class="mb-1 font-semibold">
+                        E-Mail:
+                    </label>
+                    <input type="email"
+                           id="username"
+                           name="_username"
+                           value="{{ last_username }}"
+                           class="form-field"
+                           required
+                           autocomplete="username">
+                </div>
+
+                <div class="mb-4">
+                    <label for="password" class="mb-1 font-semibold">
+                        Passwort:
+                    </label>
+                    <input type="password"
+                           id="password"
+                           name="_password"
+                           class="form-field"
+                           required
+                           autocomplete="current-password">
+                </div>
+
+                <div class="mb-4">
+                    <label class="flex items-center">
+                        <input type="checkbox" name="_remember_me" class="mr-2">
+                        <span class="text-sm">Angemeldet bleiben</span>
+                    </label>
+                </div>
+
+                <div class="flex flex-col space-y-2">
+                    <button type="submit" class="button bg-button">
+                        Anmelden und fortfahren
+                    </button>
+                    <a href="{{ path('app_reset_password') }}"
+                       class="text-sm text-center text-blue-600 hover:underline">
+                        Passwort vergessen?
+                    </a>
+                </div>
+
+                <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
+            </form>
+        </div>
+
+        {# Continue as Guest #}
+        <div>
+            <h3 class="mb-4 font-semibold text-lg">
+                Als Gast fortfahren
+            </h3>
+
+            <p class="mb-4 text-gray-700">
+                Du kannst auch ohne Anmeldung buchen. Deine persönlichen Daten gibst du dann im nächsten Schritt ein.
+            </p>
+
+            <a href="{{ path('app_booking_create_step_1') }}" class="button bg-button bg-button--secondary w-full block text-center">
+                Als Gast fortfahren
+            </a>
+
+            <div class="mt-6 p-4 bg-gray-50 border border-gray-200 rounded">
+                <h4 class="font-semibold mb-2 text-sm">
+                    Noch kein Account?
+                </h4>
+                <p class="text-sm text-gray-700">
+                    Nach Abschluss deiner Buchung wird automatisch ein Account für dich erstellt.
+                    Du erhältst dann Zugangsdaten per E-Mail und kannst deine Buchungen jederzeit verwalten.
+                </p>
+            </div>
+        </div>
+    </div>
+{% endblock %}