Files
SIRH/frontend/components/hours/HoursDayExportDrawer.vue
T
tristan 74abecbe03
Auto Tag Develop / tag (push) Successful in 10s
feat(heures) : calendrier des jours validés (vue Jour) + harmonisation Malio UI (#30)
## Fonctionnel
- Calendrier MalioDate en vue Jour (écrans Heures ET Heures Conducteurs) : les jours entièrement validés par un admin sont peints en vert.
  - Endpoint `GET /work-hours/validation-status?from=&to=[&driver=1]` (scope conducteur inversé via `driver=1`), périmètre complet (ignore le filtre sites).
  - Chargement à la volée par mois (event `@month-change`), refresh après validation / saisie / absence.

## Harmonisation @malio/layer-ui 1.7.11
- `reserveMessageSpace=false` sur tous les champs (alignement).
- Tous les drawers migrés sur `MalioDrawer` (titre via slot `#header`, `AppDrawer` custom supprimé).
- Boutons d'action en `MalioButton` ; deux boutons côte à côte partagent l'espace.
- Inputs date en `MalioDate`, sélecteur semaine en `MalioDateWeek`.
- Boutons d'ajout uniformisés sur « Ajouter » + icône.

## Divers
- `.env` : `EXCLUDED_PUBLIC_HOLIDAYS="null"`.
- Doc : `doc/hours-validated-days.md`, `documentation-content.ts`, `CLAUDE.md`.
- Tests : provider `WorkHourValidationStatus` (suite complète 236/236 OK via pre-commit hook).

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Reviewed-on: #30
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>
2026-06-16 13:53:03 +00:00

82 lines
2.3 KiB
Vue

<template>
<MalioDrawer v-model="drawerOpen">
<template #header>
<h2 class="text-[32px] font-semibold text-primary-500">Export des heures</h2>
</template>
<form class="space-y-4" @submit.prevent="handleSubmit">
<MalioDate
v-model="selectedDate"
label="Date"
required
:clearable="false"
:reserve-message-space="false"
group-class="w-full"
/>
<MalioSelectCheckbox
v-model="selectedSites"
:options="siteOptions"
label="Sites"
required
:reserve-message-space="false"
groupClass="w-full"
display-select-all
display-tag
/>
<div class="flex justify-center pt-2">
<MalioButton
:label="isLoading ? 'Génération en cours...' : 'Exporter'"
button-class="w-[200px]"
:disabled="isLoading || !selectedDate || selectedSites.length === 0"
@click="handleSubmit"
/>
</div>
</form>
</MalioDrawer>
</template>
<script setup lang="ts">
import { computed, ref, watch } from 'vue'
import type { Site } from '~/services/dto/site'
const props = defineProps<{
modelValue: boolean
sites: Site[]
initialDate: string
isLoading?: boolean
}>()
const emit = defineEmits<{
(event: 'update:modelValue', value: boolean): void
(event: 'submit', payload: { date: string; siteIds: number[] }): void
}>()
const drawerOpen = computed({
get: () => props.modelValue,
set: (value: boolean) => emit('update:modelValue', value)
})
const selectedDate = ref(props.initialDate)
const selectedSites = ref<number[]>([])
const siteOptions = computed(() =>
props.sites.map((site) => ({ label: site.name, value: site.id }))
)
const handleSubmit = () => {
if (!selectedDate.value || selectedSites.value.length === 0) return
emit('submit', { date: selectedDate.value, siteIds: [...selectedSites.value] })
}
watch(
() => props.modelValue,
(isOpen) => {
if (isOpen) {
selectedDate.value = props.initialDate
selectedSites.value = []
}
}
)
</script>