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

#22 - wip

Browse Source
This commit is contained in:
Adrian Hopek 2022-02-04 08:43:12 +01:00
parent 47288917a2
commit 79d86b2491
9 changed files with 918 additions and 958 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/Infrastructure/Http/Controllers/HolidayController.php
View File

@ -64,19 +64,4 @@ class HolidayController extends Controller
->route("holidays.index") ->route("holidays.index")
->with("success", __("Holiday has been deleted")); ->with("success", __("Holiday has been deleted"));
} }
public function showCalendar(): Response
{
$users = User::query()
->withTrashed()
->orderBy("last_name")
->orderBy("first_name")
->paginate()
->withQueryString();
return inertia("Holidays/Calendar", [
"users" => UserResource::collection($users),
]);
}
} }

24
app/Infrastructure/Http/Controllers/VacationCalendarController.php Normal file
View File

@ -0,0 +1,24 @@
<?php
declare(strict_types=1);
namespace Toby\Infrastructure\Http\Controllers;
use Inertia\Response;
use Toby\Eloquent\Models\User;
use Toby\Infrastructure\Http\Resources\UserResource;
class VacationCalendarController extends Controller
{
public function index(): Response
{
$users = User::query()
->orderBy("last_name")
->orderBy("first_name")
->paginate();
return inertia("Calendar", [
"users" => UserResource::collection($users),
]);
}
}

8
app/Infrastructure/Http/Controllers/VacationRequestController.php
View File

