EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: special treatment for single nights in price calculator

Browse Source 
closes #8697b8j21
This commit is contained in:
Björn Fromme
2025-01-30 15:07:35 +01:00
parent ea9c62087c
commit f5ef4168d5
1 changed files with 28 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/GroupsPriceCalculator.vue
+28 -22
View File
@@ -8,6 +8,10 @@
<input type="text" <input type="text"
class="form-field" class="form-field"
placeholder="von... bis" ref="picker"/> placeholder="von... bis" ref="picker"/>
<p class="text-sm italic"
v-show="nightsCount === 1">
Einzelne Nächte sind nur auf Anfrage buchbar
</p>
</div> </div>
<div class="mb-8" <div class="mb-8"
v-show="!submitted"> v-show="!submitted">
@@ -153,7 +157,7 @@
<div class="mb-8" <div class="mb-8"
v-show="nightsCount > 0 && !submitted"> v-show="nightsCount > 0 && !submitted">
<div class="p-2 uppercase bg-ep-primary-dark text-white w-full"> <div class="p-2 uppercase bg-ep-primary-dark text-white w-full">
Jetzt buchen Jetzt <span v-if="!forceInquiry">buchen</span><span v-if="forceInquiry">anfragen</span>
</div> </div>
<div class="bg-zinc-100 p-2"> <div class="bg-zinc-100 p-2">
<div class="grid md:grid-cols-2 gap-4 mb-4"> <div class="grid md:grid-cols-2 gap-4 mb-4">
@@ -230,13 +234,15 @@
<div class="flex items-center space-x-2"> <div class="flex items-center space-x-2">
<button class="button bg-button" <button class="button bg-button"
type="submit" type="submit"
v-if="!forceInquiry"
@click.prevent="submitForm('booking')"> @click.prevent="submitForm('booking')">
Buchung abschicken Buchung abschicken
</button> </button>
<button class="button bg-button button--small bg-ep-secondary" <button class="button bg-button"
:class="{ 'button--small bg-ep-secondary': !forceInquiry }"
type="submit" type="submit"
@click.prevent="submitForm('inquiry')"> @click.prevent="submitForm('inquiry')">
nur als Anfrage senden als Anfrage senden
</button> </button>
</div> </div>
</div> </div>
@@ -256,7 +262,6 @@ import 'dayjs/locale/de'
import 'flatpickr'; import 'flatpickr';
import {German} from 'flatpickr/dist/l10n/de'; import {German} from 'flatpickr/dist/l10n/de';
import Vue from 'vue'; import Vue from 'vue';
import axios from 'axios';
export default { export default {
name: 'GroupsPriceCalculator', name: 'GroupsPriceCalculator',
@@ -404,30 +409,31 @@ export default {
)) ))
this.processing = true; this.processing = true;
this.submitted = false; this.submitted = false;
axios({ fetch(this.endpoint, { method: 'POST', body: formData })
url: this.endpoint, .then(response => response.json())
method: 'POST', .then((json) => {
data: formData, if ('validation' === json.status) {
}).then(response => { this.formErrors = json.errors
if ('validation' === response.data.status) { } else {
this.formErrors = response.data.errors; this.submitted = true;
} else { window.dataLayer = window.dataLayer || [];
this.submitted = true; dataLayer.push({
window.dataLayer = window.dataLayer || []; 'event': 'Preisberechnung'
dataLayer.push({ })
'event': 'Preisberechnung' }
}) })
} .finally(() => {
}).catch(error => { this.processing = false
}).finally(() => { })
this.processing = false;
});
} }
}, },
computed: { computed: {
nightsCount() { nightsCount() {
return this.selectedRange.length; return this.selectedRange.length;
}, },
forceInquiry() {
return 1 === this.selectedRange.length
},
rangeFormatted() { rangeFormatted() {
if (null === this.selectedFrom || null === this.selectedTo) { if (null === this.selectedFrom || null === this.selectedTo) {
return '-'; return '-';