refactoring #VC

resources/js/Shared/Widgets/VacationCalendar.vue

@@ -159,7 +159,7 @@ const calendar = {
   currents: reactive({
     year: selectedYear,
     month: selectedYear === currentDate.year ? currentDate.month : 1,
-    week: selectedYear === currentDate.year ? currentDate.weekNumber : 1,
+    weekPosition: 0,
   }),
   toPreviousActive: computed(() => calendar.currents.month !== 1),
 }
@@ -176,51 +176,58 @@ const calendarState = reactive({
   isNext: computed(() => calendar.currents.month !== 12),
 })
 
+const customCalendar = {
+  generateCalendar() {
+    console.log('Loaded!', DateTime.now())
+    const currentDate = DateTime.fromObject({
+      year: calendar.currents.year,
+      month: calendar.currents.month,
+    })
+    const start = currentDate.startOf('month').startOf('week')
+    const end = currentDate.endOf('month').endOf('week')
+
+    days.value = this.generateCalendarData(start, end)
+  },
+  generateCalendarData(start, end) {
+    if (calendarState.viewMode.isWeek)
+      return this.generateWeekData(start)
+    else if (calendarState.viewMode.isMonth)
+      return this.generateMonthData(start, end)
+    return []
+  },
+  generateWeekData(start) {
+    let days = []
+    const startWeek = start.plus({ week: calendar.currents.weekPosition })
+    const endWeek = startWeek.endOf('week')
+    for (let day = startWeek; day < endWeek; day = day.plus({ day: 1 })) {
+      days.push(this.prepareDay(day))
+    }
+
+    return days
+  },
+  generateMonthData(start, end) {
+    let days = []
+    for (let day = start; day < end; day = day.plus({ day: 1 })) {
+      days.push(this.prepareDay(day))
+    }
+
+    return days
+  },
+  prepareDay(day) {
+    return {
+      date: day.toISODate(),
+      dayNumber: day.day,
+      isCurrentMonth: isInCurrentMonth(day),
+      isToday: isToday(day),
+    }
+  },
+}
+
 watch([calendar.viewMode, calendar.currents], () => {
-  loadCalendar()
+  customCalendar.generateCalendar()
 })
 
-loadCalendar()
-
-function loadCalendar() {
-  console.log('Loaded')
-  let focusDate = DateTime.fromObject({
-    year: calendar.currents.year,
-    month: calendar.currents.month,
-  })
-  let start, end
-
-  if (calendar.viewMode.value === 'week') {
-    if (currentDate.year === selectedYear)
-      focusDate = DateTime.fromObject({ weekNumber: calendar.currents.week })
-    else
-      focusDate = focusDate.plus({ week: calendar.currents.week - 1 })
-    start = focusDate.startOf('week')
-    end = focusDate.endOf('week')
-  } else if (calendar.viewMode.value === 'month') {
-    focusDate = focusDate.startOf('month')
-    start = focusDate.startOf('week')
-    end = focusDate.endOf('month').endOf('week')
-  }
-
-  generateCalendarData(start, end, focusDate)
-}
-
-function generateCalendarData(startDate, endDate, focusDate) {
-  const tmpDays = []
-  for (let day = startDate; day < endDate; day = day.plus({ day: 1 })) {
-    const isCurrentMonth = isInCurrentMonth(day, focusDate)
-    const okIsToday = isToday(day)
-
-    tmpDays.push({
-      date: day.toISODate(),
-      isCurrentMonth,
-      isToday: okIsToday,
-    })
-  }
-
-  days.value = tmpDays
-}
+customCalendar.generateCalendar()
 
 function toLast() {
   if (calendar.viewMode.value === 'week')
@@ -239,11 +246,13 @@ function toNext() {
 function resetCalendar() {
   calendar.currents.year = selectedYear
   calendar.currents.month = selectedYear === currentDate.year ? currentDate.month : 1
-  calendar.currents.week = selectedYear === currentDate.year ? currentDate.weekNumber : 1
+  // calendar.currents.week = selectedYear === currentDate.year ? currentDate.weekNumber : 1
+  calendar.currents.weekPosition = 1
 }
 
 function addWeeks(howMany = 1) {
-  calendar.currents.week += howMany
+  // calendar.currents.week += howMany
+  calendar.currents.weekPosition += howMany
 }
 
 function addMonths(howMany = 1) {
@@ -255,8 +264,8 @@ function updateViewMode(type) {
   calendar.viewMode.value = type
 }
 
-function isInCurrentMonth(date, currentMonth) {
-  return currentMonth.hasSame(date, 'month')
+function isInCurrentMonth(date) {
+  return calendar.currents.month === date.month
 }
 
 function isToday(date) {