feat : ajout des sites pour les employés et retour arrière sur l'impression

frontend/pages/employees.vue

@@ -19,9 +19,10 @@
     </div>
 
     <div v-else class="max-h-[80vh] overflow-auto rounded-lg border border-neutral-200 bg-white">
-      <div class="grid grid-cols-[120px_1fr_200px] gap-4 border-b border-neutral-200 bg-tertiary-500 px-6 py-3 text-md font-semibold text-neutral-700">
+      <div class="grid grid-cols-[120px_1fr_1fr_200px] gap-4 border-b border-neutral-200 bg-tertiary-500 px-6 py-3 text-md font-semibold text-neutral-700">
         <span class="text-left">Prénom</span>
         <span class="text-left">Nom</span>
+        <span class="text-left">Site</span>
         <span class="text-right">Actions</span>
       </div>
       <div v-if="isLoading" class="px-6 py-4 text-md text-neutral-500">
@@ -31,10 +32,11 @@
         <div
           v-for="employee in employees"
           :key="employee.id"
-          class="grid grid-cols-[120px_1fr_200px] items-center gap-4 border-b border-neutral-100 px-6 py-3 text-md text-neutral-800 last:border-b-0"
+          class="grid grid-cols-[120px_1fr_1fr_200px] items-center gap-4 border-b border-neutral-100 px-6 py-3 text-md text-neutral-800 last:border-b-0"
         >
           <span>{{ employee.firstName }}</span>
           <span>{{ employee.lastName }}</span>
+          <span>{{ employee.site?.name ?? '-' }}</span>
           <div class="flex items-center justify-end gap-2">
             <button
               type="button"
@@ -75,6 +77,19 @@
             class="mt-2 w-full rounded-md border border-neutral-300 px-3 py-2 text-base text-neutral-900 focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-200"
           />
         </div>
+        <div>
+          <label class="text-md font-semibold text-neutral-700" for="site">Site</label>
+          <select
+            id="site"
+            v-model="form.siteId"
+            class="mt-2 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-md text-neutral-900"
+          >
+            <option value="">Aucun site</option>
+            <option v-for="site in sites" :key="site.id" :value="site.id">
+              {{ site.name }}
+            </option>
+          </select>
+        </div>
         <div class="flex justify-end gap-3 pt-2">
           <button
             type="button"
@@ -98,7 +113,9 @@
 
 <script setup lang="ts">
 import type { Employee } from '~/services/dto/employee'
+import type { Site } from '~/services/dto/site'
 import { createEmployee, deleteEmployee, listEmployees, updateEmployee } from '~/services/employees'
+import { listSites } from '~/services/sites'
 
 const isDrawerOpen = ref(false)
 const isSubmitting = ref(false)
@@ -109,10 +126,12 @@ const drawerTitle = computed(() =>
 )
 
 const employees = ref<Employee[]>([])
+const sites = ref<Site[]>([])
 
 const form = reactive({
   firstName: '',
-  lastName: ''
+  lastName: '',
+  siteId: '' as number | ''
 })
 
 const loadEmployees = async () => {
@@ -124,7 +143,13 @@ const loadEmployees = async () => {
   }
 }
 
-onMounted(loadEmployees)
+const loadSites = async () => {
+  sites.value = await listSites()
+}
+
+onMounted(async () => {
+  await Promise.all([loadEmployees(), loadSites()])
+})
 
 const handleSubmit = async () => {
   if (isSubmitting.value) return
@@ -134,17 +159,20 @@ const handleSubmit = async () => {
     if (editingEmployee.value) {
       await updateEmployee(editingEmployee.value.id, {
         firstName: form.firstName,
-        lastName: form.lastName
+        lastName: form.lastName,
+        siteId: form.siteId === '' ? null : Number(form.siteId)
       })
     } else {
       await createEmployee({
         firstName: form.firstName,
-        lastName: form.lastName
+        lastName: form.lastName,
+        siteId: form.siteId === '' ? null : Number(form.siteId)
       })
     }
 
     form.firstName = ''
     form.lastName = ''
+    form.siteId = ''
     editingEmployee.value = null
     isDrawerOpen.value = false
     await loadEmployees()
@@ -157,6 +185,7 @@ const openEdit = (employee: Employee) => {
   editingEmployee.value = employee
   form.firstName = employee.firstName
   form.lastName = employee.lastName
+  form.siteId = employee.site?.id ?? ''
   isDrawerOpen.value = true
 }