From fa62fb5ba1ad541a5b61a261ff54aaa93a17d4c5 Mon Sep 17 00:00:00 2001
From: Nicolas Drolet <nicolasd@targointernet.com>
Date: Thu, 4 Dec 2025 11:47:24 -0500
Subject: [PATCH] fix(employee-management): can now set last work day of
 employee to null properly

---
 .../components/employee/add-modify-dialog-form.vue     |  8 ++++++++
 .../components/employee/add-modify-dialog.vue          | 10 +++++-----
 .../employee-list/models/employee-profile.models.ts    |  4 ++--
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/modules/employee-list/components/employee/add-modify-dialog-form.vue b/src/modules/employee-list/components/employee/add-modify-dialog-form.vue
index d7752ee..a28366b 100644
--- a/src/modules/employee-list/components/employee/add-modify-dialog-form.vue
+++ b/src/modules/employee-list/components/employee/add-modify-dialog-form.vue
@@ -9,6 +9,13 @@
     const last_work_day = computed(() => employee_store.employee.last_work_day ?? '---');
     const is_first_day_picker_open = ref(false);
     const is_last_day_picker_open = ref(false);
+
+    const setLastWorkDay = (date: string | number | null) => {
+        if (typeof date === 'string' && date.length > 0) {
+            employee_store.employee.last_work_day = date;
+        }
+        employee_store.employee.last_work_day = null;
+    }
 </script>
 
 <template>
@@ -224,6 +231,7 @@
                     label-slot
                     mask="####-##-##"
                     class="col q-mx-md"
+                    @update:model-value="setLastWorkDay"
                 >
                     <template #label>
                         <span
diff --git a/src/modules/employee-list/components/employee/add-modify-dialog.vue b/src/modules/employee-list/components/employee/add-modify-dialog.vue
index 41b04c1..da6db0a 100644
--- a/src/modules/employee-list/components/employee/add-modify-dialog.vue
+++ b/src/modules/employee-list/components/employee/add-modify-dialog.vue
@@ -30,7 +30,7 @@
         @show="Object.assign(initial_employee_profile, employee_store.employee)"
     >
         <div
-            class="column bg-secondary rounded-10"
+            class="column bg-secondary rounded-10 no-wrap"
             :class="$q.dark.isActive ? 'shadow-24' : 'shadow-10'"
             :style="($q.screen.lt.md ? ' ' : 'max-width: 60vw !important; height: 60vh') +
                 ($q.dark.isActive ? 'border: 2px solid var(--q-accent)' : '')"
@@ -50,25 +50,25 @@
                 <q-slide-transition>
                     <div
                         v-if="current_step === 'access'"
-                        class="col-12 row flex-center q-px-sm q-py-xs bg-accent"
+                        class="col-12 row flex-center q-px-sm q-py-xs bg-accent no-wrap"
                     >
                         <q-icon
                             name="info_outline"
                             color="white"
                             size="sm"
-                            class="self-end q-mr-sm"
+                            class="col-auto q-mr-sm"
                         />
 
                         <q-item-label
                             caption
-                            class="text-white text-weight-medium"
+                            class="col text-white"
                         >{{ $t('employee_management.module_access.usage_description') }}</q-item-label>
                     </div>
                 </q-slide-transition>
             </div>
 
 
-            <div class="col column q-pa-md">
+            <div class="col column q-pa-md no-wrap">
                 <div class="col">
                     <transition
                         :enter-active-class="'animated ' + transition_in_animation"
diff --git a/src/modules/employee-list/models/employee-profile.models.ts b/src/modules/employee-list/models/employee-profile.models.ts
index 292b64a..134f537 100644
--- a/src/modules/employee-list/models/employee-profile.models.ts
+++ b/src/modules/employee-list/models/employee-profile.models.ts
@@ -13,7 +13,7 @@ export class EmployeeProfile {
     email: string;
     phone_number: string;
     first_work_day: string;
-    last_work_day: string;
+    last_work_day?: string | null;
     external_payroll_id: number;
     residence: string;
     birth_date: string;
@@ -28,7 +28,7 @@ export class EmployeeProfile {
         this.email = '';
         this.phone_number = '';
         this.first_work_day = '';
-        this.last_work_day = '';
+        this.last_work_day = null;
         this.residence = '';
         this.birth_date = '';
         this.external_payroll_id = -1;