Feature request: specialDates about vue-hotel-datepicker HOT 14 CLOSED

@amulchinock Yep you're right ;) Done that.

from vue-hotel-datepicker.

@Maxximus007 I'm not sure if I understood your suggestion regarding enableCheckin :/

About the tentativeDates, how exactly would date work? Just a different CSS class for those dates, but they would not be disabled?

from vue-hotel-datepicker.

@krystalcampioni you've finished the new version, great! Thanks for your effort!

After rethinking it can be solved without the enableCheckin. I'm using dateTime in the backend, for instance a booking 15-11-2017 14:00 until 18-11-2017 10:00 blocks 18-11-2017 as well.
For my situation I'll just modify the disabled dates -1 day to archieve the same.

For tentativeDays, indeed it can just be a different CSS class. Perhaps it can be usable by some as well for special festivity days, low priced days etc. So to make it more widely usable it could be called specialDays.

from vue-hotel-datepicker.

Cool. I think we can solve this by allowing the user to pass an array of specialDates and maybe a specialDatesClass so the user can also pass the name of the CSS class to be applied in the specialDates :)

from vue-hotel-datepicker.

@krystalcampioni @Maxximus007 I'm taking a look at this issue over this weekend. Just thought I'd let you both know that there's (hopefully) going to be some productive "noise" coming in from me the next day or so.

To tackle this issue - I am working to the following use cases / requirements: (feel free to add/correct if necessary)

• Global setting of a max-checkout time and a min-checkin time, to allow for cleaning .etc (i.e most hotels will have a check in time from 16:00, and a check out time no later than 10:00)
• Addition of "special dates" - to show booked out dates (or other special events). These should be styled by default with highlighting appropriate to the existing UI.
• "Special dates" should be an object containing a property of disabled: Boolean. This means that some special dates can still be booked out, whilst others can not.
• Each "Special day" should be nameable. To aid with the auto-generation of CSS classes and programmatic access .etc

Additional things, for a feature request - if wanted:

• The min-checkin time and max-checkout time could be overwritten on a day/week basis, using an array of objects with the dates / weeks (week numbers?) / months and times set.
• Developers using the datepicker should be able to specify a different colour to the default in "Special dates", using properties like {text-color: #ffffff, background: #000000; highlight: {text-color: #d3d3d3, background: red;}} -- feedback welcome on this!

Before I jump into this head first - I'd like a little feedback? :)

from vue-hotel-datepicker.

Quick update - haven't managed to get much done over the weekend. Will update over the coming days, as appropriate.

from vue-hotel-datepicker.

@amulchinock Great to see you jumping in. That would allow the datepicker to become even more versatile.
I do have one more request, perhaps you see some possibilities for it as well. Currently, if there is a minNights > 1, and there are 2 bookings that are not consecutive but have less than the minNights available, it is not bookable.

So if there is an availability of 3 nights, but required nights is 5, I'd like to auto-lower the required nights to 3 for that period- and make it possible to select an end date.

That would help to get a better fill rate.

from vue-hotel-datepicker.

@Maxximus007 That's an interesting use case.
Essentially - you want to auto-calculate if there is a gap between two bookings and scale the min-nights accordingly?

Might be worth adding that as a separate feature request. :)

from vue-hotel-datepicker.

@amulchinock great that you're working on this feature 💪
The plan seems good to me! I was just wondering, do we really need to include the disabled boolean in the special dates? Maybe we could check if the date should be disabled or not based on what we already have from the disabledDates prop. What do you think? 🤔

from vue-hotel-datepicker.

@krystalcampioni Yes, actually - that would be a better option. Much simpler than what I had in mind! 👍

from vue-hotel-datepicker.

@krystalcampioni - I've had a brainwave that may help me sorting this issue - but also create quite a useful way of sorting some of the date/time related issues to.

In my case, looking at this requirement - "Global setting of a max-checkout time and a min-checkin time, to allow for cleaning .etc (i.e most hotels will have a check in time from 16:00, and a check out time no later than 10:00)"

Javascript's date/time functionality is, to be brutal, terrible (when compared to other languages like PHP). Fortunately for us - moment.js offers a very powerful JS library to accommodate some of the 'roll your own solution' type issues that we frequently encounter with Javascript dates.

Would you be adverse to including it as a dependency in the project? It wouldn't break existing code, but would mean that existing code could be refactored to use it, where required.

Thoughts?

from vue-hotel-datepicker.

@amulchinock agreed, dealing with dates in JS can be a nigthmare! I would prefer if we did not include moment in the project, though. It's quite expensive in terms of performance and prone to bugs :/

Currently we do have fecha installed in the project to help dealing with dates. The reason why I chose it, is basically it's really performant and lightweigth.

I understand that it's a pretty limited lib though. Maybe we should instead replace it by date-fns?

from vue-hotel-datepicker.

After your discussion, is it possible to add a new special date class? I would like to highlight days that are booked and the issue I am seeing at the moment is at all dates before a selected range are given the same disabled css class. So there would have to be another class to distinguish between the two, or perhaps just prevent prior dates getting disabled...

from vue-hotel-datepicker.

Check if v4.0.0-beta.2 solves your problem now.

from vue-hotel-datepicker.