54 lines
1.8 KiB
Vue
54 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
import { date } from 'quasar';
|
|
import { useTimesheetStore } from 'src/stores/timesheet-store';
|
|
import { computed } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
|
|
const {locale} = useI18n();
|
|
const timeSheet_store = useTimesheetStore();
|
|
const date_options: Intl.DateTimeFormatOptions = {
|
|
day: 'numeric',
|
|
month: 'long',
|
|
year: 'numeric',
|
|
};
|
|
|
|
const timesheet_label = computed(() => {
|
|
const dates = timeSheet_store.current_timesheet.label.split('.');
|
|
const start_date = new Intl.DateTimeFormat(locale.value, date_options).format(date.extractDate(dates[0] as string, 'YYYY-MM-DD'));
|
|
const end_date = new Intl.DateTimeFormat(locale.value, date_options).format(date.extractDate(dates[1] as string, 'YYYY-MM-DD'));
|
|
|
|
if ( dates.length === 1) {
|
|
return {
|
|
start_date: '_',
|
|
end_date: '_',
|
|
}
|
|
}
|
|
return { start_date, end_date };
|
|
});
|
|
</script>
|
|
|
|
|
|
<template>
|
|
<q-page
|
|
padding
|
|
class="q-pa-md bg secondary"
|
|
>
|
|
<div class="text-h4 row justify-center q-mt-lg text-uppercase text-weight-bolder text-gray-8">
|
|
{{ $t('pageTitles.timeSheets') }}
|
|
</div>
|
|
<div class="row items-center justify-center q-py-none q-my-none">
|
|
<div class="text-primary text-h6 text-uppercase">
|
|
{{ timesheet_label.start_date }}
|
|
</div>
|
|
<div class="text-primary text-h6 text-uppercase">
|
|
{{ $t('timeSheet.dateRangesTo') }}
|
|
</div>
|
|
<div class="text-primary text-h6 text-uppercase">
|
|
{{ timesheet_label.end_date }}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- insert here TimesheetTemp -->
|
|
</q-page>
|
|
</template> |