EP/myep
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: hide pickup select on initial load when not applicable

Browse Source
This commit is contained in:
Björn Fromme
2025-01-16 14:54:46 +01:00
parent 9dc0992263
commit 6473ec8ec4
2 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/controllers/select_toggle_controller.js
+7 -4
View File
@@ -4,18 +4,21 @@ export default class extends Controller {
static classes = [ 'hidden' ] static classes = [ 'hidden' ]
static targets = [ 'container' ] static targets = [ 'container' ]
static values = { show: Array } static values = { show: Array, visible: Boolean }
toggle(event) { toggle(event) {
let fieldType = event.target.type let fieldType = event.target.type
let formValue = event.target.value let formValue = event.target.value
let showContainer let showContainer
if ('checkbox' !== fieldType && 'radio' !== fieldType) { if ('checkbox' !== fieldType && 'radio' !== fieldType) {
showContainer = this.showValue.indexOf(formValue) !== -1 this.visibleValue = this.showValue.indexOf(formValue) !== -1
} else { } else {
let toggleValue = event.target.dataset.selectToggleValue let toggleValue = event.target.dataset.selectToggleValue
showContainer = true === event.target.checked && this.showValue.includes(toggleValue) this.visibleValue = true === event.target.checked && this.showValue.includes(toggleValue)
} }
this.containerTarget.classList.toggle(this.hiddenClass, false === showContainer) }
visibleValueChanged(visible) {
this.containerTarget.classList.toggle(this.hiddenClass, false === visible)
} }
} }
templates/booking/edit.html.twig
+9 -9
View File
@@ -130,7 +130,7 @@
<div class="hidden" {{ stimulus_target('toggle', 'toggle') }}> <div class="hidden" {{ stimulus_target('toggle', 'toggle') }}>
<div class="flex flex-col space-y-4 pt-4"> <div class="flex flex-col space-y-4 pt-4">
<div class="relative"> <div class="relative">
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Persönliche Daten Persönliche Daten
</h3> </h3>
<fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4 pb-4"> <fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4 pb-4">
@@ -154,14 +154,14 @@
{% endif %} {% endif %}
</div> </div>
<div> <div>
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Unterkunft Unterkunft
</h3> </h3>
{% set room = bookingData.roomForParticipant(participant.index) %} {% set room = bookingData.roomForParticipant(participant.index) %}
{{ room.label }} ({{ room.individualPrice[participant.index]|format_currency('EUR') }}) {{ room.label }} ({{ room.individualPrice[participant.index]|format_currency('EUR') }})
</div> </div>
<div class="relative"> <div class="relative">
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Leistungen Leistungen
</h3> </h3>
<fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4"> <fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4">
@@ -182,14 +182,14 @@
{% endif %} {% endif %}
</fieldset> </fieldset>
{% if not travelData.additionalServicesMutable %} {% if not travelData.additionalServicesMutable %}
<div class="absolute top-0 left-0 inset-0 cursor-not-allowed"></div> <div class="absolute inset-0 cursor-not-allowed"></div>
{% endif %} {% endif %}
</div> </div>
<div class="relative"> <div class="relative">
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Hin-/Rückreise Hin-/Rückreise
</h3> </h3>
<fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4" {{ stimulus_controller('select-toggle', { 'show': ['BUS'] }, { 'hidden': 'hidden' }) }}> <fieldset class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4" {{ stimulus_controller('select-toggle', { 'show': ['BUS'], 'visible': participant.transportationServiceTo.subType == 'BUS' }, { 'hidden': 'hidden' }) }}>
{{ form_row(child.transportationServiceTo) }} {{ form_row(child.transportationServiceTo) }}
{{ form_row(child.transportationServiceFro) }} {{ form_row(child.transportationServiceFro) }}
{% if child.pickup is defined %} {% if child.pickup is defined %}
@@ -199,12 +199,12 @@
{% endif %} {% endif %}
</fieldset> </fieldset>
{% if not travelData.transportationServicesMutable %} {% if not travelData.transportationServicesMutable %}
<div class="absolute top-0 left-0 inset-0 cursor-not-allowed"></div> <div class="absolute inset-0 cursor-not-allowed"></div>
{% endif %} {% endif %}
</div> </div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-4">
<div> <div>
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Gesamtpreis Gesamtpreis
</h3> </h3>
<span class="text-2xl font-medium">{{ bookingData.priceForParticipant(participant.index)|format_currency('EUR') }}</span> <span class="text-2xl font-medium">{{ bookingData.priceForParticipant(participant.index)|format_currency('EUR') }}</span>
@@ -212,7 +212,7 @@
{% set surcharges = bookingData.surchargesForParticipant(participant.index) %} {% set surcharges = bookingData.surchargesForParticipant(participant.index) %}
{% if surcharges|length > 0 %} {% if surcharges|length > 0 %}
<div> <div>
<h3 class="text-xl font-semibold pb-2"> <h3 class="text-xl font-semibold">
Zuschläge Zuschläge
</h3> </h3>
<ul> <ul>