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

fix(timesheet): resolve issue with mobile expenses and timesheet presets.

Browse Source 
fix issue with mobile version of expense dialog where select menu for expense type was refusing to show on screen due to z-index behavior. switch q-select options dialog to menu behavior instead of dialog

fix issue with timesheet presets not applying correctly due to user email being sent as query param on timesheet inadvertedly, which is a route reserved for timesheet approval module
This commit is contained in:
Nic D 2026-01-30 14:38:32 -05:00
parent 119a145549
commit 8998918002
2 changed files with 24 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/modules/timesheets/components/expense-dialog-form.vue
View File

@ -11,7 +11,7 @@
import { useExpensesApi } from 'src/modules/timesheets/composables/use-expense-api';
import { getExpenseIcon, useExpenseRules } from 'src/modules/timesheets/utils/expense.util';
import { Expense, type ExpenseOption, TYPES_WITH_AMOUNT_ONLY } from 'src/modules/timesheets/models/expense.models';
import { useAuthStore } from 'src/stores/auth-store';
import { useAuthStore } from 'src/stores/auth-store';
// ================= state ======================

37
src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
View File

@ -2,19 +2,20 @@
setup
lang="ts"
>
import { computed, ref } from 'vue';
import { computed, ref, onMounted } from 'vue';
import { useI18n } from 'vue-i18n';
import { useUiStore } from 'src/stores/ui-store';
import { useExpensesStore } from 'src/stores/expense-store';
import { useTimesheetStore } from 'src/stores/timesheet-store';
import { useExpensesApi } from 'src/modules/timesheets/composables/use-expense-api';
import { getExpenseIcon, useExpenseRules } from 'src/modules/timesheets/utils/expense.util';
import { type ExpenseOption, TYPES_WITH_AMOUNT_ONLY } from 'src/modules/timesheets/models/expense.models';
import { useAuthStore } from 'src/stores/auth-store';
import { Expense, type ExpenseOption, TYPES_WITH_AMOUNT_ONLY } from 'src/modules/timesheets/models/expense.models';
import { useAuthStore } from 'src/stores/auth-store';
const COMMENT_MAX_LENGTH = 280;
const file = defineModel<File | undefined>();
const expense = defineModel<Expense>({ default: new Expense(new Date().toISOString().slice(0, 10)) })
const file = defineModel<File | undefined>('file');
const { employeeEmail } = defineProps<{
employeeEmail?: string;
@ -53,6 +54,13 @@ import { useAuthStore } from 'src/stores/auth-store';
if (file.value)
await expenses_api.upsertExpense(expenses_store.current_expense, file.value, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL');
};
onMounted(() => {
if (expense.value)
expense_selected.value = expense_options.find(expense_option => expense_option.value === expense.value.type);
else
expense_selected.value = expense_options[1];
})
</script>
<template>
@ -66,9 +74,8 @@ import { useAuthStore } from 'src/stores/auth-store';
class="col column items-start rounded-5 q-pb-sm"
:class="expenses_store.is_showing_create_form ? 'q-px-md' : 'q-px-sm'"
>
<!-- date and type row -->
<div class="col row q-my-xs full-width">
<!-- date selection input -->
<!-- date selection input -->
<div class="col-auto row q-my-xs full-width">
<q-input
v-model="expenses_store.current_expense.date"
dense
@ -77,7 +84,7 @@ import { useAuthStore } from 'src/stores/auth-store';
stack-label
hide-bottom-space
color="primary"
class="col-auto q-mr-sm"
class="col-auto full-width"
input-class="text-weight-medium"
input-style="font-size: 1em;"
:label="$t('timesheet.expense.date')"
@ -114,8 +121,10 @@ import { useAuthStore } from 'src/stores/auth-store';
</span>
</template>
</q-input>
</div>
<!-- expenses type selection -->
<!-- expenses type selection -->
<div class="col-auto row q-my-xs full-width">
<q-select
v-model="expense_selected"
standout="bg-blue-grey-9 text-white"
@ -127,12 +136,12 @@ import { useAuthStore } from 'src/stores/auth-store';
hide-bottom-space
class="col"
color="primary"
behavior="menu"
:menu-offset="[0, 5]"
:label="$t('timesheet.expense.type')"
:menu-offset="[0, 10]"
menu-anchor="bottom middle"
menu-self="top middle"
popup-content-class="text-uppercase text-weight-bold text-center rounded-5"
popup-content-style="border: 2px solid var(--q-accent)"
popup-content-class="text-uppercase text-weight-bold text-center rounded-5 z-top"
popup-content-style="border: 3px solid var(--q-accent)"
options-selected-class="text-weight-bolder text-white bg-accent"
:rules="[rules.typeRequired]"
@update:model-value="option => expenses_store.current_expense.type = option.value"
>