diff --git a/resources/js/Pages/Reporting.vue b/resources/js/Pages/Reporting.vue index 0a0ed7d1..cda54941 100644 --- a/resources/js/Pages/Reporting.vue +++ b/resources/js/Pages/Reporting.vue @@ -37,10 +37,12 @@ import { useTagsStore } from '@/utils/useTags'; import { formatCents } from '@/packages/ui/src/utils/money'; import { useStorage } from '@vueuse/core'; -const startDate = ref( +const startDate = useStorage( + 'reporting-start-date', getLocalizedDayJs(getDayJsInstance()().format()).subtract(14, 'd').format() ); -const endDate = ref( +const endDate = useStorage( + 'reporting-end-date', getLocalizedDayJs(getDayJsInstance()().format()).format() ); const selectedTags = ref([]); diff --git a/resources/js/packages/ui/src/Input/DateRangePicker.vue b/resources/js/packages/ui/src/Input/DateRangePicker.vue index 6f7a6429..dc2e2848 100644 --- a/resources/js/packages/ui/src/Input/DateRangePicker.vue +++ b/resources/js/packages/ui/src/Input/DateRangePicker.vue @@ -2,14 +2,92 @@ import { CalendarIcon } from '@heroicons/vue/20/solid'; import Dropdown from '@/packages/ui/src/Input/Dropdown.vue'; import DatePicker from '@/packages/ui/src/Input/DatePicker.vue'; -import { formatDate } from '@/packages/ui/src/utils/time'; +import { formatDate, getDayJsInstance } from '@/packages/ui/src/utils/time'; +import { ref } from 'vue'; const start = defineModel('start', { default: '' }); const end = defineModel('end', { default: '' }); + +const emit = defineEmits(['submit']); + +const open = ref(false); + +function setThisWeek() { + start.value = getDayJsInstance()().startOf('week').format(); + end.value = getDayJsInstance()().endOf('week').format(); + emit('submit'); + open.value = false; +} +function setLastWeek() { + start.value = getDayJsInstance()() + .subtract(1, 'week') + .startOf('week') + .format(); + end.value = getDayJsInstance()().subtract(1, 'week').endOf('week').format(); + emit('submit'); + open.value = false; +} +function setLast14Days() { + start.value = getDayJsInstance()().subtract(14, 'days').format(); + end.value = getDayJsInstance()().format(); + emit('submit'); + open.value = false; +} +function setThisMonth() { + start.value = getDayJsInstance()().startOf('month').format(); + end.value = getDayJsInstance()().endOf('month').format(); + emit('submit'); + open.value = false; +} +function setLastMonth() { + start.value = getDayJsInstance()() + .subtract(1, 'month') + .startOf('month') + .format(); + end.value = getDayJsInstance()() + .subtract(1, 'month') + .endOf('month') + .format(); + emit('submit'); + open.value = false; +} +function setLast30Days() { + start.value = getDayJsInstance()().subtract(30, 'days').format(); + end.value = getDayJsInstance()().format(); + emit('submit'); + open.value = false; +} +function setLast90Days() { + start.value = getDayJsInstance()().subtract(90, 'days').format(); + end.value = getDayJsInstance()().format(); + emit('submit'); + open.value = false; +} +function setLast12Months() { + start.value = getDayJsInstance()().subtract(12, 'months').format(); + end.value = getDayJsInstance()().format(); + emit('submit'); + open.value = false; +} +function setThisYear() { + start.value = getDayJsInstance()().startOf('year').format(); + end.value = getDayJsInstance()().endOf('year').format(); + emit('submit'); + open.value = false; +} +function setLastYear() { + start.value = getDayJsInstance()() + .subtract(1, 'year') + .startOf('year') + .format(); + end.value = getDayJsInstance()().subtract(1, 'year').endOf('year').format(); + emit('submit'); + open.value = false; +}