fix
This commit is contained in:
Adrian Hopek
18
resources/js/Shared/Forms/MonthPicker.vue
Normal file
18
resources/js/Shared/Forms/MonthPicker.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<FlatPickr :config="config" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import FlatPickr from 'vue-flatpickr-component'
|
||||
import monthSelectPlugin from 'flatpickr/dist/plugins/monthSelect'
|
||||
|
||||
const config = {
|
||||
plugins: [
|
||||
new monthSelectPlugin({
|
||||
shorthand: true,
|
||||
dateFormat: 'm/Y',
|
||||
}),
|
||||
],
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -6,15 +6,31 @@
|
||||
multiple
|
||||
>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<button
|
||||
<span
|
||||
v-for="(item, index) in selectedItems"
|
||||
:key="index"
|
||||
type="button"
|
||||
class="py-1 px-2 bg-gray-200 rounded-md"
|
||||
@click="selectedItems.splice(index, 1)"
|
||||
class="inline-flex items-center py-1.5 pl-3 pr-1.5 rounded-lg text-sm font-medium bg-blumilk-500 text-white"
|
||||
>
|
||||
{{ item }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="flex-shrink-0 ml-0.5 h-5 w-5 rounded-full inline-flex items-center justify-center text-white hover:bg-blumilk-600 focus:outline-none"
|
||||
@click="selectedItems.splice(index, 1)"
|
||||
>
|
||||
<svg
|
||||
class="h-2 w-2"
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
viewBox="0 0 8 8"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.5"
|
||||
d="M1 1l6 6m0-6L1 7"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<div class="relative mt-2">
|
||||
<ComboboxInput
|
||||
|
||||
@@ -59,7 +59,7 @@
|
||||
>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
<nav class="overflow-y-auto shrink-0 mt-5 h-full divide-y divide-blumilk-800">
|
||||
<nav class="overflow-y-auto shrink-0 mt-5 h-full space-y-5">
|
||||
<div class="px-2 space-y-1">
|
||||
<InertiaLink
|
||||
href="/"
|
||||
@@ -70,28 +70,53 @@
|
||||
Strona główna
|
||||
</InertiaLink>
|
||||
</div>
|
||||
<div class="pt-3 mt-3">
|
||||
<div class="py-1 px-2 space-y-1">
|
||||
<InertiaLink
|
||||
v-for="item in navigation"
|
||||
:key="item.name"
|
||||
:href="item.href"
|
||||
:class="[$page.component.startsWith(item.section) ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 text-base font-medium rounded-md']"
|
||||
@click="sidebarOpen = false;"
|
||||
<div
|
||||
v-if="vacationNavigation.length"
|
||||
class="py-1 px-2 space-y-1"
|
||||
>
|
||||
<InertiaLink
|
||||
v-for="item in vacationNavigation"
|
||||
:key="item.name"
|
||||
:href="item.href"
|
||||
:class="[$page.component.startsWith(item.section) ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 text-base font-medium rounded-md']"
|
||||
@click="sidebarOpen = false;"
|
||||
>
|
||||
<component
|
||||
:is="item.icon"
|
||||
class="shrink-0 mr-4 w-6 h-6 text-blumilk-200"
|
||||
/>
|
||||
{{ item.name }}
|
||||
<span
|
||||
v-if="item.badge"
|
||||
class="py-0.5 px-2.5 ml-3 text-xs font-semibold text-gray-600 bg-gray-100 rounded-full 2xl:inline-block"
|
||||
>
|
||||
<component
|
||||
:is="item.icon"
|
||||
class="shrink-0 mr-4 w-6 h-6 text-blumilk-200"
|
||||
/>
|
||||
{{ item.name }}
|
||||
<span
|
||||
v-if="item.badge"
|
||||
class="py-0.5 px-2.5 ml-3 text-xs font-semibold text-gray-600 bg-gray-100 rounded-full 2xl:inline-block"
|
||||
>
|
||||
{{ item.badge }}
|
||||
</span>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
{{ item.badge }}
|
||||
</span>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
<div
|
||||
v-if="miscNavigaction.length"
|
||||
class="py-1 px-2 space-y-1"
|
||||
>
|
||||
<InertiaLink
|
||||
v-for="item in miscNavigaction"
|
||||
:key="item.name"
|
||||
:href="item.href"
|
||||
:class="[$page.component.startsWith(item.section) ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 text-base font-medium rounded-md']"
|
||||
@click="sidebarOpen = false;"
|
||||
>
|
||||
<component
|
||||
:is="item.icon"
|
||||
class="shrink-0 mr-4 w-6 h-6 text-blumilk-200"
|
||||
/>
|
||||
{{ item.name }}
|
||||
<span
|
||||
v-if="item.badge"
|
||||
class="py-0.5 px-2.5 ml-3 text-xs font-semibold text-gray-600 bg-gray-100 rounded-full 2xl:inline-block"
|
||||
>
|
||||
{{ item.badge }}
|
||||
</span>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
@@ -110,7 +135,7 @@
|
||||
>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
<nav class="flex overflow-y-auto flex-col flex-1 px-2 mt-5 divide-y divide-blumilk-800">
|
||||
<nav class="flex overflow-y-auto flex-col flex-1 px-2 mt-5 space-y-4">
|
||||
<InertiaLink
|
||||
href="/"
|
||||
:class="[$page.component === 'Dashboard' ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 mt-1 text-sm leading-6 font-medium rounded-md']"
|
||||
@@ -118,9 +143,35 @@
|
||||
<HomeIcon class="shrink-0 mr-4 w-6 h-6 text-blumilk-200" />
|
||||
Strona główna
|
||||
</InertiaLink>
|
||||
<div class="pt-1 mt-1 space-y-1">
|
||||
<div
|
||||
v-if="vacationNavigation.length"
|
||||
class="pt-1 mt-1 space-y-1"
|
||||
>
|
||||
<InertiaLink
|
||||
v-for="item in navigation"
|
||||
v-for="item in vacationNavigation"
|
||||
:key="item.name"
|
||||
:href="item.href"
|
||||
:class="[$page.component.startsWith(item.section) ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 text-sm leading-6 font-medium rounded-md']"
|
||||
>
|
||||
<component
|
||||
:is="item.icon"
|
||||
class="shrink-0 mr-4 w-6 h-6 text-blumilk-200"
|
||||
/>
|
||||
{{ item.name }}
|
||||
<span
|
||||
v-if="item.badge"
|
||||
class="py-0.5 px-2.5 ml-3 text-xs font-semibold text-gray-600 bg-gray-100 rounded-full 2xl:inline-block"
|
||||
>
|
||||
{{ item.badge }}
|
||||
</span>
|
||||
</InertiaLink>
|
||||
</div>
|
||||
<div
|
||||
v-if="miscNavigaction.length"
|
||||
class="pt-1 mt-1 space-y-1"
|
||||
>
|
||||
<InertiaLink
|
||||
v-for="item in miscNavigaction"
|
||||
:key="item.name"
|
||||
:href="item.href"
|
||||
:class="[$page.component.startsWith(item.section) ? 'bg-blumilk-800 text-white' : 'text-blumilk-100 hover:text-white hover:bg-blumilk-600', 'group flex items-center px-2 py-2 text-sm leading-6 font-medium rounded-md']"
|
||||
@@ -295,7 +346,7 @@ import {
|
||||
DocumentTextIcon,
|
||||
AdjustmentsIcon,
|
||||
KeyIcon,
|
||||
TemplateIcon,
|
||||
TemplateIcon, BeakerIcon,
|
||||
} from '@heroicons/vue/outline'
|
||||
import { CheckIcon, ChevronDownIcon } from '@heroicons/vue/solid'
|
||||
|
||||
@@ -307,7 +358,7 @@ const props = defineProps({
|
||||
|
||||
const sidebarOpen = ref(false)
|
||||
|
||||
const navigation = computed(() =>
|
||||
const vacationNavigation = computed(() =>
|
||||
[
|
||||
{
|
||||
name: 'Moje wnioski',
|
||||
@@ -359,27 +410,36 @@ const navigation = computed(() =>
|
||||
icon: ClipboardListIcon,
|
||||
can: true,
|
||||
},
|
||||
{
|
||||
name: 'Użytkownicy',
|
||||
href: '/users',
|
||||
section: 'Users/',
|
||||
icon: UserGroupIcon,
|
||||
can: props.auth.can.manageUsers,
|
||||
},
|
||||
{
|
||||
name: 'Klucze',
|
||||
href: '/keys',
|
||||
section: 'Keys',
|
||||
icon: KeyIcon,
|
||||
can: true,
|
||||
},
|
||||
{
|
||||
name: 'CV',
|
||||
href: '/resumes',
|
||||
section: 'Resumes',
|
||||
icon: TemplateIcon,
|
||||
can: props.auth.can.manageResumes,
|
||||
},
|
||||
|
||||
].filter(item => item.can))
|
||||
|
||||
const miscNavigaction = computed(() => [
|
||||
{
|
||||
name: 'Użytkownicy',
|
||||
href: '/users',
|
||||
section: 'Users/',
|
||||
icon: UserGroupIcon,
|
||||
can: props.auth.can.manageUsers,
|
||||
},
|
||||
{
|
||||
name: 'Klucze',
|
||||
href: '/keys',
|
||||
section: 'Keys',
|
||||
icon: KeyIcon,
|
||||
can: true,
|
||||
},
|
||||
{
|
||||
name: 'Technologie',
|
||||
href: '/technologies',
|
||||
section: 'Technologies',
|
||||
icon: BeakerIcon,
|
||||
can: props.auth.can.manageResumes,
|
||||
},
|
||||
{
|
||||
name: 'CV',
|
||||
href: '/resumes',
|
||||
section: 'Resumes',
|
||||
icon: TemplateIcon,
|
||||
can: props.auth.can.manageResumes,
|
||||
},
|
||||
].filter(item => item.can))
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user