From aa2d05acfd959376390ec96a2a56ed831f82df2f Mon Sep 17 00:00:00 2001
From: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
Date: Fri, 29 Apr 2022 11:12:04 +0200
Subject: [PATCH] - improved list of request on dashboard

---
 .../Widgets/PendingVacationRequests.vue       | 15 +++++++---
 .../Shared/Widgets/UserVacationRequests.vue   | 29 +++++++++++--------
 2 files changed, 28 insertions(+), 16 deletions(-)

diff --git a/resources/js/Shared/Widgets/PendingVacationRequests.vue b/resources/js/Shared/Widgets/PendingVacationRequests.vue
index 8494e60..c643f38 100644
--- a/resources/js/Shared/Widgets/PendingVacationRequests.vue
+++ b/resources/js/Shared/Widgets/PendingVacationRequests.vue
@@ -14,18 +14,24 @@
             class="py-5"
           >
             <div class="relative focus-within:ring-2 focus-within:ring-blumilk-500">
+              <div class="flex flex-row">
               <h3 class="text-sm font-semibold text-blumilk-600 hover:text-blumilk-500">
                 <InertiaLink
                   :href="`/vacation/requests/${request.id}`"
                   class="hover:underline focus:outline-none"
                 >
                   <span class="absolute inset-0" />
-                  Wniosek o {{ findType(request.type).text.toLowerCase() }}
-                  [{{ request.name }}]
+                  Wniosek [{{ request.name }}]
                 </InertiaLink>
               </h3>
-              <p class="mt-1 text-sm text-gray-600">
-                {{ request.from }} - {{ request.to }}
+                <div>
+                  <div class="text-sm text-gray-600 ml-2">
+                    {{ request.from }} - {{ request.to }}
+                  </div>
+                </div>
+              </div>
+              <p class="mt-2 text-sm text-gray-600">
+                <VacationType :type="request.type" />
               </p>
               <div class="mt-3 text-sm text-gray-600">
                 <div class="flex">
@@ -67,6 +73,7 @@
 
 <script setup>
 import useVacationTypeInfo from '@/Composables/vacationTypeInfo'
+import VacationType from '@/Shared/VacationType'
 
 defineProps({
   requests: Object,
diff --git a/resources/js/Shared/Widgets/UserVacationRequests.vue b/resources/js/Shared/Widgets/UserVacationRequests.vue
index 919fcfa..0f84d99 100644
--- a/resources/js/Shared/Widgets/UserVacationRequests.vue
+++ b/resources/js/Shared/Widgets/UserVacationRequests.vue
@@ -14,18 +14,22 @@
             class="py-5"
           >
             <div class="relative focus-within:ring-2 focus-within:ring-blumilk-500">
-              <h3 class="text-sm font-semibold text-blumilk-600 hover:text-blumilk-500">
-                <InertiaLink
-                  :href="`/vacation/requests/${request.id}`"
-                  class="hover:underline focus:outline-none"
-                >
-                  <span class="absolute inset-0" />
-                  Wniosek o {{ findType(request.type).text.toLowerCase() }}
-                  [{{ request.name }}]
-                </InertiaLink>
-              </h3>
-              <p class="mt-1 text-sm text-gray-600">
-                {{ request.from }} - {{ request.to }}
+              <div class="flex flex-row">
+                <h3 class="text-sm font-semibold text-blumilk-600 hover:text-blumilk-500">
+                  <InertiaLink
+                    :href="`/vacation/requests/${request.id}`"
+                    class="hover:underline focus:outline-none"
+                  >
+                    <span class="absolute inset-0" />
+                    Wniosek [{{ request.name }}]
+                  </InertiaLink>
+                </h3>
+                <div class="text-sm text-gray-600 ml-2">
+                  {{ request.from }} - {{ request.to }}
+                </div>
+              </div>
+              <p class="mt-2 text-sm text-gray-600">
+                <VacationType :type="request.type" />
               </p>
               <p class="mt-2 text-sm text-gray-600">
                 <Status :status="request.state" />
@@ -54,6 +58,7 @@
 <script setup>
 import useVacationTypeInfo from '@/Composables/vacationTypeInfo'
 import Status from '@/Shared/Status'
+import VacationType from '@/Shared/VacationType'
 
 defineProps({
   requests: Object,