wip #VC

resources/js/Shared/Widgets/VacationCalendar.vue

@@ -68,7 +68,7 @@
           <MenuItems class="absolute right-0 mt-3 w-36 origin-top-right overflow-hidden rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
             <div class="py-1">
               <MenuItem
-                v-for="option in viewModeOptions"
+                v-for="option in viewModes.all"
                 :key="option.key"
                 v-slot="{ active }"
               >
@@ -143,6 +143,7 @@ import { ref, watch, computed, reactive } from 'vue'
 import { DateTime } from 'luxon'
 import useCurrentYearPeriodInfo from '@/Composables/yearPeriodInfo'
 import { useMonthInfo } from '@/Composables/monthInfo'
+import viewModes from '@/Shared/Widgets/VacationCalendar/ViewModeOptions'
 
 let days = ref([])
 const months = useMonthInfo().getMonths()
@@ -153,15 +154,6 @@ function getCurrentDate() {
 const selectedYear = useCurrentYearPeriodInfo().year.value
 const currentDate = getCurrentDate()
 
-function isViewModeKey(key) {
-  return this.key === key.value
-}
-
-const viewModeOptions = [
-  { key: 'week', name: 'Widok tygodnia', shortcut: 'Tydzień', is: isViewModeKey },
-  { key: 'month', name: 'Widok miesiąca', shortcut: 'Miesiąc', is: isViewModeKey },
-]
-
 const calendar = {
   viewMode: ref('week'),
   currents: reactive({
@@ -176,7 +168,7 @@ const calendarState = reactive({
   viewMode: {
     isWeek: computed(() => calendar.viewMode.value === 'week'),
     isMonth: computed(() => calendar.viewMode.value === 'month'),
-    details: computed(() => viewModeOptions.find((obj) => obj.key === calendar.viewMode.value)),
+    details: computed(() => viewModes.find(calendar.viewMode.value)),
   },
   monthName: computed(() => months[calendar.currents.month - 1]?.name),
   isActualYear: computed(() => calendar.currents.year !== selectedYear),
@@ -191,6 +183,7 @@ watch([calendar.viewMode, calendar.currents], () => {
 loadCalendar()
 
 function loadCalendar() {
+  console.log('Loaded')
   let focusDate = DateTime.fromObject({
     year: calendar.currents.year,
     month: calendar.currents.month,
@@ -201,7 +194,7 @@ function loadCalendar() {
     if (currentDate.year === selectedYear)
       focusDate = DateTime.fromObject({ weekNumber: calendar.currents.week })
     else
-      focusDate = focusDate.plus({ week: calendar.currents.week - 1 } )
+      focusDate = focusDate.plus({ week: calendar.currents.week - 1 })
     start = focusDate.startOf('week')
     end = focusDate.endOf('week')
   } else if (calendar.viewMode.value === 'month') {

resources/js/Shared/Widgets/VacationCalendar/ViewModeOptions.js

@@ -0,0 +1,13 @@
+function isViewModeKey(key) {
+  return this.key === key.value
+}
+
+const modes = [
+  { key: 'week', name: 'Widok tygodnia', shortcut: 'Tydzień', is: isViewModeKey },
+  { key: 'month', name: 'Widok miesiąca', shortcut: 'Miesiąc', is: isViewModeKey },
+]
+
+export default {
+  all: modes,
+  find: whereMode => modes.find(mode => mode.key === whereMode),
+}