ZestfulNation / vue-hotel-datepicker

A VueJS v2 responsive date range picker. Displays the number of nights selected and allow several useful options like custom check-in/check-out rules, localization support and more.
https://zestfulnation.github.io/vue-hotel-datepicker/
MIT License
840 stars 220 forks source link

Issue when closing calendar on mobile (v3.0.10) #321

Closed ShapesGraphicStudio closed 4 months ago

ShapesGraphicStudio commented 1 year ago

Hello,

I'm still on 3.0.10 version here.

Using Desktop, it's OK, when I select arrival date, and close the calendar to reopen it nothing changes.

But using mobile, when I close calendar, the dates somehow resets and I can select dates that I should not be able to select.

To illustrate this:

First calendar opening is OK

Capture d’écran 2023-03-16 à 12 36 42

If I select March 26th I can't select departure as 26th can't be an arrival day (by the way, half days do not have specific css class to show if it's just an arrival open date or departure open date).

Capture d’écran 2023-03-16 à 12 37 14

If I close the calendar to reopen it arrival date is still selected but all other dates reappear which allows the user tu select March 28th for departure which leads to double / overlapping bookings.

Capture d’écran 2023-03-16 à 12 37 54 Capture d’écran 2023-03-16 à 12 45 02

This is only happening on mobile layout. Any idea on how to solve this? Is an event triggered on close only on mobile?

matiasperrone commented 4 months ago

Sorry again @ShapesGraphicStudio...

I have not idea without checking that out myself. I am not going to fix any of the old versions anyway, you're welcome to provide a PR, I will merge ASAP. I'll provide new patches for the last v4 version and if I have the time I will work in the Vue 3 version. Anyway, you can contact me here: