fix: date year picker (#84)

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|                  |                 |

## Description de la PR

## Modification du .env

## Check list

- [ ] Pas de régression
- [ ] TU/TI/TF rédigée
- [ ] TU/TI/TF OK
- [ ] CHANGELOG modifié

---------

Co-authored-by: admin malio <malio@yuno.malio.fr>
Co-authored-by: THOLOT DECHENE Matthieu <matthieu@yuno.malio.fr>
Co-authored-by: matthieu <matthieu@yuno.malio.fr>
Reviewed-on: #84
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

app/components/malio/date/composables/useCalendarView.ts

@@ -1,12 +1,23 @@
-import {ref, type Ref} from 'vue'
+import {ref, watch, type Ref} from 'vue'
 import {isValidIso} from './dateFormat'
 
-export function useCalendarView(viewMode: Ref<'days' | 'months'>) {
+export function useCalendarView(viewMode: Ref<'days' | 'months' | 'years'>) {
   const today = new Date()
   const currentMonth = ref(today.getMonth())
   const currentYear = ref(today.getFullYear())
+  // Fenêtre de 12 ans calée pour que l'année courante tombe en 2e ligne / 2e
+  // colonne d'une grille 3 colonnes (index 4) → début = année courante − 4.
+  const yearPageStart = ref(today.getFullYear() - 4)
+
+  watch(viewMode, (mode) => {
+    if (mode === 'years') yearPageStart.value = currentYear.value - 4
+  })
 
   const goToPrev = () => {
+    if (viewMode.value === 'years') {
+      yearPageStart.value -= 12
+      return
+    }
     if (viewMode.value === 'months') {
       currentYear.value -= 1
       return
@@ -20,6 +31,10 @@ export function useCalendarView(viewMode: Ref<'days' | 'months'>) {
   }
 
   const goToNext = () => {
+    if (viewMode.value === 'years') {
+      yearPageStart.value += 12
+      return
+    }
     if (viewMode.value === 'months') {
       currentYear.value += 1
       return
@@ -36,6 +51,10 @@ export function useCalendarView(viewMode: Ref<'days' | 'months'>) {
     currentMonth.value = m
   }
 
+  const selectYear = (y: number) => {
+    currentYear.value = y
+  }
+
   const syncToIso = (iso: string | null) => {
     if (iso && isValidIso(iso)) {
       currentMonth.value = Number(iso.slice(5, 7)) - 1
@@ -47,5 +66,5 @@ export function useCalendarView(viewMode: Ref<'days' | 'months'>) {
     }
   }
 
-  return {currentMonth, currentYear, goToPrev, goToNext, selectMonth, syncToIso}
+  return {currentMonth, currentYear, yearPageStart, goToPrev, goToNext, selectMonth, selectYear, syncToIso}
 }