feat: complete Epic 0 — foundation migration & infrastructure setup
Stories 0.2-0.5: rename folders→declarations (backend+frontend), configure Redis for cache/queue/sessions, add foundation database migrations (permissions, archived_at), replace DeclarationStatus enum with architecture lifecycle values, create DeclarationObserver for status transition validation and auto-archive, fix controller status transitions to respect observer rules. 93 tests pass (240 assertions). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
142
resources/js/components/clients/DeclarationCalendar.vue
Normal file
142
resources/js/components/clients/DeclarationCalendar.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<script setup lang="ts">
|
||||
import { ChevronLeft, ChevronRight } from 'lucide-vue-next';
|
||||
import { computed, ref } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
|
||||
type Declaration = {
|
||||
id: number;
|
||||
due_date: string | null;
|
||||
};
|
||||
|
||||
type Props = {
|
||||
declarations: Declaration[];
|
||||
};
|
||||
|
||||
const props = defineProps<Props>();
|
||||
|
||||
const monthNames = [
|
||||
'Janvier',
|
||||
'Février',
|
||||
'Mars',
|
||||
'Avril',
|
||||
'Mai',
|
||||
'Juin',
|
||||
'Juillet',
|
||||
'Août',
|
||||
'Septembre',
|
||||
'Octobre',
|
||||
'Novembre',
|
||||
'Décembre',
|
||||
];
|
||||
const dayNames = ['Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam', 'Dim'];
|
||||
|
||||
const current = ref(new Date());
|
||||
|
||||
const monthLabel = computed(
|
||||
() =>
|
||||
`${monthNames[current.value.getMonth()]} ${current.value.getFullYear()}`,
|
||||
);
|
||||
|
||||
const datesWithDeclarations = computed(() => {
|
||||
const set = new Set<string>();
|
||||
props.declarations.forEach((f) => {
|
||||
if (f.due_date) set.add(f.due_date);
|
||||
});
|
||||
return set;
|
||||
});
|
||||
|
||||
const declarationsByDate = computed(() => {
|
||||
const map = new Map<string, number>();
|
||||
props.declarations.forEach((f) => {
|
||||
if (f.due_date) {
|
||||
map.set(f.due_date, (map.get(f.due_date) ?? 0) + 1);
|
||||
}
|
||||
});
|
||||
return map;
|
||||
});
|
||||
|
||||
const calendarDays = computed(() => {
|
||||
const year = current.value.getFullYear();
|
||||
const month = current.value.getMonth();
|
||||
const first = new Date(year, month, 1);
|
||||
const last = new Date(year, month + 1, 0);
|
||||
const startDay = (first.getDay() + 6) % 7;
|
||||
const daysInMonth = last.getDate();
|
||||
|
||||
const days: Array<{
|
||||
date: Date | null;
|
||||
dateStr: string | null;
|
||||
count: number;
|
||||
}> = [];
|
||||
|
||||
for (let i = 0; i < startDay; i++) {
|
||||
days.push({ date: null, dateStr: null, count: 0 });
|
||||
}
|
||||
for (let d = 1; d <= daysInMonth; d++) {
|
||||
const date = new Date(year, month, d);
|
||||
const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(d).padStart(2, '0')}`;
|
||||
days.push({
|
||||
date,
|
||||
dateStr,
|
||||
count: declarationsByDate.value.get(dateStr) ?? 0,
|
||||
});
|
||||
}
|
||||
return days;
|
||||
});
|
||||
|
||||
function prevMonth() {
|
||||
current.value = new Date(
|
||||
current.value.getFullYear(),
|
||||
current.value.getMonth() - 1,
|
||||
);
|
||||
}
|
||||
|
||||
function nextMonth() {
|
||||
current.value = new Date(
|
||||
current.value.getFullYear(),
|
||||
current.value.getMonth() + 1,
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="rounded-xl border border-sidebar-border/70 bg-card p-4">
|
||||
<div class="mb-4 flex items-center justify-between">
|
||||
<Button variant="ghost" size="icon" @click="prevMonth">
|
||||
<ChevronLeft class="size-4" />
|
||||
</Button>
|
||||
<span class="text-sm font-medium">{{ monthLabel }}</span>
|
||||
<Button variant="ghost" size="icon" @click="nextMonth">
|
||||
<ChevronRight class="size-4" />
|
||||
</Button>
|
||||
</div>
|
||||
<div class="grid grid-cols-7 gap-1 text-center text-xs">
|
||||
<div
|
||||
v-for="day in dayNames"
|
||||
:key="day"
|
||||
class="py-1 font-medium text-muted-foreground"
|
||||
>
|
||||
{{ day }}
|
||||
</div>
|
||||
<div
|
||||
v-for="(cell, i) in calendarDays"
|
||||
:key="i"
|
||||
class="flex min-h-8 flex-col items-center justify-center rounded-md py-1"
|
||||
:class="[
|
||||
!cell.date
|
||||
? 'invisible'
|
||||
: cell.count > 0
|
||||
? 'bg-primary/15 font-medium'
|
||||
: 'text-muted-foreground hover:bg-muted/50',
|
||||
]"
|
||||
>
|
||||
<template v-if="cell.date">
|
||||
{{ cell.date.getDate() }}
|
||||
<span v-if="cell.count > 0" class="mt-0.5 text-[10px]">
|
||||
{{ cell.count }} décl.
|
||||
</span>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user