feat : Ajout d'un onglet Observation sur la page employé + fonctionnalité de verrouillage utilisateur

frontend/composables/useEmployeeDetailPage.ts

@@ -6,7 +6,7 @@ export const useEmployeeDetailPage = () => {
   const route = useRoute()
   const employee = ref<Employee | null>(null)
   const isLoading = ref(false)
-  const activeTab = ref<'contract' | 'leave' | 'rtt' | 'mileage' | 'bonus'>('contract')
+  const activeTab = ref<'contract' | 'leave' | 'rtt' | 'mileage' | 'bonus' | 'observation'>('contract')
 
   const showLeaveTab = computed(() => employee.value?.currentContractNature !== 'INTERIM')
   const showRttTab = computed(() => employee.value?.contract?.type !== CONTRACT_TYPES.FORFAIT)
@@ -40,6 +40,7 @@ export const useEmployeeDetailPage = () => {
       rtt.resetLoaded()
       mileage.resetLoaded()
       bonus.resetLoaded()
+      observation.resetLoaded()
 
       if (activeTab.value === 'leave' && showLeaveTab.value) {
         await leave.loadLeaveData()
@@ -49,6 +50,8 @@ export const useEmployeeDetailPage = () => {
         await mileage.loadMileageData()
       } else if (activeTab.value === 'bonus') {
         await bonus.loadBonusData()
+      } else if (activeTab.value === 'observation') {
+        await observation.loadObservationData()
       }
     } finally {
       isLoading.value = false
@@ -60,6 +63,7 @@ export const useEmployeeDetailPage = () => {
   const rtt = useEmployeeRtt(employee, loadEmployee)
   const mileage = useEmployeeMileage(employee, loadEmployee)
   const bonus = useEmployeeBonus(employee, loadEmployee)
+  const observation = useEmployeeObservation(employee, loadEmployee)
 
   watch(activeTab, (tab) => {
     if (tab === 'leave' && !leave.leaveDataLoaded.value && showLeaveTab.value) {
@@ -70,6 +74,8 @@ export const useEmployeeDetailPage = () => {
       mileage.loadMileageData()
     } else if (tab === 'bonus' && !bonus.bonusDataLoaded.value) {
       bonus.loadBonusData()
+    } else if (tab === 'observation' && !observation.observationDataLoaded.value) {
+      observation.loadObservationData()
     }
   })
 
@@ -89,6 +95,7 @@ export const useEmployeeDetailPage = () => {
     ...leave,
     ...rtt,
     ...mileage,
-    ...bonus
+    ...bonus,
+    ...observation
   }
 }

frontend/composables/useEmployeeObservation.ts

@@ -0,0 +1,61 @@
+import type { Ref } from 'vue'
+import type { Observation } from '~/services/dto/observation'
+import type { Employee } from '~/services/dto/employee'
+import {
+  listObservations,
+  createObservation,
+  updateObservation,
+  deleteObservation
+} from '~/services/observations'
+
+export const useEmployeeObservation = (employee: Ref<Employee | null>, reloadEmployee: () => Promise<void>) => {
+  const observations = ref<Observation[]>([])
+  const isObservationLoading = ref(false)
+  const observationDataLoaded = ref(false)
+
+  const loadObservationData = async () => {
+    if (!employee.value || isObservationLoading.value) return
+    isObservationLoading.value = true
+    try {
+      observations.value = await listObservations(employee.value.id)
+      observationDataLoaded.value = true
+    } finally {
+      isObservationLoading.value = false
+    }
+  }
+
+  const resetLoaded = () => {
+    observationDataLoaded.value = false
+  }
+
+  const submitCreateObservation = async (data: { month: string; content: string }) => {
+    if (!employee.value) return
+    await createObservation({
+      employeeId: employee.value.id,
+      month: data.month,
+      content: data.content
+    })
+    await reloadEmployee()
+  }
+
+  const submitUpdateObservation = async (id: number, data: { month: string; content: string }) => {
+    await updateObservation(id, data)
+    await reloadEmployee()
+  }
+
+  const submitDeleteObservation = async (id: number) => {
+    await deleteObservation(id)
+    await reloadEmployee()
+  }
+
+  return {
+    observations,
+    isObservationLoading,
+    observationDataLoaded,
+    loadObservationData,
+    resetLoaded,
+    submitCreateObservation,
+    submitUpdateObservation,
+    submitDeleteObservation
+  }
+}