nathanreyes / v-calendar

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

Navigation bug: skipping a week when trying to switch to the previous week. #1406

Open Pavel2906 opened 11 months ago

Pavel2906 commented 11 months ago

Description I use the calendar in the "weekly" view and "first-day-of-week"=2, when I try to switch to the previous week - the transition is carried out immediately two weeks ago.

Example The number of the current week is 45, and as soon as I click on the navigation arrow (go back) I will switch to week 43 (expected result -> week 44). I tried to change the calendar configuration, but I didn't get the expected result. How can I solve this problem?

Initial state image

State after clicking on the navigation arrow (go back) image (1)

My config: <VCalendar ref="calendar" locale="en" view="weekly" transparent borderless title-position="left" :first-day-of-week="2" expanded show-weeknumbers /> It may be useful, if you set "first-day-of-week"=1, the navigation will work correctly.

donkeeman commented 10 months ago

I have similar issue. In my case, if this week is the last week of this month and the first week of next month (like above pictures), prev button works fine, but when I click next button same week shows twice.

const date = ref(new Date('2023-11-28'))
const calendarRef = ref(null)

<Calendar
  view="weekly"
  :first-day-of-week="7" // other numbers work fine
  ref="calendarRef"
  v-model="date"
  mode="date"
  expanded
/>

At first, calendarRef.value.pages[0].id is "2023-11-w5", and after clicking next button,calendarRef.value.pages[0].id is "2023-12-w1", but calendarRef.value.pages[0].viewDays is same as before, so the week shows twice. So I think the combination of specific week(the last week of current month and also the first week of next month) (or specific day) and specific first-of-day-week might cause navigation issues.