fix: malio date (#77)

| 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: #77
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

.playground/pages/composant/date/date.vue

@@ -78,11 +78,29 @@
         />
       </div>
     </div>
+
+    <div class="flex flex-wrap items-start gap-10">
+      <div class="w-[396px] space-y-3">
+        <h2 class="font-semibold">markedDates + @month-change</h2>
+        <MalioDate
+          v-model="markedValue"
+          label="Calendrier avec statuts par jour"
+          hint="Jours verts = validés, rouges = à corriger"
+          :marked-dates="markedDates"
+          @month-change="onMonthChange"
+        />
+        <div class="rounded border p-3 text-sm">
+          <p>Mois affiché : <code>{{ shownMonth }}</code></p>
+          <p class="mt-1 text-m-success">● success : {{ successDays.join(', ') }}</p>
+          <p class="text-m-danger">● danger : {{ dangerDays.join(', ') }}</p>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import {ref} from 'vue'
+import {computed, ref} from 'vue'
 
 const pad = (n: number) => String(n).padStart(2, '0')
 const toIso = (d: Date) => `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`
@@ -95,4 +113,20 @@ const value = ref<string | null>(null)
 const erpValue = ref<string | null>(null)
 const bounded = ref<string | null>(null)
 const editableValue = ref<string | null>(null)
+
+// Démo markedDates : quelques jours du mois courant marqués success / danger.
+const ym = `${now.getFullYear()}-${pad(now.getMonth() + 1)}`
+const successDays = [`${ym}-05`, `${ym}-06`, `${ym}-12`]
+const dangerDays = [`${ym}-09`, `${ym}-20`]
+const markedDates = computed<Record<string, 'success' | 'danger'>>(() => ({
+  ...Object.fromEntries(successDays.map(d => [d, 'success' as const])),
+  ...Object.fromEntries(dangerDays.map(d => [d, 'danger' as const])),
+}))
+const markedValue = ref<string | null>(null)
+const monthsLong = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin',
+  'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre']
+const shownMonth = ref('—')
+const onMonthChange = ({month, year}: {month: number, year: number}) => {
+  shownMonth.value = `${monthsLong[month]} ${year} (month=${month})`
+}
 </script>