louis/targo-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(timesheet-approval): prevent display of SSE events unrelated to current pay period viewed

Browse Source
This commit is contained in:
Nic D 2026-03-09 14:01:36 -04:00
parent f8d88de03e
commit 9f15f80be4
2 changed files with 12 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/modules/timesheet-approval/models/pay-period-event.models.ts
View File

@ -2,4 +2,5 @@ export interface PayPeriodEvent {
employee_email: string; employee_email: string;
event_type: 'shift' | 'expense' | 'preset'; event_type: 'shift' | 'expense' | 'preset';
action: 'create' | 'update' | 'delete'; action: 'create' | 'update' | 'delete';
date: string;
} }

24
src/stores/timesheet-store.ts
View File

@ -1,3 +1,5 @@
import { Notify, date } from 'quasar';
import { useI18n } from 'vue-i18n';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { unwrapAndClone } from 'src/utils/unwrap-and-clone'; import { unwrapAndClone } from 'src/utils/unwrap-and-clone';
@ -9,8 +11,6 @@ import type { Timesheet } from 'src/modules/timesheets/models/timesheet.models';
import type { PayPeriodEvent } from 'src/modules/timesheet-approval/models/pay-period-event.models'; import type { PayPeriodEvent } from 'src/modules/timesheet-approval/models/pay-period-event.models';
import type { TimesheetApprovalCSVReportFilters } from 'src/modules/timesheet-approval/models/timesheet-approval-csv-report.models'; import type { TimesheetApprovalCSVReportFilters } from 'src/modules/timesheet-approval/models/timesheet-approval-csv-report.models';
import { type FederalHoliday, TARGO_HOLIDAY_NAMES_FR } from 'src/modules/timesheets/models/federal-holidays.models'; import { type FederalHoliday, TARGO_HOLIDAY_NAMES_FR } from 'src/modules/timesheets/models/federal-holidays.models';
import { Notify } from 'quasar';
import { useI18n } from 'vue-i18n';
export const useTimesheetStore = defineStore('timesheet', () => { export const useTimesheetStore = defineStore('timesheet', () => {
@ -139,13 +139,6 @@ export const useTimesheetStore = defineStore('timesheet', () => {
try { try {
const timesheet_ids = timesheets.value.map(timesheet => timesheet.timesheet_id); const timesheet_ids = timesheets.value.map(timesheet => timesheet.timesheet_id);
// Backend returns the amount of shifts and expenses successfully updated, could be useful for error handling???
// const shift_expense_count = timesheets.value.reduce((timesheets_sum, timesheet) => {
// return timesheets_sum + timesheet.days.reduce((day_sum, day) => {
// return day_sum + day.shifts.length + day.expenses.length
// }, 0);
// }, 0);
const response = await timesheetApprovalService.updateTimesheetsApprovalStatus(email, timesheet_ids, approval_status); const response = await timesheetApprovalService.updateTimesheetsApprovalStatus(email, timesheet_ids, approval_status);
return response.success; return response.success;
} catch (error) { } catch (error) {
@ -185,19 +178,24 @@ export const useTimesheetStore = defineStore('timesheet', () => {
if (pay_period_observer.value === undefined) { if (pay_period_observer.value === undefined) {
pay_period_observer.value = timesheetApprovalService.subscribeToPayPeriodObservable(); pay_period_observer.value = timesheetApprovalService.subscribeToPayPeriodObservable();
pay_period_observer.value.onmessage = async (event: MessageEvent<string>) => { pay_period_observer.value.onmessage = async (event: MessageEvent<string>) => {
// find employee that modified their timesheets
const pay_period_event: PayPeriodEvent = JSON.parse(event.data); const pay_period_event: PayPeriodEvent = JSON.parse(event.data);
// abort notification if event date is not within pay period being currently viewed
const eventDate = date.extractDate(pay_period_event.date, 'YYYY-MM-DD');
const startDate = date.extractDate(pay_period.value!.period_start, 'YYYY-MM-DD');
const endDate = date.extractDate(pay_period.value!.period_end, 'YYYY-MM-DD');
if (!date.isBetweenDates(eventDate, startDate, endDate, { inclusiveFrom: true, inclusiveTo: true, onlyDate: true }))
return;
const overview = pay_period_overviews.value.find(overview => overview.email === pay_period_event.employee_email); const overview = pay_period_overviews.value.find(overview => overview.email === pay_period_event.employee_email);
const employee_name = overview?.employee_first_name + ' ' + overview?.employee_last_name; const employee_name = overview?.employee_first_name + ' ' + overview?.employee_last_name;
// update overviews
await getTimesheetOverviews(); await getTimesheetOverviews();
// if user is looking at details of employee that generated event, update
if (selected_employee_name.value === employee_name) if (selected_employee_name.value === employee_name)
await getTimesheetsByOptionalEmployeeEmail(pay_period_event.employee_email); await getTimesheetsByOptionalEmployeeEmail(pay_period_event.employee_email);
// create visual feedback of notification and update
Notify.create({ Notify.create({
message: `${employee_name} ${t('timesheet_approvals.event.' + pay_period_event.action)} ${t('timesheet_approvals.event.' + pay_period_event.event_type)}`, message: `${employee_name} ${t('timesheet_approvals.event.' + pay_period_event.action)} ${t('timesheet_approvals.event.' + pay_period_event.event_type)}`,
color: 'warning', color: 'warning',