feat : modification des exports PDF et affichage du type de contrat sur l'écran des heures

frontend/components/EmployeeYearlyHoursDrawer.vue

@@ -1,5 +1,5 @@
 <template>
-    <AppDrawer v-model="drawerOpen" title="Export heures annuelles">
+    <AppDrawer v-model="drawerOpen" title="Export heures">
         <form class="space-y-4" @submit.prevent="handleSubmit">
             <div>
                 <label class="text-md font-semibold text-neutral-700" for="yearly-hours-year">
@@ -14,6 +14,20 @@
                 </select>
             </div>
 
+            <div>
+                <label class="text-md font-semibold text-neutral-700" for="yearly-hours-month">
+                    Mois
+                </label>
+                <select
+                    id="yearly-hours-month"
+                    v-model="selectedMonth"
+                    :class="selectFieldClass"
+                >
+                    <option value="">Toute l'année</option>
+                    <option v-for="m in months" :key="m.value" :value="m.value">{{ m.label }}</option>
+                </select>
+            </div>
+
             <div class="flex justify-center pt-2">
                 <button
                     type="submit"
@@ -37,7 +51,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
     (event: 'update:modelValue', value: boolean): void
-    (event: 'submit', year: number): void
+    (event: 'submit', payload: { year: number; month: number | null }): void
 }>()
 
 const drawerOpen = computed({
@@ -47,13 +61,31 @@ const drawerOpen = computed({
 
 const currentYear = new Date().getFullYear()
 const years = Array.from({ length: 6 }, (_, i) => currentYear - i)
+const months = [
+    { value: 1, label: 'Janvier' },
+    { value: 2, label: 'Février' },
+    { value: 3, label: 'Mars' },
+    { value: 4, label: 'Avril' },
+    { value: 5, label: 'Mai' },
+    { value: 6, label: 'Juin' },
+    { value: 7, label: 'Juillet' },
+    { value: 8, label: 'Août' },
+    { value: 9, label: 'Septembre' },
+    { value: 10, label: 'Octobre' },
+    { value: 11, label: 'Novembre' },
+    { value: 12, label: 'Décembre' }
+]
 const selectedYear = ref(currentYear)
+const selectedMonth = ref<number | ''>('')
 
 const baseInputClass = 'mt-2 w-full rounded-md border px-3 py-2 text-md text-neutral-900'
 const selectFieldClass = computed(() => `${baseInputClass} border-neutral-300`)
 
 const handleSubmit = () => {
-    emit('submit', selectedYear.value)
+    emit('submit', {
+        year: selectedYear.value,
+        month: selectedMonth.value === '' ? null : selectedMonth.value
+    })
 }
 
 watch(
@@ -61,6 +93,7 @@ watch(
     (isOpen) => {
         if (!isOpen) {
             selectedYear.value = currentYear
+            selectedMonth.value = ''
         }
     }
 )