From 22fc753c73d9557e40f13526535d4b93d4f63268 Mon Sep 17 00:00:00 2001
From: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
Date: Mon, 28 Feb 2022 07:46:18 +0100
Subject: [PATCH] wip

---
 .../Http/Controllers/DashboardController.php  |  11 -
 resources/js/Pages/Calendar.vue               |   2 +-
 resources/js/Pages/Dashboard.vue              |  20 +-
 resources/js/Pages/Holidays/Index.vue         | 220 +++++++++---------
 resources/js/Pages/VacationLimits.vue         | 210 +++++++++--------
 5 files changed, 221 insertions(+), 242 deletions(-)

diff --git a/app/Infrastructure/Http/Controllers/DashboardController.php b/app/Infrastructure/Http/Controllers/DashboardController.php
index 053fcf4..4dda8e2 100644
--- a/app/Infrastructure/Http/Controllers/DashboardController.php
+++ b/app/Infrastructure/Http/Controllers/DashboardController.php
@@ -66,16 +66,6 @@ class DashboardController extends Controller
             )
             ->count();
 
-        $onRequest = $request->user()
-            ->vacations()
-            ->whereRelation(
-                "vacationRequest",
-                fn(Builder $query) => $query
-                    ->where("type", VacationType::OnRequest)
-                    ->states(VacationRequestState::successStates()),
-            )
-            ->count();
-
         $pending = $request->user()
             ->vacations()
             ->whereRelation(
@@ -106,7 +96,6 @@ class DashboardController extends Controller
                 "used" => $used,
                 "pending" => $pending,
                 "other" => $other,
-                "onRequest" => 4 - $onRequest,
             ],
         ]);
     }
diff --git a/resources/js/Pages/Calendar.vue b/resources/js/Pages/Calendar.vue
index 1a8e095..3b04cb6 100644
--- a/resources/js/Pages/Calendar.vue
+++ b/resources/js/Pages/Calendar.vue
@@ -12,7 +12,7 @@
           :href="`/timesheet/${selectedMonth.value}`"
           class="inline-flex items-center px-4 py-3 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-blumilk-600 hover:bg-blumilk-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"
         >
-          Pobierz plik excel
+          Pobierz plik Excel
         </a>
       </div>
     </div>
diff --git a/resources/js/Pages/Dashboard.vue b/resources/js/Pages/Dashboard.vue
index ffca69f..51730f8 100644
--- a/resources/js/Pages/Dashboard.vue
+++ b/resources/js/Pages/Dashboard.vue
@@ -67,7 +67,7 @@
                   Rozpatrywane
                 </dd>
                 <dt class="text-sm font-medium text-gray-500 mt-2">
-                  Dni czekające na akceptację przełożonych
+                  Dni czekające na akceptację przełożonych.
                 </dt>
               </div>
               <div class="px-4 py-5 bg-white shadow-md sm:p-6">
@@ -81,18 +81,7 @@
                   Twój roczny limit urlopu wypoczynkowego.
                 </dt>
               </div>
-              <div class="px-4 py-5 bg-white shadow-md sm:p-6">
-                <dt class="mt-1 text-4xl font-semibold text-gray-900">
-                  {{ stats.onRequest }}
-                </dt>
-                <dd class="text-md font-medium text-gray-500 truncate">
-                  Urlop na żądanie
-                </dd>
-                <dt class="text-sm font-medium text-gray-500 mt-2">
-                  Ilość dni urlopu na żądanie, który wlicza się w limit urlopu wypoczynkowego.
-                </dt>
-              </div>
-              <div class="px-4 py-5 bg-white shadow-md sm:p-6">
+              <div class="px-4 py-5 bg-white shadow-md sm:p-6 col-span-2">
                 <dt class="mt-1 text-4xl font-semibold text-gray-900">
                   {{ stats.other }}
                 </dt>
@@ -183,6 +172,11 @@
                   </p>
                 </div>
               </li>
+              <li v-if="! absences.data.length">
+                <p class="py-2">
+                  Brak danych
+                </p>
+              </li>
             </ul>
           </div>
         </div>
