feat: Convert email date format from American to European (dd.mm.yyyy)

- Add formatDateGerman() helper function to convert yyyy-mm-dd to dd.mm.yyyy
- Update all email templates (HTML and text versions) to use European date format
- Apply formatting to booking pending, confirmed, and cancelled emails
- Ensure consistent date display across all customer communications
- Improve user experience with familiar German date format

Changes:
- email-templates.ts: Add date formatting to all HTML templates
- bookings.ts: Add date formatting to all text email versions
- Both files: Consistent European date format (dd.mm.yyyy) throughout
This commit is contained in:
2025-09-30 11:42:41 +02:00
parent a1935aae02
commit aeb32da6c2
4 changed files with 60 additions and 7 deletions

View File

@@ -10,6 +10,7 @@ export function BookingForm() {
const [appointmentDate, setAppointmentDate] = useState("");
const [selectedSlotId, setSelectedSlotId] = useState<string>("");
const [notes, setNotes] = useState("");
const [agbAccepted, setAgbAccepted] = useState(false);
const { data: treatments } = useQuery(
queryClient.treatments.live.list.experimental_liveOptions()
@@ -38,6 +39,10 @@ export function BookingForm() {
alert("Bitte fülle alle erforderlichen Felder aus");
return;
}
if (!agbAccepted) {
alert("Bitte bestätige die Kenntnisnahme der Allgemeinen Geschäftsbedingungen");
return;
}
const slot = availableSlots.find((s) => s.id === selectedSlotId);
const appointmentTime = slot?.time || "";
createBooking(
@@ -60,6 +65,7 @@ export function BookingForm() {
setAppointmentDate("");
setSelectedSlotId("");
setNotes("");
setAgbAccepted(false);
alert("Buchung erfolgreich erstellt! Wir werden dich kontaktieren, um deinen Termin zu bestätigen.");
},
}
@@ -88,7 +94,7 @@ export function BookingForm() {
<option value="">Wähle eine Behandlung</option>
{treatments?.map((treatment) => (
<option key={treatment.id} value={treatment.id}>
{treatment.name} - ${(treatment.price / 100).toFixed(2)} ({treatment.duration} min)
{treatment.name} - {(treatment.price / 100).toFixed(2)} ({treatment.duration} Min)
</option>
))}
</select>
@@ -196,6 +202,35 @@ export function BookingForm() {
/>
</div>
{/* AGB Acceptance */}
<div className="bg-gray-50 border border-gray-200 rounded-lg p-4">
<div className="flex items-start space-x-3">
<input
type="checkbox"
id="agb-acceptance"
checked={agbAccepted}
onChange={(e) => setAgbAccepted(e.target.checked)}
className="mt-1 h-4 w-4 text-pink-600 focus:ring-pink-500 border-gray-300 rounded"
required
/>
<div className="flex-1">
<label htmlFor="agb-acceptance" className="text-sm font-medium text-gray-700 cursor-pointer">
Ich habe die <a
href="/AGB.pdf"
target="_blank"
rel="noopener noreferrer"
className="text-pink-600 hover:text-pink-700 underline font-semibold"
>
Allgemeinen Geschäftsbedingungen (AGB)
</a> gelesen und akzeptiere diese *
</label>
<p className="text-xs text-gray-500 mt-1">
📋 Die AGB enthalten wichtige Informationen zu Buchungsgebühren, Stornierungsregeln und unseren Serviceleistungen.
</p>
</div>
</div>
</div>
<button
type="submit"
disabled={isPending}