feat(time-tracking) : add list view for time entries
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -20,13 +20,13 @@
|
||||
<Icon name="mdi:chevron-left" size="20" />
|
||||
</button>
|
||||
<button
|
||||
v-for="mode in (['week', 'day'] as const)"
|
||||
v-for="mode in (['week', 'day', 'list'] as const)"
|
||||
:key="mode"
|
||||
class="px-3 py-1 text-sm font-semibold transition"
|
||||
:class="viewMode === mode ? 'bg-primary-500 text-white rounded' : 'text-neutral-500 hover:text-neutral-700'"
|
||||
@click="viewMode = mode"
|
||||
>
|
||||
{{ mode === 'week' ? 'Semaine' : 'Jour' }}
|
||||
{{ mode === 'week' ? 'Semaine' : mode === 'day' ? 'Jour' : 'Liste' }}
|
||||
</button>
|
||||
<button class="px-2 py-1 text-neutral-500 hover:text-neutral-700" @click="navigateNext">
|
||||
<Icon name="mdi:chevron-right" size="20" />
|
||||
@@ -59,7 +59,14 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
<TimeEntryList
|
||||
v-if="viewMode === 'list'"
|
||||
:entries="filteredEntries"
|
||||
@edit-entry="openEditDrawer"
|
||||
@delete-entry="onDelete"
|
||||
/>
|
||||
<TimeTrackingCalendar
|
||||
v-else
|
||||
:entries="filteredEntries"
|
||||
:start-date="startDate"
|
||||
:view-mode="viewMode"
|
||||
@@ -108,7 +115,7 @@ useHead({ title: 'Suivi des temps' })
|
||||
const authStore = useAuthStore()
|
||||
const timeEntryService = useTimeEntryService()
|
||||
|
||||
const viewMode = ref<'week' | 'day'>('week')
|
||||
const viewMode = ref<'week' | 'day' | 'list'>('week')
|
||||
const startDate = ref(getMonday(new Date()))
|
||||
const selectedUserId = ref<number | null>(authStore.user?.id ?? null)
|
||||
const selectedTypeId = ref<number | null>(null)
|
||||
@@ -160,15 +167,15 @@ function getMonday(d: Date): Date {
|
||||
|
||||
function navigatePrev() {
|
||||
const d = new Date(startDate.value)
|
||||
d.setDate(d.getDate() - (viewMode.value === 'week' ? 7 : 1))
|
||||
startDate.value = viewMode.value === 'week' ? getMonday(d) : d
|
||||
d.setDate(d.getDate() - (viewMode.value === 'day' ? 1 : 7))
|
||||
startDate.value = viewMode.value === 'day' ? d : getMonday(d)
|
||||
loadEntries()
|
||||
}
|
||||
|
||||
function navigateNext() {
|
||||
const d = new Date(startDate.value)
|
||||
d.setDate(d.getDate() + (viewMode.value === 'week' ? 7 : 1))
|
||||
startDate.value = viewMode.value === 'week' ? getMonday(d) : d
|
||||
d.setDate(d.getDate() + (viewMode.value === 'day' ? 1 : 7))
|
||||
startDate.value = viewMode.value === 'day' ? d : getMonday(d)
|
||||
loadEntries()
|
||||
}
|
||||
|
||||
@@ -245,7 +252,7 @@ async function onDelete(entry: TimeEntry) {
|
||||
|
||||
async function loadEntries() {
|
||||
const end = new Date(startDate.value)
|
||||
end.setDate(end.getDate() + (viewMode.value === 'week' ? 7 : 1))
|
||||
end.setDate(end.getDate() + (viewMode.value === 'day' ? 1 : 7))
|
||||
|
||||
entries.value = await timeEntryService.getByDateRange({
|
||||
after: startDate.value.toISOString(),
|
||||
@@ -274,7 +281,7 @@ onMounted(async () => {
|
||||
})
|
||||
|
||||
watch(viewMode, () => {
|
||||
startDate.value = viewMode.value === 'week' ? getMonday(startDate.value) : startDate.value
|
||||
startDate.value = viewMode.value === 'day' ? startDate.value : getMonday(startDate.value)
|
||||
loadEntries()
|
||||
})
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user