Skip to content

Commit

Permalink
#328 - highlight in calendar
Browse files Browse the repository at this point in the history
  • Loading branch information
Baakoma committed Oct 25, 2024
1 parent ec6862b commit 3629017
Show file tree
Hide file tree
Showing 2 changed files with 21 additions and 3 deletions.
21 changes: 19 additions & 2 deletions resources/js/Pages/Calendar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import { router } from '@inertiajs/vue3'
import InertiaLink from '@/Shared/InertiaLink.vue'
import { useGlobalProps } from '@/Composables/useGlobalProps'
import AppLayout from '@/Shared/Layout/AppLayout.vue'
import { useStorage } from '@vueuse/core'
const props = defineProps({
users: Object,
Expand All @@ -22,6 +23,8 @@ const { auth } = useGlobalProps()
let activeElement = ref(undefined)
const hihighlighted = useStorage('calendar-hihighlight', [])
const currentDate = DateTime.now()
const selectedMonth = ref(DateTime.fromISO(props.selectedDate))
Expand Down Expand Up @@ -66,6 +69,16 @@ function linkParameters(user, day) {
function linkVacationRequest(user) {
return auth.value.user.id === user.id || auth.value.can.manageRequestsAsTechnicalApprover || auth.value.can.manageRequestsAsAdministrativeApprover
}
function toggleHighlight(id) {
if (hihighlighted.value.includes(id)) {
hihighlighted.value = hihighlighted.value.filter(item => item !== id)
return
}
hihighlighted.value.push(id)
}
</script>
<template>
Expand Down Expand Up @@ -168,10 +181,14 @@ function linkVacationRequest(user) {
<tr
v-for="user in users.data"
:key="user.id"
:class="[user.isActive ? '' : 'bg-gray-100']"
:class="[!user.isActive && 'bg-gray-100', user.isActive && hihighlighted.includes(user.id) && 'bg-green-600/5']"
>
<th class="p-2 border border-gray-300">
<th
:class="['p-2 border border-gray-300 text-left', hihighlighted.includes(user.id) && 'bg-green-600/5']"
@click="toggleHighlight(user.id)"
>
<UserProfileLink
class="inline-flex"
:user="user"
>
<div class="flex justify-start items-center">
Expand Down
3 changes: 2 additions & 1 deletion resources/js/Shared/UserProfileLink.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,9 @@ const { auth } = useGlobalProps()

<template>
<InertiaLink
v-if="auth.can.manageUsers"
v-if="!auth.can.manageUsers"
:href="`/users/${user.id}`"
@click.stop
>
<slot />
</InertiaLink>
Expand Down

0 comments on commit 3629017

Please sign in to comment.