feat : en-tête « Mois Année » constant + année courante centrée (2e ligne/2e col) + cycle de vues

- l'en-tête affiche toujours « Mois Année » avec chevron bas dans les 3 vues
- le clic sur l'en-tête cycle jours -> mois -> années -> jours (goToHigherView -> cycleView)
- la grille d'années cale l'année courante en index 4 (yearPageStart = courante - 4)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-22 11:28:20 +02:00
parent 0ec63e774d
commit b07e001006
8 changed files with 46 additions and 28 deletions
@@ -12,10 +12,11 @@ export function useCalendarPopover(rootRef: Ref<HTMLElement | null>) {
isOpen.value = false
viewMode.value = 'days'
}
const goToHigherView = () => {
// Le clic sur l'en-tête fait un cycle : jours → mois → années → jours.
const cycleView = () => {
if (viewMode.value === 'days') viewMode.value = 'months'
else if (viewMode.value === 'months') viewMode.value = 'years'
// 'years' : niveau le plus haut, no-op
else viewMode.value = 'days'
}
const onMouseDown = (event: MouseEvent) => {
@@ -26,5 +27,5 @@ export function useCalendarPopover(rootRef: Ref<HTMLElement | null>) {
onMounted(() => document.addEventListener('mousedown', onMouseDown))
onBeforeUnmount(() => document.removeEventListener('mousedown', onMouseDown))
return {isOpen, viewMode, open, close, goToHigherView}
return {isOpen, viewMode, open, close, cycleView}
}