diff --git a/resources/js/Pages/Holidays/Index.vue b/resources/js/Pages/Holidays/Index.vue
index bd71b55..c03eb59 100644
--- a/resources/js/Pages/Holidays/Index.vue
+++ b/resources/js/Pages/Holidays/Index.vue
@@ -19,122 +19,120 @@
         </InertiaLink>
       </div>
     </div>
-    <div class="border-t border-gray-200">
-      <div class="overflow-x-auto xl:overflow-x-visible overflow-y-auto xl:overflow-y-visible">
-        <table class="min-w-full divide-y divide-gray-200">
-          <thead class="bg-gray-100">
-            <tr>
-              <th
-                scope="col"
-                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-              >
-                Nazwa
-              </th>
-              <th
-                scope="col"
-                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-              >
-                Data
-              </th>
-              <th
-                scope="col"
-                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-              >
-                Dzień tygodnia
-              </th>
-              <th
-                scope="col"
-                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-              />
-            </tr>
-          </thead>
-          <tbody class="bg-white divide-y divide-gray-100">
-            <tr
-              v-for="holiday in holidays.data"
-              :key="holiday.id"
-              class="hover:bg-blumilk-25"
+    <div class="overflow-x-auto xl:overflow-x-visible overflow-y-auto xl:overflow-y-visible">
+      <table class="min-w-full divide-y divide-gray-200">
+        <thead class="bg-gray-50">
+          <tr>
+            <th
+              scope="col"
+              class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
             >
-              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500 font-semibold capitalize">
-                {{ holiday.name }}
-              </td>
-              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                {{ holiday.displayDate }}
-              </td>
-              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                {{ holiday.dayOfWeek }}
-              </td>
-              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500 text-right">
-                <Menu
-                  as="div"
-                  class="relative inline-block text-left"
-                >
-                  <MenuButton class="rounded-full flex items-center text-gray-400 hover:text-gray-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blumilk-500">
-                    <DotsVerticalIcon
-                      class="h-5 w-5"
-                      aria-hidden="true"
-                    />
-                  </MenuButton>
+              Nazwa
+            </th>
+            <th
+              scope="col"
+              class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+            >
+              Data
+            </th>
+            <th
+              scope="col"
+              class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+            >
+              Dzień tygodnia
+            </th>
+            <th
+              scope="col"
+              class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+            />
+          </tr>
+        </thead>
+        <tbody class="bg-white divide-y divide-gray-100">
+          <tr
+            v-for="holiday in holidays.data"
+            :key="holiday.id"
+            class="hover:bg-blumilk-25"
+          >
+            <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500 font-semibold capitalize">
+              {{ holiday.name }}
+            </td>
+            <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+              {{ holiday.displayDate }}
+            </td>
+            <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+              {{ holiday.dayOfWeek }}
+            </td>
+            <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500 text-right">
+              <Menu
+                as="div"
+                class="relative inline-block text-left"
+              >
+                <MenuButton class="rounded-full flex items-center text-gray-400 hover:text-gray-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blumilk-500">
+                  <DotsVerticalIcon
+                    class="h-5 w-5"
+                    aria-hidden="true"
+                  />
+                </MenuButton>
 
-                  <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 z-10 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
-                      <div class="py-1">
-                        <MenuItem
-                          v-slot="{ active }"
-                          class="flex"
+                <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 z-10 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
+                    <div class="py-1">
+                      <MenuItem
+                        v-slot="{ active }"
+                        class="flex"
+                      >
+                        <InertiaLink
+                          :href="`/holidays/${holiday.id}/edit`"
+                          :class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'font-medium block px-4 py-2 text-sm']"
                         >
-                          <InertiaLink
-                            :href="`/holidays/${holiday.id}/edit`"
-                            :class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'font-medium block px-4 py-2 text-sm']"
-                          >
-                            <PencilIcon
-                              class="mr-2 h-5 w-5 text-blue-500"
-                              aria-hidden="true"
-                            /> Edytuj
-                          </InertiaLink>
-                        </MenuItem>
-                        <MenuItem
-                          v-slot="{ active }"
-                          class="flex"
+                          <PencilIcon
+                            class="mr-2 h-5 w-5 text-blue-500"
+                            aria-hidden="true"
+                          /> Edytuj
+                        </InertiaLink>
+                      </MenuItem>
+                      <MenuItem
+                        v-slot="{ active }"
+                        class="flex"
+                      >
+                        <InertiaLink
+                          as="button"
+                          method="delete"
+                          :preserve-scroll="true"
+                          :href="`/holidays/${holiday.id}`"
+                          :class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'block w-full text-left font-medium px-4 py-2 text-sm']"
                         >
