Merge pull request 'fix(approvals): add preset to possible changes that can be applied to employee timesheet from approval page' (#72) from dev/nicolas/staging-prep into main

Reviewed-on: Targo/targo_frontend#72

src/modules/timesheets/components/shift-list-day.vue

@@ -15,7 +15,7 @@
 
     // ================== State ==================
 
-    const { day, dense = false, approved = false, holiday = false } = defineProps<{
+    const { timesheetId, weekDayIndex, day, dense = false, approved = false, holiday = false } = defineProps<{
         timesheetId: number;
         weekDayIndex: number;
         day: TimesheetDay;
@@ -59,6 +59,10 @@
         else
             shift_error_message.value = undefined;
     }
+
+    const onClickApplyDailyPreset = async () => {
+        await timesheet_api.applyPreset(timesheetId, weekDayIndex, day.date, employeeEmail);
+    }
 </script>
 
 <template>
@@ -83,7 +87,7 @@
                 :label="$t('timesheet.apply_preset_day')"
                 class="text-uppercase text-weight-bold text-accent q-mx-lg q-py-none rounded-5"
                 style="opacity: 0.6;"
-                @click.stop="timesheet_api.applyPreset(timesheetId, weekDayIndex, day.date)"
+                @click.stop="onClickApplyDailyPreset"
             >
                 <q-icon
                     name="las la-calendar-day"

src/modules/timesheets/components/shift-list.vue

@@ -6,7 +6,7 @@
     import ShiftListDateWidget from 'src/modules/timesheets/components/shift-list-date-widget.vue';
 
     import { date, useQuasar } from 'quasar';
-    import { ref, computed, watch, onMounted } from 'vue';
+    import { ref, computed, watch, onMounted, inject } from 'vue';
     import { useUiStore } from 'src/stores/ui-store';
     import { useTimesheetStore } from 'src/stores/timesheet-store';
     import { Shift } from 'src/modules/timesheets/models/shift.models';
@@ -31,6 +31,7 @@
     const mobile_animation_direction = ref('fadeInLeft');
     const currentDayComponent = ref<HTMLElement[] | null>(null);
     const currentDayComponentWatcher = ref(currentDayComponent);
+    const employeeEmail = inject<string>('employeeEmail');
 
     const animation_style = computed(() => ui_store.is_mobile_mode ? mobile_animation_direction.value : 'fadeInDown');
 
@@ -70,6 +71,10 @@
             return holiday.nameEn;
     };
 
+    const onClickApplyWeeklyPreset = async (timesheet_id: number) => {
+        await timesheet_api.applyPreset(timesheet_id, undefined, undefined, employeeEmail);
+    }
+
     onMounted(async () => {
         await timesheet_store.getCurrentFederalHolidays();
     });
@@ -103,7 +108,7 @@
                     dense
                     :label="$t('timesheet.apply_preset_week')"
                     class="col-auto text-uppercase text-weight-bold text-accent q-mx-lg q-py-none rounded-5"
-                    @click="timesheet_api.applyPreset(timesheet.timesheet_id)"
+                    @click="onClickApplyWeeklyPreset(timesheet.timesheet_id)"
                 >
                     <q-icon
                         name="las la-calendar-week"

src/modules/timesheets/composables/use-timesheet-api.ts

@@ -31,19 +31,19 @@ export const useTimesheetApi = () => {
         timesheet_store.is_loading = false;
     };
 
-    const applyPreset = async (timesheet_id: number, week_day_index?: number, date?: string) => {
+    const applyPreset = async (timesheet_id: number, week_day_index?: number, date?: string, employeeEmail?: string) => {
         if (timesheet_store.timesheets.map(timesheet => timesheet.timesheet_id).includes(timesheet_id)) {
             timesheet_store.is_loading = true;
             try {
                 let response;
 
                 if (week_day_index && date)
-                    response = await timesheetService.applyPresetToDay(timesheet_id, week_day_index, date);
+                    response = await timesheetService.applyPresetToDay(timesheet_id, week_day_index, date, employeeEmail);
                 else
-                    response = await timesheetService.applyPresetToWeek(timesheet_id);
+                    response = await timesheetService.applyPresetToWeek(timesheet_id, employeeEmail);
 
                 if (response.success) 
-                    await timesheet_store.getTimesheetsByOptionalEmployeeEmail();
+                    await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
             } catch (error) {
                 console.error('Error applying weekly timesheet: ', error);
             }

src/modules/timesheets/services/timesheet-service.ts

@@ -36,12 +36,22 @@ export const timesheetService = {
         }
     },
 
-    applyPresetToWeek: async (timesheet_id: number): Promise<BackendResponse<boolean>> => {
+    applyPresetToWeek: async (timesheet_id: number, employeeEmail?: string): Promise<BackendResponse<boolean>> => {
-        const response = await api.post<BackendResponse<boolean>>(`schedule-presets/apply-preset`, { timesheet_id });
+        if (employeeEmail) {
+            const response = await api.post<BackendResponse<boolean>>(`schedule-presets/apply-preset/${employeeEmail}`, { timesheet_id });
+            return response.data;
+        }
+
+        const response = await api.post<BackendResponse<boolean>>('schedule-presets/apply-preset', { timesheet_id });
         return response.data;
     },
 
-    applyPresetToDay: async (timesheet_id: number, week_day_index: number, date: string): Promise<BackendResponse<boolean>> => {
+    applyPresetToDay: async (timesheet_id: number, week_day_index: number, date: string, employeeEmail?: string): Promise<BackendResponse<boolean>> => {
+        if (employeeEmail) {
+            const response = await api.post<BackendResponse<boolean>>(`schedule-presets/apply-day-preset/${employeeEmail}`, { timesheet_id, week_day_index, date });
+            return response.data;
+        }
+
         const response = await api.post<BackendResponse<boolean>>('schedule-presets/apply-day-preset', { timesheet_id, week_day_index, date });
         return response.data;
     }