feat(employee) : contract phase picker + past-mode banner

This commit is contained in:
2026-05-19 12:05:03 +02:00
parent fd9e551542
commit 9d4a12f6cb

View File

@@ -30,6 +30,24 @@
<p class="text-[18px]">{{ employee.site?.name ?? '-' }}</p> <p class="text-[18px]">{{ employee.site?.name ?? '-' }}</p>
</div> </div>
</div> </div>
<div v-if="showPicker" class="mt-3 flex items-center gap-3">
<label class="text-sm font-bold text-primary-500">Vue contrat</label>
<MalioSelect
:model-value="selectedPhase?.id ?? null"
:options="phaseOptions"
group-class="w-[420px]"
min-width=""
@update:model-value="(v) => { if (v !== null) setSelectedPhase(Number(v)) }"
/>
</div>
<div
v-if="isViewingPastPhase && selectedPhase"
class="mt-3 rounded-md border border-amber-300 bg-amber-100 px-4 py-2 text-sm text-amber-900"
>
Vous consultez l'historique
<strong>{{ formatPhaseLabel(selectedPhase) }}</strong>.
Les paiements de solde sont possibles ; l'édition d'absences et des stocks de report est désactivée.
</div>
<div class="mt-[44px] border-b border-primary-500"> <div class="mt-[44px] border-b border-primary-500">
<div class="flex justify-center gap-16 text-2xl font-bold"> <div class="flex justify-center gap-16 text-2xl font-bold">
<button <button
@@ -253,6 +271,7 @@
import { ref } from 'vue' import { ref } from 'vue'
import EmployeeYearlyHoursDrawer from '~/components/EmployeeYearlyHoursDrawer.vue' import EmployeeYearlyHoursDrawer from '~/components/EmployeeYearlyHoursDrawer.vue'
import { usePdfPrinter } from '~/composables/usePdfPrinter' import { usePdfPrinter } from '~/composables/usePdfPrinter'
import { formatPhaseLabel } from '~/composables/useEmployeeContractPhase'
const { printPdf } = usePdfPrinter() const { printPdf } = usePdfPrinter()
const isYearlyHoursDrawerOpen = ref(false) const isYearlyHoursDrawerOpen = ref(false)
@@ -342,7 +361,12 @@ const {
isObservationLoading, isObservationLoading,
submitCreateObservation, submitCreateObservation,
submitUpdateObservation, submitUpdateObservation,
submitDeleteObservation submitDeleteObservation,
selectedPhase,
showPicker,
phaseOptions,
setSelectedPhase,
isViewingPastPhase,
} = useEmployeeDetailPage() } = useEmployeeDetailPage()
const handleYearlyHoursPrint = async (payload: { year: number; month: number | null }) => { const handleYearlyHoursPrint = async (payload: { year: number; month: number | null }) => {