-                          <InertiaLink
-                            as="button"
-                            method="delete"
-                            :preserve-scroll="true"
-                            :href="`/holidays/${holiday.id}`"
-                            :class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'block w-full text-left font-medium px-4 py-2 text-sm']"
-                          >
-                            <TrashIcon
-                              class="mr-2 h-5 w-5 text-red-500"
-                              aria-hidden="true"
-                            /> Usuń
-                          </InertiaLink>
-                        </MenuItem>
-                      </div>
-                    </MenuItems>
-                  </transition>
-                </Menu>
-              </td>
-            </tr>
-            <tr
-              v-if="!holidays.data.length"
+                          <TrashIcon
+                            class="mr-2 h-5 w-5 text-red-500"
+                            aria-hidden="true"
+                          /> Usuń
+                        </InertiaLink>
+                      </MenuItem>
+                    </div>
+                  </MenuItems>
+                </transition>
+              </Menu>
+            </td>
+          </tr>
+          <tr
+            v-if="!holidays.data.length"
+          >
+            <td
+              colspan="100%"
+              class="text-center py-4 text-xl leading-5 text-gray-700"
             >
-              <td
-                colspan="100%"
-                class="text-center py-4 text-xl leading-5 text-gray-700"
-              >
-                Brak danych
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
+              Brak danych
+            </td>
+          </tr>
+        </tbody>
+      </table>
     </div>
   </div>
 </template>
diff --git a/resources/js/Pages/VacationLimits.vue b/resources/js/Pages/VacationLimits.vue
index 1d2ce59..5a23728 100644
--- a/resources/js/Pages/VacationLimits.vue
+++ b/resources/js/Pages/VacationLimits.vue
@@ -11,119 +11,117 @@
         </p>
       </div>
     </div>
-    <div class="border-t border-gray-200">
-      <div class="overflow-x-auto xl:overflow-x-visible overflow-y-auto xl:overflow-y-visible">
-        <form @submit.prevent="submitVacationDays">
-          <table class="min-w-full divide-y divide-gray-200">
-            <thead class="bg-gray-50">
-              <tr>
-                <th
-                  scope="col"
-                  class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-                >
-                  Imię i nazwisko
-                </th>
-                <th
-                  scope="col"
-                  class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-                >
-                  Forma zatrudnienia
-                </th>
-                <th
-                  scope="col"
-                  class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-                >
-                  Posiada urlop?
-                </th>
-                <th
-                  scope="col"
-                  class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
-                >
-                  Dostępne dni w roku
-                </th>
-              </tr>
-            </thead>
-            <tbody class="bg-white divide-y divide-gray-100">
-              <tr
-                v-for="(item, index) in form.items"
-                :key="item.id"
-                class="hover:bg-blumilk-25"
+    <div class="overflow-x-auto xl:overflow-x-visible overflow-y-auto xl:overflow-y-visible">
+      <form @submit.prevent="submitVacationDays">
+        <table class="min-w-full divide-y divide-gray-200">
+          <thead class="bg-gray-50">
+            <tr>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
               >
-                <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                  <div class="flex">
-                    <span
-                      class="inline-flex items-center justify-center h-10 w-10 rounded-full"
-                    >
-                      <img
-                        class="h-10 w-10 rounded-full"
-                        :src="item.user.avatar"
-                        alt=""
-                      >
-                    </span>
-                    <div class="ml-3">
-                      <p class="text-sm font-medium break-all text-gray-900">
-                        {{ item.user.name }}
-                      </p>
-                      <p class="text-sm break-all text-gray-500">
-                        {{ item.user.email }}
-                      </p>
-                    </div>
-                  </div>
-                </td>
-                <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                  {{ item.user.employmentForm }}
-                </td>
-                <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                  <Switch
-                    v-model="item.hasVacation"
-                    :class="[item.hasVacation ? 'bg-blumilk-500' : 'bg-gray-200', 'relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500']"
+                Imię i nazwisko
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+              >
+                Forma zatrudnienia
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+              >
+                Posiada urlop?
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-semibold text-gray-500 uppercase tracking-wider"
+              >
+                Dostępne dni w roku
+              </th>
+            </tr>
+          </thead>
+          <tbody class="bg-white divide-y divide-gray-100">
+            <tr
+              v-for="(item, index) in form.items"
+              :key="item.id"
+              class="hover:bg-blumilk-25"
+            >
+              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+                <div class="flex">
+                  <span
+                    class="inline-flex items-center justify-center h-10 w-10 rounded-full"
                   >
