194 lines
10 KiB
Twig
194 lines
10 KiB
Twig
<div class="booking-summary p-8 bg-gray-50 rounded-lg border sticky top-4">
|
|
<h3 class="font-bold text-xl mb-6 text-gray-800">Buchungsübersicht</h3>
|
|
|
|
{# Inquiry booking notification #}
|
|
{% if bookingCreateDto is defined and bookingCreateDto.isInquiryBooking() %}
|
|
<div class="mb-4 p-3 bg-yellow-50 border border-yellow-200 rounded text-sm text-yellow-800">
|
|
<span class="font-semibold">Anfragebuchung:</span> Diese Reise ist ausgebucht. Ihre Buchung wird als Anfrage verarbeitet.
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Mutability information (edit mode only) #}
|
|
{% if mutableData is defined %}
|
|
<div class="mb-6 pb-4 border-b border-gray-200">
|
|
<h4 class="font-semibold text-lg mb-3 text-gray-800">Aktualisierung möglich bis</h4>
|
|
<ul class="space-y-1 text-sm text-gray-600">
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>
|
|
<span class="font-medium">Zusatzleistungen:</span>
|
|
{% if mutableData.items['additional_services'].mutable %}
|
|
{{ mutableData.items['additional_services'].mutableBefore|date('d.m.Y') }}
|
|
{% else %}
|
|
<span class="text-red-600">nicht mehr möglich</span>
|
|
{% endif %}
|
|
</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>
|
|
<span class="font-medium">Beförderung:</span>
|
|
{% if mutableData.items['transportation'].mutable %}
|
|
{{ mutableData.items['transportation'].mutableBefore|date('d.m.Y') }}
|
|
{% else %}
|
|
<span class="text-red-600">nicht mehr möglich</span>
|
|
{% endif %}
|
|
</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>
|
|
<span class="font-medium">Zustiege:</span>
|
|
{% if mutableData.items['pickup'].mutable %}
|
|
{{ mutableData.items['pickup'].mutableBefore|date('d.m.Y') }}
|
|
{% else %}
|
|
<span class="text-red-600">nicht mehr möglich</span>
|
|
{% endif %}
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Travel Information #}
|
|
<div class="mb-6 pb-4 border-b border-gray-200">
|
|
{% if summaryData.cmsData.hotel.images is defined %}
|
|
<img src="{{ summaryData.cmsData.hotel.images.resized.l[0].url }}" alt="{{ summaryData.cmsData.hotel.images.resized.s[0].alt }}" class="w-full rounded mb-4">
|
|
{% endif %}
|
|
<div class="space-y-2 text-sm text-gray-600">
|
|
<div><span class="font-medium">Reise:</span> {{ bookingCreateDto.travel.label }}</div>
|
|
{% if summaryData.cmsData.region is defined %}
|
|
<div><span class="font-medium">Gebiet:</span> {{ summaryData.cmsData.region.name }}</div>
|
|
{% endif %}
|
|
{% if summaryData.cmsData.country is defined %}
|
|
<div><span class="font-medium">Land:</span> {{ summaryData.cmsData.country.name }}</div>
|
|
{% endif %}
|
|
<div><span class="font-medium">Zeitraum:</span> {{ bookingCreateDto.travel.dateFrom|date('d.m.Y') }} - {{ bookingCreateDto.travel.dateTo|date('d.m.Y') }}</div>
|
|
<div><span class="font-medium">Unterkunft:</span> {{ bookingCreateDto.travel.hotel.name }}{% if summaryData.cmsData.hotel.address is defined %}, {{ summaryData.cmsData.hotel.address | replace({"\n": ', '}) }}{% endif %}</div>
|
|
<div><span class="font-medium">Anzahl Teilnehmer:</span> {{ summaryData.participantCount }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
{# Rooms Section #}
|
|
{% if summaryData.pricingData.rooms is not empty %}
|
|
<div class="mb-6 pb-4 border-b border-gray-200">
|
|
<h4 class="font-semibold text-lg mb-3 text-gray-800">Unterkunft</h4>
|
|
<div class="space-y-2">
|
|
{% for roomPricing in summaryData.pricingData.rooms %}
|
|
<div class="flex justify-between items-start">
|
|
<div class="text-sm text-gray-600">
|
|
<span class="font-medium">{{ roomPricing.quantity }}x {{ roomPricing.label }}</span>
|
|
{% if summaryData.assignmentCounts[roomPricing.roomId] is defined %}
|
|
<span class="block text-xs text-gray-500">{{ summaryData.assignmentCounts[roomPricing.roomId] }} belegt</span>
|
|
{% endif %}
|
|
</div>
|
|
<div class="text-right">
|
|
<div class="text-gray-900">
|
|
€{{ roomPricing.totalPrice|number_format(2, ',', '.') }}
|
|
</div>
|
|
<div class="text-xs text-gray-500">
|
|
€{{ roomPricing.unitPrice|number_format(2, ',', '.') }} pro Person
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Services Section #}
|
|
{% if summaryData.pricingData.services is not empty %}
|
|
<div class="mb-6">
|
|
<h4 class="font-semibold text-lg mb-3 text-gray-800">Leistungen</h4>
|
|
{% for serviceGroup in summaryData.pricingData.services %}
|
|
<div class="mb-4 last:mb-0">
|
|
<h5 class="font-medium text-sm text-gray-700 mb-2 uppercase tracking-wide">{{ serviceGroup.groupName }}</h5>
|
|
<div class="space-y-1 ml-4">
|
|
{% for servicePricing in serviceGroup.services %}
|
|
<div class="flex justify-between items-center text-sm">
|
|
<span class="text-gray-600">
|
|
{{ servicePricing.participantCount }}x {{ servicePricing.label }}
|
|
</span>
|
|
<span class="font-medium text-gray-900">
|
|
€{{ servicePricing.totalPrice|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Surcharges Section (Edit mode only) #}
|
|
{% if summaryData.pricingData.surcharges is defined and summaryData.pricingData.surcharges is not empty %}
|
|
<div class="mb-6 pb-4 border-b border-gray-200">
|
|
<h4 class="font-semibold text-lg mb-3 text-gray-800">Zuschläge</h4>
|
|
<div class="space-y-1">
|
|
{% for surchargePricing in summaryData.pricingData.surcharges %}
|
|
<div class="flex justify-between items-center text-sm">
|
|
<span class="text-gray-600">
|
|
{{ surchargePricing.participantCount }}x {{ surchargePricing.label }}
|
|
</span>
|
|
<span class="font-medium text-gray-900">
|
|
€{{ surchargePricing.totalPrice|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Total Section #}
|
|
{% if summaryData.pricingData.grandTotal is defined and summaryData.pricingData.grandTotal > 0 %}
|
|
<div class="pt-4 border-t-2 border-gray-300">
|
|
{# Show subtotal and voucher discounts when vouchers are applied #}
|
|
{% set acceptedVouchers = bookingCreateDto.getAcceptedVouchers() %}
|
|
{% if acceptedVouchers and acceptedVouchers.hasVouchers() %}
|
|
{# Subtotal before vouchers #}
|
|
<div class="flex justify-between items-center mb-2">
|
|
<span class="text-gray-600">Gesamtpreis:</span>
|
|
<span class="text-gray-900">
|
|
€{{ summaryData.pricingData.grandTotal|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
|
|
{# Voucher discounts breakdown #}
|
|
<div class="mb-3 space-y-1">
|
|
{% for voucher in acceptedVouchers.vouchers %}
|
|
<div class="flex justify-between items-center text-sm">
|
|
<span class="text-gray-600">
|
|
{% if voucher.promotional %}
|
|
Aktionsgutschein ({{ voucher.code }})
|
|
{% elseif voucher.goodwill %}
|
|
Kulanzgutschein ({{ voucher.code }})
|
|
{% elseif voucher.purchase %}
|
|
Kaufgutschein ({{ voucher.code }})
|
|
{% endif %}
|
|
</span>
|
|
<span class="font-medium text-green-600">
|
|
-€{{ voucher.amount|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{# Amount to pay after vouchers #}
|
|
<div class="flex justify-between items-center pt-2 border-t border-gray-200">
|
|
<span class="font-bold text-lg text-gray-800">Zu zahlen:</span>
|
|
<span class="font-bold text-xl text-gray-900" {{ qa_attribute('summary-total') }}>
|
|
€{{ (summaryData.pricingData.grandTotal - acceptedVouchers.totalDiscount)|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
{% else %}
|
|
<div class="flex justify-between items-center">
|
|
<span class="font-bold text-lg text-gray-800">Gesamtpreis:</span>
|
|
<span class="font-bold text-xl text-gray-900" {{ qa_attribute('summary-total') }}>
|
|
€{{ summaryData.pricingData.grandTotal|number_format(2, ',', '.') }}
|
|
</span>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|