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

#120 - remote work (#127)

Browse Source 
* #120 - wip

* #120 - add icon to home office

* #120 - wip

* #120 - wip

* #120 - wip

* #120 - wip

* #120 - wip

* #120 - ui fixes

* #120 - fix

* #120 - fix

* #120 - fix

* #120 - fix

* #120 - translation fix

* #120 - fix

Co-authored-by: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
This commit is contained in:
Adrian Hopek
2022-04-21 07:44:22 +02:00
committed by GitHub
parent cc981b02b4
commit c95d08c861
34 changed files with 277 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
resources/js/Composables/vacationTypeInfo.js
View File

@@ -8,6 +8,7 @@ import HandHeartOutlineIcon from 'vue-material-design-icons/HandHeartOutline.vue
import CalendarCheckIcon from 'vue-material-design-icons/CalendarCheck.vue'
import MedicalBagIcon from 'vue-material-design-icons/MedicalBag.vue'
import CalendarRemoveIcon from 'vue-material-design-icons/CalendarRemove.vue'
import LaptopIcon from 'vue-material-design-icons/Laptop.vue'
const types = [
{
@@ -80,6 +81,13 @@ const types = [
color: 'text-cyan-500',
border: 'border-cyan-500',
},
{
text: 'Praca zdalna',
value: 'home_office',
icon: LaptopIcon,
color: 'text-fuchsia-500',
border: 'border-fuchsia-500',
},
]
export default function useVacationTypeInfo() {

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

@@ -15,9 +15,13 @@
:requests="vacationRequests.data"
/>
<AbsenceList
v-if="years.current.year === years.selected.year"
v-if="years.current.year === years.selected.year && absences.data.length"
:absences="absences.data"
/>
<HomeOfficeList
v-if="years.current.year === years.selected.year && remoteDays.data.length"
:remote-days="remoteDays.data"
/>
<UpcomingHolidays
v-if="years.current.year === years.selected.year"
:holidays="holidays.data"
@@ -30,6 +34,7 @@
import Welcome from '@/Shared/Widgets/Welcome'
import VacationStats from '@/Shared/Widgets/VacationStats'
import AbsenceList from '@/Shared/Widgets/AbsenceList'
import HomeOfficeList from '@/Shared/Widgets/HomeOfficeList'
import UpcomingHolidays from '@/Shared/Widgets/UpcomingHolidays'
import UserVacationRequests from '@/Shared/Widgets/UserVacationRequests'
import PendingVacationRequests from '@/Shared/Widgets/PendingVacationRequests'
@@ -37,6 +42,7 @@ import PendingVacationRequests from '@/Shared/Widgets/PendingVacationRequests'
defineProps({
auth: Object,
absences: Object,
remoteDays: Object,
vacationRequests: Object,
holidays: Object,
can: Object,

8
resources/js/Pages/Users/Create.vue
View File

@@ -133,14 +133,14 @@
as="template"
:value="role"
>
<li :class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<li :class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ role.label }}
</span>
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -188,14 +188,14 @@
as="template"
:value="employmentForm"
>
<li :class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<li :class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ employmentForm.label }}
</span>
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>

8
resources/js/Pages/Users/Edit.vue
View File

@@ -136,7 +136,7 @@
:value="role"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
>
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ role.label }}
@@ -144,7 +144,7 @@
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -194,7 +194,7 @@
:value="employmentForm"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
>
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ employmentForm.label }}
@@ -202,7 +202,7 @@
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>

15
resources/js/Pages/VacationRequest/Create.vue
View File

