MALIO-DEV/SIRH
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 67 Wiki Activity

feat : ajout des suspensions et des jours de présence
Some checks failed
Auto Tag Develop / tag (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Autin
2026-03-12 16:46:06 +01:00
parent e6819bc68a
commit 38f09914cb
25 changed files with 2969 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/components/AppDrawer.vue
View File

@@ -17,7 +17,7 @@
✕
</button>
</div>
<div class="p-6">
<div class="overflow-y-auto p-6" style="max-height: calc(100% - 65px)">
<slot />
</div>
</div>

103
frontend/components/employees/ContractTab.vue
View File

@@ -31,7 +31,7 @@
:disabled="isContractSubmitting || !canCloseCurrentContract"
@click="onOpenCloseContractDrawer"
>
Clôturer
Modifier
</button>
<button
type="button"
@@ -43,7 +43,30 @@
</button>
</div>
<AppDrawer :model-value="isContractDrawerOpen" title="Clôturer le contrat" @update:model-value="onUpdateContractDrawerOpen">
<AppDrawer :model-value="isContractDrawerOpen" title="Modifier le contrat" @update:model-value="onUpdateContractDrawerOpen">
<div class="mb-4 flex border-b border-neutral-200">
<button
type="button"
class="pb-2 px-4 border-b-2 font-semibold"
:class="drawerTab === 'close'
? 'border-primary-500 text-primary-500'
: 'border-transparent text-neutral-400 hover:text-neutral-600'"
@click="drawerTab = 'close'"
>
Clôturer
</button>
<button
type="button"
class="pb-2 px-4 border-b-2 font-semibold"
:class="drawerTab === 'suspend'
? 'border-primary-500 text-primary-500'
: 'border-transparent text-neutral-400 hover:text-neutral-600'"
@click="drawerTab = 'suspend'"
>
Suspendre
</button>
</div>
<div v-if="drawerTab === 'close'">
<form class="space-y-4" @submit.prevent="onSubmitCloseContract">
<div>
<label class="text-md font-semibold text-neutral-700" for="contract-nature">
@@ -128,6 +151,62 @@
</button>
</div>
</form>
</div>
<div v-if="drawerTab === 'suspend'" class="space-y-6">
<div
v-for="(form, index) in suspensionForms"
:key="form.id ?? `new-${index}`"
class="space-y-4 rounded-lg border border-neutral-200 p-4"
>
<div>
<label class="text-md font-semibold text-neutral-700">
Date de début <span class="text-red-600">*</span>
</label>
<input
v-model="form.startDate"
type="date"
class="mt-2 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-base text-neutral-900 focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-secondary-500/20"
/>
</div>
<div>
<label class="text-md font-semibold text-neutral-700">
Date de fin
</label>
<input
v-model="form.endDate"
type="date"
class="mt-2 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-base text-neutral-900 focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-secondary-500/20"
/>
</div>
<div>
<label class="text-md font-semibold text-neutral-700">
Commentaire
</label>
<textarea
v-model="form.comment"
rows="3"
class="mt-2 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-base text-neutral-900 focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-secondary-500/20"
/>
</div>
<button
type="button"
class="w-full rounded-md bg-primary-500 px-4 py-2 text-base font-semibold text-white transition hover:bg-secondary-500 disabled:cursor-not-allowed disabled:opacity-60"
:disabled="!form.startDate || isSuspensionSubmitting"
@click="onSubmitSuspension(index)"
>
{{ form.id ? 'Modifier' : 'Ajouter' }}
</button>
</div>
<button
type="button"
class="w-full rounded-md border-2 border-dashed border-neutral-300 px-4 py-3 text-base font-semibold text-neutral-500 transition hover:border-primary-500 hover:text-primary-500"
@click="onAddSuspensionForm"
>
+ Ajouter une suspension
</button>
</div>
</AppDrawer>
<AppDrawer :model-value="isCreateContractDrawerOpen" title="Ajouter un contrat" @update:model-value="onUpdateCreateContractDrawerOpen">
@@ -195,6 +274,13 @@
import type { Contract } from '~/services/dto/contract'
import type { ContractHistoryItem } from '~/services/dto/employee'
type SuspensionForm = {
id: number | null
startDate: string
endDate: string
comment: string
}
type ContractForm = {
contractId: number | ''
contractName: string
@@ -213,7 +299,7 @@ type CreateContractForm = {
endDate: string
}
defineProps<{
const props = defineProps<{
contractHistory: ContractHistoryItem[]
contractNatureLabel: (value?: 'CDI' | 'CDD' | 'INTERIM') => string
contractHistoryLabel: (item: ContractHistoryItem) => string
@@ -245,5 +331,16 @@ defineProps<{
onUpdateCreateContractDrawerOpen: (open: boolean) => void
onSubmitCloseContract: () => void
onSubmitCreateContract: () => void
suspensionForms: SuspensionForm[]
isSuspensionSubmitting: boolean
onSubmitSuspension: (index: number) => void
onAddSuspensionForm: () => void
currentContractPeriodId?: number | null
}>()
const drawerTab = ref<'close' | 'suspend'>('close')
watch(() => props.isContractDrawerOpen, (open) => {
if (open) drawerTab.value = 'close'
})
</script>

8
frontend/components/employees/LeaveTab.vue
View File

@@ -29,7 +29,7 @@
</div>
<div class="mt-8 min-h-0 flex-1 overflow-y-auto pr-2">
<div class="grid grid-cols-4 gap-10">
<div v-for="month in months" :key="month.label" class="rounded-md bg-tertiary-500 text-primary-500">
<div v-for="month in months" :key="month.label" class="rounded-md bg-tertiary-500 text-primary-500 flex flex-col justify-between">
<div class="flex justify-center rounded-t-md bg-primary-500 py-1 font-bold uppercase text-white">
{{ month.label }}
</div>
@@ -54,6 +54,7 @@
</div>
</template>
</div>
<div class="px-2 py-2 text-center border-t border-primary-500">Jours de présence : {{ summary?.presenceDaysByMonth?.[month.monthKey] ?? 0 }}</div>
</div>
</div>
</div>
@@ -259,9 +260,12 @@ const months = computed(() => {
cells.push(null)
}
const monthKey = `${monthYear}-${String(monthIndex + 1).padStart(2, '0')}`
return {
label,
cells
cells,
monthKey
}
})
})

73
frontend/composables/useEmployeeDetailPage.ts
View File

@@ -12,6 +12,7 @@ import { getEmployee, updateEmployee } from '~/services/employees'
import { listPublicHolidays } from '~/services/public-holidays'
import { formatNullableYmdToFr, getTodayYmd, shiftYmd } from '~/utils/date'
import { contractNatureLabel, isContractNature, requiresContractEndDate, showsContractEndDate } from '~/utils/contract'
import { createSuspension, updateSuspension } from '~/services/contractSuspensions'
export const useEmployeeDetailPage = () => {
const route = useRoute()
@@ -29,6 +30,16 @@ export const useEmployeeDetailPage = () => {
const isCreateContractDrawerOpen = ref(false)
const isCreateContractSubmitting = ref(false)
type SuspensionForm = {
id: number | null
startDate: string
endDate: string
comment: string
}
const suspensionForms = ref<SuspensionForm[]>([])
const isSuspensionSubmitting = ref(false)
const contractForm = reactive({
contractId: '' as number | '',
contractName: '',
@@ -83,6 +94,11 @@ export const useEmployeeDetailPage = () => {
return history.find((item) => item.startDate <= today && (!item.endDate || item.endDate >= today)) ?? null
})
const currentActiveContractPeriodId = computed<number | null>(() => {
const period = currentActiveContractPeriod.value
return period?.periodId ?? null
})
const canCloseCurrentContract = computed(() => {
const active = currentActiveContractPeriod.value
if (!active) return false
@@ -130,6 +146,16 @@ export const useEmployeeDetailPage = () => {
validationTouched.endDate = false
}
const hydrateSuspensionForms = () => {
const current = employee.value?.currentSuspensions ?? []
suspensionForms.value = current.map(s => ({
id: s.id,
startDate: s.startDate,
endDate: s.endDate ?? '',
comment: s.comment ?? ''
}))
}
const hydrateContractFormFromCurrent = () => {
const current = employee.value
const active = currentActiveContractPeriod.value
@@ -149,6 +175,7 @@ export const useEmployeeDetailPage = () => {
if (!employee.value || !canCloseCurrentContract.value) return
hydrateContractFormFromCurrent()
resetContractValidation()
hydrateSuspensionForms()
isContractDrawerOpen.value = true
}
@@ -301,6 +328,45 @@ export const useEmployeeDetailPage = () => {
}
}
const submitSuspension = async (index: number) => {
const form = suspensionForms.value[index]
if (!form || !form.startDate) return
const periodId = currentActiveContractPeriodId.value
if (!periodId) return
isSuspensionSubmitting.value = true
try {
if (form.id) {
await updateSuspension(form.id, {
startDate: form.startDate,
endDate: form.endDate || null,
comment: form.comment || null
})
} else {
await createSuspension({
contractPeriodId: periodId,
startDate: form.startDate,
endDate: form.endDate || null,
comment: form.comment || null
})
}
await loadEmployee()
hydrateSuspensionForms()
} finally {
isSuspensionSubmitting.value = false
}
}
const addSuspensionForm = () => {
suspensionForms.value.push({
id: null,
startDate: '',
endDate: '',
comment: ''
})
}
const submitFractionedDays = async (days: number) => {
if (!employee.value) return
const year = leaveSummary.value?.year ?? undefined
@@ -368,6 +434,11 @@ export const useEmployeeDetailPage = () => {
submitContractUpdate,
submitCreateContract,
submitFractionedDays,
submitRttPayment
submitRttPayment,
suspensionForms,
isSuspensionSubmitting,
submitSuspension,
addSuspensionForm,
currentActiveContractPeriodId
}
}

12
frontend/pages/employees/[id].vue
View File

@@ -91,6 +91,11 @@
:on-update-create-contract-drawer-open="setCreateContractDrawerOpen"
:on-submit-close-contract="submitContractUpdate"
:on-submit-create-contract="submitCreateContract"
:suspension-forms="suspensionForms"
:is-suspension-submitting="isSuspensionSubmitting"
:on-submit-suspension="submitSuspension"
:on-add-suspension-form="addSuspensionForm"
:current-contract-period-id="currentActiveContractPeriodId"
/>
<EmployeesLeaveTab
v-else-if="showLeaveTab && activeTab === 'leave'"
@@ -149,7 +154,12 @@ const {
submitContractUpdate,
submitCreateContract,
submitFractionedDays,
submitRttPayment
submitRttPayment,
suspensionForms,
isSuspensionSubmitting,
submitSuspension,
addSuspensionForm,
currentActiveContractPeriodId
} = useEmployeeDetailPage()
useHead(() => ({

38
frontend/services/contractSuspensions.ts Normal file
View File

@@ -0,0 +1,38 @@
import type { ContractSuspension } from './dto/employee'
export const createSuspension = async (payload: {
contractPeriodId: number
startDate: string
endDate?: string | null
comment?: string | null
}) => {
const api = useApi()
return api.post<ContractSuspension>('/contract_suspensions', {
contractPeriodId: payload.contractPeriodId,
startDate: payload.startDate,
endDate: payload.endDate ?? null,
comment: payload.comment ?? null
}, {
toastSuccessKey: 'Suspension créée',
toastErrorKey: 'Erreur lors de la création de la suspension'
})
}
export const updateSuspension = async (
id: number,
payload: {
startDate: string
endDate?: string | null
comment?: string | null
}
) => {
const api = useApi()
return api.patch<ContractSuspension>(`/contract_suspensions/${id}`, {
startDate: payload.startDate,
endDate: payload.endDate ?? null,
comment: payload.comment ?? null
}, {
toastSuccessKey: 'Suspension modifiée',
toastErrorKey: 'Erreur lors de la modification de la suspension'
})
}

1
frontend/services/dto/employee-leave-summary.ts
View File

@@ -10,5 +10,6 @@ export type EmployeeLeaveSummary = {
takenSaturdays: number
fractionedDays: number
accruingDays: number
presenceDaysByMonth: Record<string, number>
}

10
frontend/services/dto/employee.ts
View File

@@ -1,6 +1,13 @@
import type { Site } from './site'
import type { Contract } from './contract'
export type ContractSuspension = {
id: number
startDate: string
endDate?: string | null
comment?: string | null
}
export type ContractHistoryItem = {
contractId?: number | null
contractName?: string | null
@@ -9,6 +16,8 @@ export type ContractHistoryItem = {
startDate: string
endDate?: string | null
comment?: string | null
periodId?: number | null
suspensions?: ContractSuspension[]
}
export type Employee = {
@@ -23,4 +32,5 @@ export type Employee = {
contractHistory?: ContractHistoryItem[]
displayOrder?: number
entryDate?: string | null
currentSuspensions?: ContractSuspension[]
}