#40 - generate pdf for vacation request (#46)

* #40 - wip

* #40 - generate pdf

* #40 - fix

* Update resources/js/Pages/VacationRequest/Show.vue

Co-authored-by: Ewelina Lasowy <56546832+EwelinaLasowy@users.noreply.github.com>

* #40 - fix

Co-authored-by: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
Co-authored-by: Ewelina Lasowy <56546832+EwelinaLasowy@users.noreply.github.com>
This commit is contained in:
Adrian Hopek
2022-02-04 10:57:11 +01:00
committed by GitHub
parent 067b343f24
commit 41c769d4ab
22 changed files with 544 additions and 10 deletions

View File

@@ -82,6 +82,29 @@
</p>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 py-4 items-center">
<label
for="position"
class="block text-sm font-medium text-gray-700 sm:mt-px"
>
Stanowisko
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input
id="position"
v-model="form.position"
type="text"
class="block w-full max-w-lg shadow-sm rounded-md sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.position, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.position }"
>
<p
v-if="form.errors.position"
class="mt-2 text-sm text-red-600"
>
{{ form.errors.position }}
</p>
</div>
</div>
<Listbox
v-model="form.role"
as="div"
@@ -270,6 +293,7 @@ export default {
email: null,
employmentForm: props.employmentForms[0],
role: props.roles[0],
position: null,
employmentDate: null,
})

View File

@@ -82,6 +82,29 @@
</p>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 py-4 items-center">
<label
for="position"
class="block text-sm font-medium text-gray-700 sm:mt-px"
>
Stanowisko
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input
id="position"
v-model="form.position"
type="text"
class="block w-full max-w-lg shadow-sm rounded-md sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.position, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.position }"
>
<p
v-if="form.errors.position"
class="mt-2 text-sm text-red-600"
>
{{ form.errors.position }}
</p>
</div>
</div>
<Listbox
v-model="form.role"
as="div"
@@ -272,6 +295,7 @@ export default {
lastName: props.user.lastName,
email: props.user.email,
role: props.roles.find(role => role.value === props.user.role),
position: props.user.position,
employmentForm: props.employmentForms.find(form => form.value === props.user.employmentForm),
employmentDate: props.user.employmentDate,
})

View File

@@ -49,6 +49,12 @@
>
Rola
</th>
<th
scope="col"
class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
>
Stanowisko
</th>
<th
scope="col"
class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
@@ -97,6 +103,9 @@
<td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
{{ user.role }}
</td>
<td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
{{ user.position }}
</td>
<td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
{{ user.employmentForm }}
</td>

View File

@@ -58,6 +58,30 @@
{{ request.comment }}
</dd>
</div>
<div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt class="text-sm font-medium text-gray-500">
Załączniki
</dt>
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
<ul class="border border-gray-200 rounded-md divide-y divide-gray-200">
<li class="pl-3 pr-4 py-3 flex items-center justify-between text-sm">
<div class="w-0 flex-1 flex items-center">
<PaperClipIcon class="flex-shrink-0 h-5 w-5 text-gray-400" />
<span class="ml-2 flex-1 w-0 truncate"> wniosek_urlopowy.pdf </span>
</div>
<div class="ml-4 flex-shrink-0">
<a
:href="`/vacation-requests/${request.id}/download`"
target="_blank"
class="font-medium text-blumilk-600 hover:text-blumilk-500"
>
Pobierz
</a>
</div>
</li>
</ul>
</dd>
</div>
</dl>
</div>
</div>
@@ -196,11 +220,13 @@
<script>
import { ThumbUpIcon } from '@heroicons/vue/outline'
import {PaperClipIcon} from '@heroicons/vue/solid'
export default {
name: 'VacationRequestShow',
components: {
ThumbUpIcon,
PaperClipIcon,
},
props: {
request: {

View File

@@ -0,0 +1,95 @@
<!DOCTYPE html>
<html lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Wniosek urlopowy</title>
<style>
body {
font-family: DejaVu Sans, sans-serif;
}
h2 {
text-align: center;
}
p {
margin: 0;
text-align: center;
}
.container {
margin: 60px 20px;
}
.helper-text {
font-size: 12px;
font-weight: bold;
padding-bottom: 12px;
}
.content {
margin-top: 60px;
line-height: 24px;
text-align: left;
}
.main {
margin-top: 60px;
}
table {
width: 100%;
text-align: center;
}
.signatureTable {
margin-top: 100px;
}
</style>
</head>
<body>
<div class="container">
<div>
<table>
<tbody>
<tr>
<td>{{ $vacationRequest->user->fullName }}</td>
<td>Legnica, {{ $vacationRequest->created_at->format("d.m.Y") }}</td>
</tr>
<tr>
<td class="helper-text">imię i nazwisko</td>
</tr>
<tr>
<td>{{ $vacationRequest->user->position }}</td>
</tr>
<tr>
<td class="helper-text">stanowisko</td>
</tr>
</tbody>
</table>
</div>
<div class="main">
<h2>Wniosek o urlop</h2>
<p class="content">
Proszę o {{ mb_strtolower($vacationRequest->type->label()) }} w okresie od dnia {{ $vacationRequest->from->format("d.m.Y") }}
do dnia {{ $vacationRequest->to->format("d.m.Y") }} włącznie tj. x dni roboczych za rok {{ $vacationRequest->yearPeriod->year }}.
</p>
</div>
<table class="signatureTable">
<tbody>
<tr>
<td>........................</td>
<td>........................</td>
</tr>
<tr>
<td class="helper-text">podpis przełożonego</td>
<td class="helper-text">podpis pracownika</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>