@@ -72,7 +72,7 @@
as="template"
:value="user"
>
<li :class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<li :class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<div class="flex items-center">
<img
:src="user.avatar"
@@ -86,7 +86,7 @@
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -142,7 +142,9 @@
:class="{ 'border-red-300 text-red-900 focus:ring-red-500 focus:border-red-500': form.errors.type, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.type }"
>
<template v-if="form.vacationType">
<span class="block truncate">{{ form.vacationType.label }}</span>
<span class="block truncate">
<VacationType :type="form.vacationType.value" />
</span>
<span class="flex absolute inset-y-0 right-0 items-center pr-2 pointer-events-none">
<SelectorIcon class="w-5 h-5 text-gray-400" />
</span>
@@ -164,14 +166,14 @@
as="template"
:value="vacationType"
>
<li :class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<li :class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']">
<span :class="[selected ? 'font-semibold' : 'font-normal', 'block truncate']">
{{ vacationType.label }}
<VacationType :type="vacationType.value" />
</span>
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -331,6 +333,7 @@ import { reactive, ref, watch } from 'vue'
import axios from 'axios'
import useCurrentYearPeriodInfo from '@/Composables/yearPeriodInfo'
import VacationChart from '@/Shared/VacationChart'
import VacationType from '@/Shared/VacationType'
const props = defineProps({
auth: Object,

4
resources/js/Pages/VacationRequest/Index.vue
View File

@@ -70,13 +70,13 @@
:value="status"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default truncate select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default truncate select-none relative py-2 pl-3 pr-9']"
>
{{ status.name }}
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>

12
resources/js/Pages/VacationRequest/IndexForApprovers.vue
View File

@@ -61,7 +61,7 @@
:value="null"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
>
<div class="flex items-center">
Wszyscy
@@ -69,7 +69,7 @@
<span
v-if="form.user === null"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -83,7 +83,7 @@
:value="user"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default select-none relative py-2 pl-3 pr-9']"
>
<div class="flex items-center">
<img
@@ -98,7 +98,7 @@
</div>
<span
v-if="form.user?.id === user.id"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>
@@ -143,13 +143,13 @@
:value="status"
>
<li
:class="[active ? 'text-white bg-blumilk-600' : 'text-gray-900', 'cursor-default truncate select-none relative py-2 pl-3 pr-9']"
:class="[active ? 'bg-gray-100' : 'text-gray-900', 'cursor-default truncate select-none relative py-2 pl-3 pr-9']"
>
{{ status.name }}
<span
v-if="selected"
:class="[active ? 'text-white' : 'text-blumilk-600', 'absolute inset-y-0 right-0 flex items-center pr-4']"
:class="['text-blumilk-600 absolute inset-y-0 right-0 flex items-center pr-4']"
>
<CheckIcon class="w-5 h-5" />
</span>

5
resources/js/Pages/VacationRequest/Show.vue
View File

@@ -88,7 +88,10 @@
-
</dd>
</div>
<div class="py-5 px-4 bg-white sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<div
v-if="VacationType.isVacation"
class="py-5 px-4 bg-white sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt class="flex items-center text-sm font-medium text-gray-500">
Załączniki
</dt>

2
resources/js/Shared/VacationBar.vue
View File

@@ -27,7 +27,7 @@
</div>
</div>
<template #content>
<div class="py-2 px-4 text-gray-900 bg-white rounded-md shadow-md text-md">
<div class="py-2 px-4 text-gray-900 bg-white rounded-lg border border-gray-400 text-md">
<div class="flex items-center font-normal">
<i
class="inline-block mr-3 w-5 h-3"

2
resources/js/Shared/VacationPopup.vue
View File

@@ -16,7 +16,7 @@
</div>
<div class="py-2 space-y-1">
<dt class="text-sm font-medium text-gray-500">
Rodzaj urlopu
Rodzaj wniosku
</dt>
<dd class="mt-1 text-sm text-gray-900">
<VacationType :type="vacation.type" />

5
resources/js/Shared/Widgets/AbsenceList.vue
View File

@@ -25,11 +25,6 @@
</p>
</div>
</li>
<li v-if="! absences.length">
<p class="py-2">
Brak danych
</p>
</li>
</ul>
</div>
</section>

37
resources/js/Shared/Widgets/HomeOfficeList.vue Normal file
View File

@@ -0,0 +1,37 @@
<template>
<section class="bg-white shadow-md">
<div class="p-4 sm:px-6">
<h2 class="text-lg font-medium leading-6 text-gray-900">
Dzisiejsza praca zdalna
</h2>
</div>
<div class="px-4 border-t border-gray-200 sm:px-6">
<ul class="divide-y divide-gray-200">
<li
v-for="day in remoteDays"
:key="day.user.id"
class="flex py-4"
>
<img
class="w-10 h-10 rounded-full"
:src="day.user.avatar"
>
<div class="ml-3">
<p class="text-sm font-medium text-gray-900">
{{ day.user.name }}
</p>
<p class="text-sm text-gray-500">
{{ day.user.email }}
</p>
</div>
</li>
</ul>
</div>
</section>
</template>
<script setup>
defineProps({
remoteDays: Object,
})
</script>

17
resources/js/Shared/Widgets/VacationStats.vue
View File

@@ -39,7 +39,7 @@
</dt>
</div>
<div class="py-5 px-4 bg-white shadow-md sm:p-6">
<dt class="mt-1 text-4xl font-semibold text-gray-900">
<dt class="mt-1 text-4xl font-semibold text-blumilk-800">
{{ stats.limit }}
</dt>
<dd class="font-medium text-gray-700 truncate text-md">
@@ -49,8 +49,8 @@
Twój roczny limit urlopu wypoczynkowego.
</dt>
</div>
<div class="col-span-2 py-5 px-4 bg-white shadow-md sm:p-6">
<dt class="mt-1 text-4xl font-semibold text-gray-900">
<div class="py-5 px-4 bg-white shadow-md sm:p-6">
<dt class="mt-1 text-4xl font-semibold text-gray-500">
{{ stats.other }}
</dt>
<dd class="font-medium text-gray-700 truncate text-md">
@@ -60,6 +60,17 @@
Urlopy bezpłatne, okolicznościowe, zwolnienia lekarskie, itd., które zostały już zatwierdzone.
</dt>
</div>
<div class="py-5 px-4 bg-white shadow-md sm:p-6">
<dt class="mt-1 text-4xl font-semibold text-fuchsia-700">
{{ stats.homeOffice }}
</dt>
<dd class="font-medium text-gray-700 truncate text-md">
Praca zdalna
</dd>
<dt class="mt-2 text-sm font-medium text-gray-500">
Dni przepracowane poza biurem.
</dt>
</div>
</div>
</div>
</section>