search

nathanreyes / v-calendar

An elegant calendar and datepicker plugin for Vue.
https://vcalendar.io
MIT License
4.4k stars 861 forks source link

Is there an equivalent of datepicker 'is-double-paned' functionality in V3? #1291

Open sakihl opened 1 year ago

sakihl commented 1 year ago

I am supporting an old system that uses v-calendar ^0.9.7 (yes I know it's old). I am trying to upgrade it to Vue 3 and v-calendar ^3.0.0. It has a datepicker with the old is-double-paned property, which I am trying to reproduce. I have tried :columns="2" but the behaviour is not the same. With is-double-paned the two panes are navigable separately so you can navigate them to months far apart and select a long date range. image With :columns="2" the two panes navigate together so when you change the second one the first one moves with it. image Is there a way to recreate the is-doubled-paned functionality in V3?

sakihl commented 1 year ago

I have managed to simulate most of what I need by having two separate (non-range) datepickers and using attributes to highlight the range image image

but I have not found a way to get both popovers to show together, so I still have a use case for a double paned range picker where the panes can be navigated separately.

astraldev commented 1 year ago

Any update about this yet?

sakihl commented 1 year ago

I never heard anything so have stayed with my workaround using two separate datepickers. It was quite fiddly to get it to behave intuitively. For example, when the user selects the start date I change the end date popover to highlight that date as a starting point for navigating to an end date, and set the minimum so that they can't select an end date earlier than the start date.

I still haven't found a way to get both popovers to show together.

astraldev commented 1 year ago

@nathanreyes please consider this issue

astraldev commented 1 year ago

@sakihl If you really still need the is-double-paned functionality and you are fine with v0.9.7, I have made a port that is compatible with vue 3 v-calendar fork

sakihl commented 1 year ago

@astraldev Thank you very much. I am getting my application ready to go live so will stick with my workaround for the time being and see how the users get on with it. If I need to revert to 0.9.7 your fork will be very useful. Thanks.