kamilniemczycki/toby
1
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Activity

#157 - more interactive calendar #162

Merged
kamilniemczycki merged 20 commits from #157-expansion-calendar into main 2022-06-08 11:02:38 +02:00
Conversation 10 Commits 20 Files Changed 6 +12 -42
3 changed files with 12 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 2be881381d - Show all commits

1
app/Domain/CalendarGenerator.php
View File

@@ -42,7 +42,6 @@ class CalendarGenerator
"isToday" => $day->isToday(), "isToday" => $day->isToday(),
"isWeekend" => $day->isWeekend(), "isWeekend" => $day->isWeekend(),
"isHoliday" => $holidays->contains($day), "isHoliday" => $holidays->contains($day),
"isFuture" => $day->isFuture(),
"vacations" => $vacationsForDay->pluck("user_id"), "vacations" => $vacationsForDay->pluck("user_id"),
"vacationTypes" => $vacationsForDay->pluck("vacationRequest.type", "user_id"), "vacationTypes" => $vacationsForDay->pluck("vacationRequest.type", "user_id"),
]; ];

51
resources/js/Pages/AnnualSummary.vue
View File

@@ -74,7 +74,7 @@
</Popper> </Popper>
<button <button
v-else-if="day.isWeekend" v-else-if="day.isWeekend"
class="py-1.5 w-full font-medium bg-white hover:bg-blumilk-25 border-b-4 border-transparent focus:outline-blumilk-500 hover:bg-transparent cursor-not-allowed" class="py-1.5 w-full font-medium bg-white hover:bg-blumilk-25 border-b-4 border-transparent focus:outline-blumilk-500 hover:bg-transparent"
> >
<time <time
:datetime="day.date.toISODate()" :datetime="day.date.toISODate()"
@@ -83,34 +83,19 @@
{{ day.date.day }} {{ day.date.day }}
</time> </time>
</button> </button>
<template <InertiaLink
v-else v-else
href="/vacation/requests/create"
:data="{ 'from_date': day.date.toISODate() }"
class="py-1.5 w-full font-medium bg-white hover:bg-blumilk-25 border-b-4 border-transparent focus:outline-blumilk-500"
> >
<InertiaLink <time
v-if="day.isFuture" :datetime="day.date.toISODate()"
href="/vacation/requests/create" :class="[ day.isToday && 'bg-blumilk-500 font-semibold text-white rounded-full', 'mx-auto flex h-7 w-7 p-4 items-center justify-center']"
:data="{ 'from_date': day.date.toISODate() }"
class="py-1.5 w-full font-medium bg-white hover:bg-blumilk-25 border-b-4 border-transparent focus:outline-blumilk-500"
> >
<time {{ day.date.day }}
:datetime="day.date.toISODate()" </time>
:class="[ day.isToday && 'bg-blumilk-500 font-semibold text-white rounded-full', 'mx-auto flex h-7 w-7 p-4 items-center justify-center']" </InertiaLink>
>
{{ day.date.day }}
</time>
</InertiaLink>
<button
v-else
class="py-1.5 w-full font-medium bg-white hover:bg-blumilk-25 border-b-4 border-transparent focus:outline-blumilk-500 hover:bg-transparent cursor-not-allowed"
>
<time
:datetime="day.date.toISODate()"
class="mx-auto flex h-7 w-7 p-4 items-center justify-center"
>
{{ day.date.day }}
</time>
</button>
</template>
</template> </template>
<div <div
v-else v-else
@@ -170,7 +155,6 @@ for (let i = 1; i < 13; i++) {
isVacation: isCurrentMonth && isVacation(day), isVacation: isCurrentMonth && isVacation(day),
isPendingVacation: isCurrentMonth && isPendingVacation(day), isPendingVacation: isCurrentMonth && isPendingVacation(day),
isHoliday: isHoliday(day), isHoliday: isHoliday(day),
isFuture: isFuture(day),
}) })
} }
@@ -193,10 +177,6 @@ function isToday(date) {
return DateTime.now().hasSame(date, 'year') && DateTime.now().hasSame(date, 'day') return DateTime.now().hasSame(date, 'year') && DateTime.now().hasSame(date, 'day')
} }
function isFuture(date) {
return date.toISODate().toString() >= DateTime.now().toISODate().toString()
}
function isInCurrentMonth(date, currentMonth) { function isInCurrentMonth(date, currentMonth) {
return currentMonth.hasSame(date, 'month') return currentMonth.hasSame(date, 'month')
} }
@@ -215,12 +195,3 @@ function getVacationInfo(day) {
return day.isVacation ? props.vacations[day.date.toISODate()] : props.pendingVacations[day.date.toISODate()] return day.isVacation ? props.vacations[day.date.toISODate()] : props.pendingVacations[day.date.toISODate()]
} }
</script> </script>
<style lang="css">
.cursor-default {
cursor: auto;
}
.cursor-not-allowed {
cursor: not-allowed;
}
</style>

2
resources/js/Pages/Calendar.vue
View File

@@ -111,7 +111,7 @@
<VacationTypeCalendarIcon :type="day.vacationTypes[user.id]" /> <VacationTypeCalendarIcon :type="day.vacationTypes[user.id]" />
</div> </div>
<template <template
v-else-if="isActiveDay(user.id + '+' + day.date) && !day.isWeekend && !day.isHoliday && day.isFuture && (auth.user.id === user.id || can.createOnBehalfOfEmployee)" v-else-if="isActiveDay(user.id + '+' + day.date) && !day.isWeekend && !day.isHoliday && (auth.user.id === user.id || can.createOnBehalfOfEmployee)"
> >
<InertiaLink <InertiaLink
href="/vacation/requests/create" href="/vacation/requests/create"