feat: improved form layout

This commit is contained in:
Björn Fromme
2025-09-30 17:11:30 +02:00
parent e37b6234e8
commit 372490ed5a
+63 -54
View File
@@ -1,5 +1,55 @@
{% extends 'layout.html.twig' %}
{# Local form theme override for consistent fieldset rendering #}
{% use 'forms.html.twig' %}
{% block form_row %}
{%- if form.vars.expanded is defined and form.vars.expanded -%}
{# Expanded forms get fieldset wrapper #}
<fieldset class="mb-1">
<legend class="font-semibold mb-1">
{{- form.vars.label -}}
</legend>
{{- form_widget(form, {
'attr': attr|default({})
}) -}}
{{- form_errors(form) -}}
{{- form_help(form) -}}
</fieldset>
{%- else -%}
{{- parent() -}}
{%- endif -%}
{% endblock %}
{% import _self as macros %}
{# Macro to render a field or placeholder with consistent fieldset structure #}
{% macro service_field(participant, fieldName, label, options = {}) %}
{% if participant[fieldName] is defined %}
{{ form_row(participant[fieldName], options) }}
{% else %}
<fieldset class="mb-1">
<legend class="font-semibold mb-1">{{ label }}</legend>
<div class="text-sm text-gray-500">Nicht wählbar</div>
</fieldset>
{% endif %}
{% endmacro %}
{# Specialized macro for checkbox fields (like rental insurance) that need manual fieldset wrapping #}
{% macro checkbox_field(participant, fieldName, label, options = {}) %}
{% if participant[fieldName] is defined %}
<fieldset class="mb-1">
<legend class="font-semibold mb-1">{{ label }}</legend>
{{ form_row(participant[fieldName], options) }}
</fieldset>
{% else %}
<fieldset class="mb-1">
<legend class="font-semibold mb-1">{{ label }}</legend>
<div class="text-sm text-gray-500">Nicht wählbar</div>
</fieldset>
{% endif %}
{% endmacro %}
{% block content %}
{% include '_partials/_flashes.html.twig' %}
<h1>Neue Buchung</h1>
@@ -86,102 +136,61 @@
{% endif %}
<div class="grid grid-cols-2 gap-4">
{% if participant.skiPass is defined %}
{{ form_row(participant.skiPass, {
{{ _self.service_field(participant, 'skiPass', 'Skipass', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Skipass nicht wählbar
</div>
{% endif %}
{% if participant.courses is defined %}
{{ form_row(participant.courses, {
{{ _self.service_field(participant, 'courses', 'Kurse', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Kurse nicht wählbar
</div>
{% endif %}
{% if participant.additionalServices is defined %}
{{ form_row(participant.additionalServices, {
{{ _self.service_field(participant, 'additionalServices', 'Zusatzleistungen', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Zusatzleistungen nicht wählbar
</div>
{% endif %}
{% if participant.rentals is defined %}
{{ form_row(participant.rentals, {
{{ _self.service_field(participant, 'rentals', 'Leihmaterial', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Leihmaterial nicht wählbar
</div>
{% endif %}
{% if participant.rentalInsurance is defined %}
<fieldset>
<legend class="font-semibold mb-1">
Leihmaterial-Versicherung
</legend>
{{ form_row(participant.rentalInsurance, {
{{ _self.checkbox_field(participant, 'rentalInsurance', 'Leihmaterial-Versicherung', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
</fieldset>
{% else %}
<div>
Leihmat.-Versicherung nicht wählbar
</div>
{% endif %}
{% if participant.board is defined %}
{{ form_row(participant.board, {
{{ _self.service_field(participant, 'board', 'Verpflegung', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Verpflegung nicht wählbar
</div>
{% endif %}
{% if participant.insurance is defined %}
{{ form_row(participant.insurance, {
{{ _self.service_field(participant, 'insurance', 'Reiseversicherung', {
'attr': {
'hx-trigger': 'change',
'hx-post': path('app_booking_create_step_2_refresh'),
'hx-swap': 'none'
}
}) }}
{% else %}
<div>
Versicherung nicht wählbar
</div>
{% endif %}
</div>
{# Transportation Services Section #}