@ -20,15 +20,19 @@ class VacationRequestController extends Controller
{ {
public function index(Request $request): Response public function index(Request $request): Response
{ {
$status = $request->get("status", "all");
$vacationRequests = $request->user() $vacationRequests = $request->user()
->vacationRequests() ->vacationRequests()
->latest() ->latest()
->states(VacationRequestState::filterByStatus($request->query("status", "all"))) ->states(VacationRequestState::filterByStatus($status))
->paginate(); ->paginate();
return inertia("VacationRequest/Index", [ return inertia("VacationRequest/Index", [
"requests" => VacationRequestResource::collection($vacationRequests), "requests" => VacationRequestResource::collection($vacationRequests),
"filters" => $request->only("status"), "filters" => [
"status" => $status,
],
]); ]);
} }

130
resources/js/Pages/Calendar.vue Normal file
View File

@ -0,0 +1,130 @@
<template>
<InertiaHead title="Kalendarz urlopów" />
<div class="bg-white sm:rounded-lg shadow-md">
<div class="p-4 sm:px-6">
<h2 class="text-lg leading-6 font-medium text-gray-900">
Kalendarz urlopów
</h2>
</div>
<div class="overflow-x-auto">
<table class="w-full text-center border border-gray-300">
<thead>
<tr>
<th class="w-64 py-2 border border-gray-300">
<Menu
as="div"
class="relative inline-block text-left"
>
<div>
<MenuButton
class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blumilk-500"
>
Styczeń
<ChevronDownIcon
class="-mr-1 ml-2 h-5 w-5"
aria-hidden="true"
/>
</MenuButton>
</div>
<transition
enter-active-class="transition ease-out duration-100"
enter-from-class="transform opacity-0 scale-95"
enter-to-class="transform opacity-100 scale-100"
leave-active-class="transition ease-in duration-75"
leave-from-class="transform opacity-100 scale-100"
leave-to-class="transform opacity-0 scale-95"
>
<MenuItems
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"
>
<div class="py-1">
<MenuItem>
<a
href="#"
class="text-gray-900 block px-4 py-2 text-sm"
>Styczeń</a>
</MenuItem>
<MenuItem>
<a
href="#"
class="text-gray-900 block px-4 py-2 text-sm"
>Luty</a>
</MenuItem>
<MenuItem>
<a
href="#"
class="text-gray-900 block px-4 py-2 text-sm"
>Marzec</a>
</MenuItem>
</div>
</MenuItems>
</transition>
</Menu>
</th>
<th
v-for="i in 31"
:key="i"
class="border border-gray-300 font-semibold text-gray-900 py-4 px-2 bg-gray-50"
>
{{ i }}
<p class="text-gray-800 font-normal mt-1">
Pt
</p>
</th>
</tr>
</thead>
<tbody>
<tr
v-for="user in users.data"
:key="user.id"
>
<th class="border border-gray-300 py-2 px-4">
<div class="flex justify-start items-center">
<span class="inline-flex items-center justify-center h-10 w-10 rounded-full">
<img
class="h-10 w-10 rounded-full"
:src="user.avatar"
alt=""
>
</span>
<div class="ml-3">
<div class="text-sm font-medium text-gray-900">
{{ user.name }}
</div>
</div>
</div>
</th>
<td
v-for="i in 31"
:key="i"
class="border border-gray-300 bg-blumilk-25"
/>
</tr>
</tbody>
</table>
</div>
</div>
</template>
<script>
import {Menu, MenuButton, MenuItem, MenuItems} from '@headlessui/vue'
import {ChevronDownIcon} from '@heroicons/vue/solid'
export default {
name: 'VacationCalendar',
components: {
Menu,
MenuButton,
MenuItem,
MenuItems,
ChevronDownIcon,
},
props: {
users: {
type: Object,
default: () => null,
},
},
}
</script>

115
resources/js/Pages/Dashboard.vue
View File

@ -252,18 +252,19 @@ import {
ClockIcon, ClockIcon,
ReceiptRefundIcon, ReceiptRefundIcon,
UsersIcon, UsersIcon,
} from '@heroicons/vue/outline'; } from '@heroicons/vue/outline'
import {computed} from 'vue'; import {computed} from 'vue'
import {usePage} from '@inertiajs/inertia-vue3'; import {usePage} from '@inertiajs/inertia-vue3'
export default { export default {
name: 'Dashboard', name: 'Dashboard',
setup() { setup() {
const user = computed(() => usePage().props.value.auth.user); const user = computed(() => usePage().props.value.auth.user)
const stats = [ const stats = [
{label: 'Vacation days left', value: 12}, {label: 'Vacation days left', value: 12},
{label: 'Sick days left', value: 4}, {label: 'Sick days left', value: 4},
{label: 'Personal days left', value: 2}, {label: 'Personal days left', value: 2},
]; ]
const actions = [ const actions = [
{ {
icon: ClockIcon, icon: ClockIcon,
@ -307,7 +308,7 @@ export default {
iconForeground: 'text-indigo-700', iconForeground: 'text-indigo-700',
iconBackground: 'bg-indigo-50', iconBackground: 'bg-indigo-50',
}, },
]; ]
const recentHires = [ const recentHires = [
{ {
name: 'Leonard Krasner', name: 'Leonard Krasner',
@ -337,7 +338,7 @@ export default {
'https://images.unsplash.com/photo-1500917293891-ef795e70e1f6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80', 'https://images.unsplash.com/photo-1500917293891-ef795e70e1f6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80',
href: '#', href: '#',
}, },
]; ]
const announcements = [ const announcements = [
{ {
id: 1, id: 1,
@ -360,108 +361,14 @@ export default {
preview: preview:
'Tenetur libero voluptatem rerum occaecati qui est molestiae exercitationem. Voluptate quisquam iure assumenda consequatur ex et recusandae. Alias consectetur voluptatibus. Accusamus a ab dicta et. Consequatur quis dignissimos voluptatem nisi.', 'Tenetur libero voluptatem rerum occaecati qui est molestiae exercitationem. Voluptate quisquam iure assumenda consequatur ex et recusandae. Alias consectetur voluptatibus. Accusamus a ab dicta et. Consequatur quis dignissimos voluptatem nisi.',
}, },
]; ]
return { return {
user, user,
stats, stats,
actions, actions,
recentHires, recentHires,
announcements, announcements,
}; }
}, },
}; }
</script> </script>
<!--<script>-->
<!--import { ref } from 'vue';-->
<!--import {-->
<!-- Dialog,-->
<!-- DialogOverlay,-->
<!-- Menu,-->
<!-- MenuButton,-->
<!-- MenuItem,-->
<!-- MenuItems,-->
<!-- TransitionChild,-->
<!-- TransitionRoot,-->
<!--} from '@headlessui/vue';-->
<!--import {-->
<!-- BellIcon,-->
<!-- ClockIcon,-->
<!-- CogIcon,-->
<!-- CreditCardIcon,-->
<!-- DocumentReportIcon,-->
<!-- HomeIcon,-->
<!-- MenuAlt1Icon,-->
<!-- QuestionMarkCircleIcon,-->
<!-- ScaleIcon,-->
<!-- ShieldCheckIcon,-->
<!-- UserGroupIcon,-->
<!-- XIcon,-->
<!--} from '@heroicons/vue/outline';-->
<!--import {-->
<!-- CalendarIcon,-->
<!-- CashIcon,-->
<!-- CheckCircleIcon,-->
<!-- ChevronDownIcon,-->
<!-- ChevronRightIcon,-->
<!-- OfficeBuildingIcon,-->
<!-- SearchIcon, SunIcon,-->
<!--} from '@heroicons/vue/solid';-->
<!--const cards = [-->
<!-- { name: 'Account balance', href: '#', icon: ScaleIcon, amount: '$30,659.45' },-->
<!--];-->
<!--const transactions = [-->
<!-- {-->
<!-- id: 1,-->
<!-- name: 'Payment to Molly Sanders',-->
<!-- href: '#',-->
<!-- amount: '$20,000',-->
<!-- currency: 'USD',-->
<!-- status: 'success',-->
<!-- date: 'July 11, 2020',-->
<!-- datetime: '2020-07-11',-->
<!-- },-->
<!--];-->
<!--const statusStyles = {-->
<!-- success: 'bg-green-100 text-green-800',-->
<!-- processing: 'bg-yellow-100 text-yellow-800',-->
<!-- failed: 'bg-gray-100 text-gray-800',-->
<!--};-->
<!--export default {-->
<!-- components: {-->
<!-- Dialog,-->
<!-- DialogOverlay,-->
<!-- Menu,-->
<!-- MenuButton,-->
<!-- MenuItem,-->
<!-- MenuItems,-->
<!-- TransitionChild,-->
<!-- TransitionRoot,-->
<!-- BellIcon,-->
<!-- CashIcon,-->
<!-- CheckCircleIcon,-->
<!-- ChevronDownIcon,-->
<!-- ChevronRightIcon,-->
<!-- MenuAlt1Icon,-->
<!-- OfficeBuildingIcon,-->
<!-- SearchIcon,-->
<!-- XIcon,-->
<!-- HomeIcon,-->
<!-- UserGroupIcon,-->
<!-- SunIcon,-->
<!-- CalendarIcon,-->
<!-- },-->
<!-- setup() {-->
<!-- const sidebarOpen = ref(false);-->
<!-- return {-->
<!-- cards,-->
<!-- transactions,-->
<!-- statusStyles,-->
<!-- sidebarOpen,-->
<!-- };-->
<!-- },-->
<!--};-->
<!--</script>-->

97
resources/js/Pages/Holidays/Calendar.vue
View File

@ -1,97 +0,0 @@
<template>
<InertiaHead title="Kalendarz" />
<div class="bg-white sm:rounded-lg shadow-md">
<div class="p-4 sm:px-6">
<h2 class="text-lg leading-6 font-medium text-gray-900">
Kalendarz
</h2>
</div>
<div class="grid grid-cols-38 justify-items-center divide-x divide-gray-300">
<div class="w-full text-center col-span-7">
<Menu as="div" class="relative inline-block text-left">
<div>
<MenuButton class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blumilk-500">
Styczeń
<ChevronDownIcon class="-mr-1 ml-2 h-5 w-5" aria-hidden="true" />
</MenuButton>
</div>
<transition enter-active-class="transition ease-out duration-100" enter-from-class="transform opacity-0 scale-95" enter-to-class="transform opacity-100 scale-100" leave-active-class="transition ease-in duration-75" leave-from-class="transform opacity-100 scale-100" leave-to-class="transform opacity-0 scale-95">
<MenuItems class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
<div class="py-1">
<MenuItem>
<a href="#" class="text-gray-900 block px-4 py-2 text-sm">Styczeń</a>
</MenuItem>
<MenuItem>
<a href="#" class="text-gray-900 block px-4 py-2 text-sm">Luty</a>
</MenuItem>
<MenuItem>
<a href="#" class="text-gray-900 block px-4 py-2 text-sm">Marzec</a>
</MenuItem>
</div>
</MenuItems>
</transition>
</Menu>
</div>
<div class="w-full text-center font-semibold text-gray-900 py-4 bg-gray-50" v-for="n in 31">{{ n }}
<p class="text-gray-800 font-normal mt-1">Pt</p>
</div>
</div>
<div class="grid grid-cols-38 justify-items-start divide-x divide-gray-300 border-t border-gray-300" v-for="user in users.data"
:key="user.id">
<div class="col-span-7 px-4 py-2 whitespace-nowrap">
<div class="flex justify-start items-center">
<span
class="inline-flex items-center justify-center h-10 w-10 rounded-full"
>
<img
class="h-10 w-10 rounded-full"
:src="user.avatar"
alt=""
>
</span>
<div class="ml-3">
<div class="text-sm font-medium break-all text-gray-900">
{{ user.name }}
</div>
</div>
</div>
</div>
<div class="w-full bg-blumilk-25 divide-x divide-gray-300 flex justify-center" v-for="n in 31">
<!-- <div class="bg-blumilk-500 items-center w-96 m-1 rounded-lg"></div>-->
</div>
</div>
</div>
</template>
<script>
import FlatPickr from 'vue-flatpickr-component';
import {Listbox, ListboxButton, ListboxLabel, ListboxOption, ListboxOptions} from '@headlessui/vue';
import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
import {CheckIcon, SelectorIcon} from '@heroicons/vue/solid';
import { ChevronDownIcon } from '@heroicons/vue/solid'
export default {
components: {
FlatPickr,
Listbox,
ListboxButton,
ListboxLabel,
ListboxOption,
ListboxOptions,
Menu,
MenuButton,
MenuItem,
MenuItems,
CheckIcon,
SelectorIcon,
ChevronDownIcon,
},
props: {
users: {
type: Object,
default: () => null,
},
},
};
</script>

104
resources/js/Shared/MainMenu.vue
View File

@ -66,7 +66,7 @@
aria-label="Sidebar" aria-label="Sidebar"
> >
<div class="px-2 space-y-1"> <div class="px-2 space-y-1">
<a <InertiaLink
v-for="item in navigation" v-for="item in navigation"
:key="item.name" :key="item.name"
:href="item.href" :href="item.href"
@ -79,11 +79,11 @@
aria-hidden="true" aria-hidden="true"
/> />
{{ item.name }} {{ item.name }}
</a> </InertiaLink>
</div> </div>
<div class="mt-6 pt-6"> <div class="mt-6 pt-6">
<div class="px-2 space-y-1"> <div class="px-2 space-y-1">
<a <InertiaLink
v-for="item in secondaryNavigation" v-for="item in secondaryNavigation"
:key="item.name" :key="item.name"
:href="item.href" :href="item.href"
@ -95,7 +95,7 @@
aria-hidden="true" aria-hidden="true"
/> />
{{ item.name }} {{ item.name }}
</a> </InertiaLink>
</div> </div>
</div> </div>
</nav> </nav>
@ -104,9 +104,7 @@
<div <div
class="flex-shrink-0 w-14" class="flex-shrink-0 w-14"
aria-hidden="true" aria-hidden="true"
> />
<!-- Dummy element to force sidebar to shrink to fit close icon -->
</div>
</Dialog> </Dialog>
</TransitionRoot> </TransitionRoot>
@ -128,7 +126,7 @@
aria-label="Sidebar" aria-label="Sidebar"
> >
<div class="px-2 space-y-1"> <div class="px-2 space-y-1">
<a <InertiaLink
v-for="item in navigation" v-for="item in navigation"
:key="item.name" :key="item.name"
:href="item.href" :href="item.href"
@ -141,11 +139,11 @@
aria-hidden="true" aria-hidden="true"
/> />
{{ item.name }} {{ item.name }}
</a> </InertiaLink>
</div> </div>
<div class="mt-6 pt-6"> <div class="mt-6 pt-6">
<div class="px-2 space-y-1"> <div class="px-2 space-y-1">
<a <InertiaLink
v-for="item in secondaryNavigation" v-for="item in secondaryNavigation"
:key="item.name" :key="item.name"
:href="item.href" :href="item.href"
@ -157,7 +155,7 @@
aria-hidden="true" aria-hidden="true"
/> />
{{ item.name }} {{ item.name }}
</a> </InertiaLink>
</div> </div>
</div> </div>
</nav> </nav>
@ -177,19 +175,26 @@
aria-hidden="true" aria-hidden="true"
/> />
</button> </button>
<div class="flex-1 px-4 flex justify-between sm:px-6 lg:max-w-7xl lg:mx-auto lg:px-8"> <div class="flex-1 px-4 flex justify-between sm:px-6 lg:px-8">
<div class="flex items-center"> <div class="flex items-center">
<div> <div>
<Menu <Menu
as="div" as="div"
class="relative inline-block text-left" class="relative inline-block text-left"
> >
<div class="flex justify-center items-center">
<div class="mr-4">
Wybrany rok:
</div>
<div> <div>
<MenuButton class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"> <MenuButton
class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"
>
{{ years.current }} {{ years.current }}
<ChevronDownIcon class="-mr-1 ml-2 h-5 w-5" /> <ChevronDownIcon class="-mr-1 ml-2 h-5 w-5" />
</MenuButton> </MenuButton>
</div> </div>
</div>
<transition <transition
enter-active-class="transition ease-out duration-100" enter-active-class="transition ease-out duration-100"
@ -199,7 +204,9 @@
leave-from-class="transform opacity-100 scale-100" leave-from-class="transform opacity-100 scale-100"
leave-to-class="transform opacity-0 scale-95" leave-to-class="transform opacity-0 scale-95"
> >
<MenuItems class="origin-top-right absolute right-0 mt-2 w-32 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"> <MenuItems
class="origin-top-right absolute right-0 mt-2 w-32 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"
>
<div class="py-1"> <div class="py-1">
<MenuItem <MenuItem
v-for="(item, index) in years.navigation" v-for="(item, index) in years.navigation"
@ -227,30 +234,23 @@
</div> </div>
</div> </div>
<div class="ml-4 flex items-center md:ml-6"> <div class="ml-4 flex items-center md:ml-6">
<button
type="button"
class="bg-white p-1 rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"
>
<span class="sr-only">View notifications</span>
<BellIcon
class="h-6 w-6"
aria-hidden="true"
/>
</button>
<!-- Profile dropdown --> <!-- Profile dropdown -->
<Menu <Menu
as="div" as="div"
class="ml-3 relative" class="ml-3 relative"
> >
<div> <div>
<MenuButton class="max-w-xs bg-white rounded-full flex items-center text-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500 lg:p-2 lg:rounded-md lg:hover:bg-gray-50"> <MenuButton
class="max-w-xs bg-white rounded-full flex items-center text-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500 lg:p-2 lg:rounded-md lg:hover:bg-gray-50"
>
<img <img
class="h-8 w-8 rounded-full" class="h-8 w-8 rounded-full"
:src="user.avatar" :src="user.avatar"
alt="Avatar" alt="Avatar"
> >
<span class="hidden ml-3 text-gray-700 text-sm font-medium lg:block"><span class="sr-only">Open user menu for </span>{{ user.name }}</span> <span class="hidden ml-3 text-gray-700 text-sm font-medium lg:block"><span class="sr-only">Open user menu for </span>{{
user.name
}}</span>
<ChevronDownIcon <ChevronDownIcon
class="hidden flex-shrink-0 ml-1 h-5 w-5 text-gray-400 lg:block" class="hidden flex-shrink-0 ml-1 h-5 w-5 text-gray-400 lg:block"
aria-hidden="true" aria-hidden="true"
@ -265,7 +265,9 @@
leave-from-class="transform opacity-100 scale-100" leave-from-class="transform opacity-100 scale-100"
leave-to-class="transform opacity-0 scale-95" leave-to-class="transform opacity-0 scale-95"
> >
<MenuItems class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"> <MenuItems
class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"
>
<MenuItem <MenuItem
v-for="item in userNavigation" v-for="item in userNavigation"
:key="item.name" :key="item.name"
@ -290,7 +292,7 @@
</template> </template>
<script> <script>
import { ref } from 'vue'; import {ref} from 'vue'
import { import {
Dialog, Dialog,
DialogOverlay, DialogOverlay,
@ -300,11 +302,12 @@ import {
MenuItems, MenuItems,
TransitionChild, TransitionChild,
TransitionRoot, TransitionRoot,
} from '@headlessui/vue'; } from '@headlessui/vue'
import { import {
BellIcon, BellIcon,
CogIcon, CogIcon,
HomeIcon, HomeIcon,
CollectionIcon,
MenuAlt1Icon, MenuAlt1Icon,
QuestionMarkCircleIcon, QuestionMarkCircleIcon,
ShieldCheckIcon, ShieldCheckIcon,
@ -313,23 +316,18 @@ import {
SunIcon, SunIcon,
StarIcon, StarIcon,
CalendarIcon, CalendarIcon,
} from '@heroicons/vue/outline'; } from '@heroicons/vue/outline'
import { import {
CashIcon, CashIcon,
CheckCircleIcon, CheckCircleIcon,
CheckIcon,
ChevronDownIcon, ChevronDownIcon,
ChevronRightIcon, ChevronRightIcon,
OfficeBuildingIcon, OfficeBuildingIcon,
SearchIcon, SearchIcon,
} from '@heroicons/vue/solid'; } from '@heroicons/vue/solid'
import {computed} from 'vue'; import {computed} from 'vue'
import {usePage} from '@inertiajs/inertia-vue3'; import {usePage} from '@inertiajs/inertia-vue3'
const secondaryNavigation = [
{ name: 'Settings', href: '#', icon: CogIcon },
{ name: 'Help', href: '#', icon: QuestionMarkCircleIcon },
{ name: 'Privacy', href: '#', icon: ShieldCheckIcon },
];
export default { export default {
components: { components: {
@ -352,26 +350,36 @@ export default {
XIcon, XIcon,
StarIcon, StarIcon,
HomeIcon, HomeIcon,
CheckIcon,
UserGroupIcon, UserGroupIcon,
SunIcon, SunIcon,
CalendarIcon, CalendarIcon,
}, },
setup() { setup() {
const sidebarOpen = ref(false); const sidebarOpen = ref(false)
const user = computed(() => usePage().props.value.auth.user);
const years = computed(() => usePage().props.value.years); const user = computed(() => usePage().props.value.auth.user)
const years = computed(() => usePage().props.value.years)
const navigation = [ const navigation = [
{name: 'Strona główna', href: '/', icon: HomeIcon, current: true}, {name: 'Strona główna', href: '/', icon: HomeIcon, current: true},
{name: 'Użytkownicy', href: '/users', icon: UserGroupIcon, current: false}, {name: 'Użytkownicy', href: '/users', icon: UserGroupIcon, current: false},
{name: 'Dostępne urlopy', href: '/vacation-limits', icon: SunIcon, current: false}, {name: 'Dostępne urlopy', href: '/vacation-limits', icon: SunIcon, current: false},
{name: 'Twoje wnioski', href: '/vacation-requests', icon: CollectionIcon, current: false},
{name: 'Dni wolne', href: '/holidays', icon: StarIcon, current: false}, {name: 'Dni wolne', href: '/holidays', icon: StarIcon, current: false},
{name: 'Kalendarz', href: '/calendar', icon: CalendarIcon, current: false}, {name: 'Kalendarz urlopów', href: '/vacation-calendar', icon: CalendarIcon, current: false},
]; ]
const userNavigation = [ const userNavigation = [
{name: 'Your Profile', href: '#'}, {name: 'Your Profile', href: '#'},
{name: 'Settings', href: '#'}, {name: 'Settings', href: '#'},
{name: 'Wyloguj się', href: '/logout', method: 'post', as: 'button'}, {name: 'Wyloguj się', href: '/logout', method: 'post', as: 'button'},
]; ]
const secondaryNavigation = [
{name: 'Settings', href: '#', icon: CogIcon},
{name: 'Help', href: '#', icon: QuestionMarkCircleIcon},
{name: 'Privacy', href: '#', icon: ShieldCheckIcon},
]
return { return {
user, user,
years, years,
@ -379,7 +387,7 @@ export default {
secondaryNavigation, secondaryNavigation,
userNavigation, userNavigation,
sidebarOpen, sidebarOpen,
}; }
}, },
}; }
</script> </script>

4
routes/web.php
View File

@ -8,6 +8,7 @@ use Toby\Infrastructure\Http\Controllers\HolidayController;
use Toby\Infrastructure\Http\Controllers\LogoutController; use Toby\Infrastructure\Http\Controllers\LogoutController;
use Toby\Infrastructure\Http\Controllers\SelectYearPeriodController; use Toby\Infrastructure\Http\Controllers\SelectYearPeriodController;
use Toby\Infrastructure\Http\Controllers\UserController; use Toby\Infrastructure\Http\Controllers\UserController;
use Toby\Infrastructure\Http\Controllers\VacationCalendarController;
use Toby\Infrastructure\Http\Controllers\VacationLimitController; use Toby\Infrastructure\Http\Controllers\VacationLimitController;
use Toby\Infrastructure\Http\Controllers\VacationRequestController; use Toby\Infrastructure\Http\Controllers\VacationRequestController;
@ -23,7 +24,8 @@ Route::middleware("auth")->group(function (): void {
Route::get("/vacation-limits", [VacationLimitController::class, "edit"]) Route::get("/vacation-limits", [VacationLimitController::class, "edit"])
->name("vacation.limits"); ->name("vacation.limits");
Route::get("/calendar", [HolidayController::class,"showCalendar"]); Route::get("/vacation-calendar", [VacationCalendarController::class, "index"])
->name("vacation.calendar");
Route::get("/vacation-limits", [VacationLimitController::class, "edit"])->name("vacation.limits"); Route::get("/vacation-limits", [VacationLimitController::class, "edit"])->name("vacation.limits");
Route::put("/vacation-limits", [VacationLimitController::class, "update"]); Route::put("/vacation-limits", [VacationLimitController::class, "update"]);

11
tailwind.config.js
View File

@ -1,4 +1,4 @@
const defaultTheme = require('tailwindcss/defaultTheme'); const defaultTheme = require('tailwindcss/defaultTheme')
module.exports = { module.exports = {
content: [ content: [
@ -21,17 +21,14 @@ module.exports = {
'600': '#3C5F97', '600': '#3C5F97',
'700': '#2C466F', '700': '#2C466F',
'800': '#1C2D47', '800': '#1C2D47',
'900': '#0C141F' '900': '#0C141F',
}, },
}, },
gridTemplateColumns: {
'38': 'repeat(38, minmax(0, 1fr))',
}
}, },
}, },
plugins: [ plugins: [
require('@tailwindcss/forms'), require('@tailwindcss/forms'),
require('@tailwindcss/typography'), require('@tailwindcss/typography'),
require('@tailwindcss/line-clamp') require('@tailwindcss/line-clamp'),
], ],
}; }