-                    <span
-                      :class="[item.hasVacation ? 'translate-x-5' : 'translate-x-0', 'pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200']"
-                    />
-                  </Switch>
-                </td>
-                <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
-                  <div class="mt-1 sm:mt-0 sm:col-span-2">
-                    <input
-                      v-model="item.days"
-                      type="number"
-                      min="0"
-                      class="block w-full shadow-sm rounded-md sm:text-sm disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none disabled:cursor-not-allowed"
-                      :disabled="!item.hasVacation"
-                      :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`items.${index}.days`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`items.${index}.days`] }"
+                    <img
+                      class="h-10 w-10 rounded-full"
+                      :src="item.user.avatar"
+                      alt=""
                     >
-                    <p
-                      v-if="form.errors[`items.${index}.days`]"
-                      class="mt-2 text-sm text-red-600"
-                    >
-                      {{ form.errors[`items.${index}.days`] }}
+                  </span>
+                  <div class="ml-3">
+                    <p class="text-sm font-medium break-all text-gray-900">
+                      {{ item.user.name }}
+                    </p>
+                    <p class="text-sm break-all text-gray-500">
+                      {{ item.user.email }}
                     </p>
                   </div>
-                </td>
-              </tr>
-              <tr
-                v-if="!form.items.length"
-              >
-                <td
-                  colspan="100%"
-                  class="text-center py-4 text-xl leading-5 text-gray-700"
+                </div>
+              </td>
+              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+                {{ item.user.employmentForm }}
+              </td>
+              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+                <Switch
+                  v-model="item.hasVacation"
+                  :class="[item.hasVacation ? 'bg-blumilk-500' : 'bg-gray-200', 'relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500']"
                 >
-                  Brak danych
-                </td>
-              </tr>
-            </tbody>
-          </table>
-          <div class="flex justify-end py-3 px-4">
-            <button
-              type="submit"
-              class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-blumilk-600 hover:bg-blumilk-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"
+                  <span
+                    :class="[item.hasVacation ? 'translate-x-5' : 'translate-x-0', 'pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200']"
+                  />
+                </Switch>
+              </td>
+              <td class="px-4 py-4 whitespace-nowrap text-sm text-gray-500">
+                <div class="mt-1 sm:mt-0 sm:col-span-2">
+                  <input
+                    v-model="item.days"
+                    type="number"
+                    min="0"
+                    class="block w-full shadow-sm rounded-md sm:text-sm disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none disabled:cursor-not-allowed"
+                    :disabled="!item.hasVacation"
+                    :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`items.${index}.days`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`items.${index}.days`] }"
+                  >
+                  <p
+                    v-if="form.errors[`items.${index}.days`]"
+                    class="mt-2 text-sm text-red-600"
+                  >
+                    {{ form.errors[`items.${index}.days`] }}
+                  </p>
+                </div>
+              </td>
+            </tr>
+            <tr
+              v-if="!form.items.length"
             >
-              Zapisz
-            </button>
-          </div>
-        </form>
-      </div>
+              <td
+                colspan="100%"
+                class="text-center py-4 text-xl leading-5 text-gray-700"
+              >
+                Brak danych
+              </td>
+            </tr>
+          </tbody>
+        </table>
+        <div class="flex justify-end py-3 px-4">
+          <button
+            type="submit"
+            class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-blumilk-600 hover:bg-blumilk-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blumilk-500"
+          >
+            Zapisz
+          </button>
+        </div>
+      </form>
     </div>
   </div>
 </template>