From 0b0ca60af7ab9305271435cdf6cd68a642755c7b Mon Sep 17 00:00:00 2001
From: tristan <tristan@yuno.malio.fr>
Date: Tue, 10 Feb 2026 16:49:03 +0100
Subject: [PATCH] =?UTF-8?q?feat=20:=20ajout=20d'un=20ordre=20d'affichage?=
 =?UTF-8?q?=20pour=20les=20employ=C3=A9s=20+=20ajout=20du=20drag=20and=20d?=
 =?UTF-8?q?rop=20pour=20changer=20l'ordre=20des=20employ=C3=A9s=20dans=20l?=
 =?UTF-8?q?e=20calendrier=20et=20l'impression?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                                          |  2 +
 config/packages/lexik_jwt_authentication.yaml |  3 +-
 frontend/components/CalendarGrid.vue          | 24 +++++++-
 frontend/pages/calendar.vue                   | 58 +++++++++++++++++--
 frontend/services/dto/employee.ts             |  1 +
 frontend/services/employees.ts                | 16 ++++-
 migrations/Version20260210121500.php          | 26 +++++++++
 migrations/Version20260210123000.php          | 39 +++++++++++++
 src/Entity/Employee.php                       | 16 +++++
 src/State/AbsencePrintProvider.php            |  1 +
 10 files changed, 177 insertions(+), 9 deletions(-)
 create mode 100644 migrations/Version20260210121500.php
 create mode 100644 migrations/Version20260210123000.php

diff --git a/.env b/.env
index a18d79d..211ce90 100644
--- a/.env
+++ b/.env
@@ -46,4 +46,6 @@ JWT_PUBLIC_KEY=%kernel.project_dir%/config/jwt/public.pem
 JWT_PASSPHRASE=9efb9a2ec48439c723621d0c6393d04da5516c8fa00ecdba1660717b4f996867
 JWT_COOKIE_SECURE=0
 JWT_COOKIE_SAMESITE=lax
+JWT_TOKEN_TTL=86400
+JWT_COOKIE_TTL=86400
 ###< lexik/jwt-authentication-bundle ###
diff --git a/config/packages/lexik_jwt_authentication.yaml b/config/packages/lexik_jwt_authentication.yaml
index 4fbf9be..ade6ecd 100644
--- a/config/packages/lexik_jwt_authentication.yaml
+++ b/config/packages/lexik_jwt_authentication.yaml
@@ -2,6 +2,7 @@ lexik_jwt_authentication:
     secret_key: '%env(resolve:JWT_SECRET_KEY)%'
     public_key: '%env(resolve:JWT_PUBLIC_KEY)%'
     pass_phrase: '%env(JWT_PASSPHRASE)%'
+    token_ttl: '%env(int:JWT_TOKEN_TTL)%'
     remove_token_from_body_when_cookies_used: true
     token_extractors:
         authorization_header:
@@ -13,7 +14,7 @@ lexik_jwt_authentication:
             enabled: false
     set_cookies:
         BEARER:
-            lifetime: 86400
+            lifetime: '%env(int:JWT_COOKIE_TTL)%'
             samesite: lax
             path: /
             secure: '%env(bool:JWT_COOKIE_SECURE)%'
diff --git a/frontend/components/CalendarGrid.vue b/frontend/components/CalendarGrid.vue
index 64b6064..3a82993 100644
--- a/frontend/components/CalendarGrid.vue
+++ b/frontend/components/CalendarGrid.vue
@@ -18,8 +18,12 @@
 
                 <template v-for="employee in visibleEmployees" :key="employee.id">
                     <div
-                        class="sticky left-0 z-10 border-b border-neutral-100 px-4 py-3 text-md font-semibold text-black"
+                        class="sticky left-0 z-10 border-b border-neutral-100 px-4 py-3 text-md font-semibold text-black cursor-pointer"
                         :style="{ backgroundColor: employee.site?.color ?? '#304998' }"
+                        draggable="true"
+                        @dragstart="handleDragStart($event, employee)"
+                        @dragover="handleDragOver"
+                        @drop="handleDrop($event, employee)"
                     >
                         {{ formatEmployeeName(employee) }}
                     </div>
@@ -97,9 +101,27 @@ defineProps<{
 
 const emit = defineEmits<{
     (event: 'cell-click', employee: Employee, date: string): void
+    (event: 'reorder', payload: { dragId: number; dropId: number }): void
 }>()
 
 const handleCellClick = (employee: Employee, date: string) => {
     emit('cell-click', employee, date)
 }
+
+const handleDragStart = (event: DragEvent, employee: Employee) => {
+    if (!event.dataTransfer) return
+    event.dataTransfer.effectAllowed = 'move'
+    event.dataTransfer.setData('text/plain', String(employee.id))
+}
+
+const handleDragOver = (event: DragEvent) => {
+    event.preventDefault()
+}
+
+const handleDrop = (event: DragEvent, employee: Employee) => {
+    event.preventDefault()
+    const dragId = Number(event.dataTransfer?.getData('text/plain'))
+    if (!dragId || dragId === employee.id) return
+    emit('reorder', { dragId, dropId: employee.id })
+}
 </script>
diff --git a/frontend/pages/calendar.vue b/frontend/pages/calendar.vue
index aa119d0..32aed26 100644
--- a/frontend/pages/calendar.vue
+++ b/frontend/pages/calendar.vue
@@ -73,6 +73,7 @@
                 :format-employee-name="formatEmployeeName"
                 :is-holiday-date="isHolidayDate"
                 @cell-click="openCreate"
+                @reorder="handleReorder"
             />
         </div>
 
@@ -104,7 +105,7 @@ import type {AbsenceType} from '~/services/dto/absence-type'
 import type {Absence} from '~/services/dto/absence'
 import type {HalfDay} from '~/services/dto/half-day'
 import {HALF_DAYS} from '~/services/dto/half-day'
-import {listEmployees} from '~/services/employees'
+import {listEmployees, updateEmployeeOrder} from '~/services/employees'
 import {listAbsenceTypes} from '~/services/absence-types'
 import {createAbsence, deleteAbsence, listAbsences, updateAbsence} from '~/services/absences'
 import {listPublicHolidays} from '~/services/public-holidays'
@@ -141,11 +142,14 @@ const sortedEmployees = computed(() => {
     const siteNameA = employeeA.site?.name ?? ''
     const siteNameB = employeeB.site?.name ?? ''
     if (siteNameA !== siteNameB) return siteNameA.localeCompare(siteNameB, 'fr')
-        const lastNameA = employeeA.lastName ?? ''
-        const lastNameB = employeeB.lastName ?? ''
-        if (lastNameA !== lastNameB) return lastNameA.localeCompare(lastNameB, 'fr')
-        const firstNameA = employeeA.firstName ?? ''
-        const firstNameB = employeeB.firstName ?? ''
+    const orderA = employeeA.displayOrder ?? 0
+    const orderB = employeeB.displayOrder ?? 0
+    if (orderA !== orderB) return orderA - orderB
+    const lastNameA = employeeA.lastName ?? ''
+    const lastNameB = employeeB.lastName ?? ''
+    if (lastNameA !== lastNameB) return lastNameA.localeCompare(lastNameB, 'fr')
+    const firstNameA = employeeA.firstName ?? ''
+    const firstNameB = employeeB.firstName ?? ''
     return firstNameA.localeCompare(firstNameB, 'fr')
   })
 })
@@ -670,4 +674,46 @@ const handlePrint = async () => {
     await printPdf(`/absences/print?${params.toString()}`)
     isPrintOpen.value = false
 }
+
+const handleReorder = async (payload: { dragId: number; dropId: number }) => {
+    const dragEmployee = employees.value.find((employee) => employee.id === payload.dragId)
+    const dropEmployee = employees.value.find((employee) => employee.id === payload.dropId)
+    if (!dragEmployee || !dropEmployee) return
+    const dragSiteId = dragEmployee.site?.id
+    const dropSiteId = dropEmployee.site?.id
+    if (!dragSiteId || !dropSiteId || dragSiteId !== dropSiteId) return
+
+    const siteEmployees = [...employees.value]
+        .filter((employee) => employee.site?.id === dragSiteId)
+        .sort((employeeA, employeeB) => {
+            const orderA = employeeA.displayOrder ?? 0
+            const orderB = employeeB.displayOrder ?? 0
+            if (orderA !== orderB) return orderA - orderB
+            const lastNameA = employeeA.lastName ?? ''
+            const lastNameB = employeeB.lastName ?? ''
+            if (lastNameA !== lastNameB) return lastNameA.localeCompare(lastNameB, 'fr')
+            const firstNameA = employeeA.firstName ?? ''
+            const firstNameB = employeeB.firstName ?? ''
+            return firstNameA.localeCompare(firstNameB, 'fr')
+        })
+
+    const fromIndex = siteEmployees.findIndex((employee) => employee.id === dragEmployee.id)
+    const toIndex = siteEmployees.findIndex((employee) => employee.id === dropEmployee.id)
+    if (fromIndex < 0 || toIndex < 0 || fromIndex === toIndex) return
+
+    const [moved] = siteEmployees.splice(fromIndex, 1)
+    siteEmployees.splice(toIndex, 0, moved)
+
+    const updates: Array<{ id: number; displayOrder: number }> = []
+    siteEmployees.forEach((employee, index) => {
+        const nextOrder = index + 1
+        if ((employee.displayOrder ?? 0) !== nextOrder) {
+            updates.push({ id: employee.id, displayOrder: nextOrder })
+        }
+        employee.displayOrder = nextOrder
+    })
+
+    if (updates.length === 0) return
+    await Promise.all(updates.map((update) => updateEmployeeOrder(update.id, update.displayOrder)))
+}
 </script>
diff --git a/frontend/services/dto/employee.ts b/frontend/services/dto/employee.ts
index f127a02..c638e50 100644
--- a/frontend/services/dto/employee.ts
+++ b/frontend/services/dto/employee.ts
@@ -5,4 +5,5 @@ export type Employee = {
   firstName: string
   lastName: string
   site: Site
+  displayOrder?: number
 }
diff --git a/frontend/services/employees.ts b/frontend/services/employees.ts
index fa5898c..b3e88d9 100644
--- a/frontend/services/employees.ts
+++ b/frontend/services/employees.ts
@@ -33,19 +33,33 @@ export const updateEmployee = async (
     firstName: string
     lastName: string
     siteId?: number | null
+    displayOrder?: number
   }
 ) => {
   const api = useApi()
   return api.patch<Employee>(`/employees/${id}`, {
     firstName: payload.firstName,
     lastName: payload.lastName,
-    site: payload.siteId ? `/api/sites/${payload.siteId}` : null
+    site: payload.siteId ? `/api/sites/${payload.siteId}` : null,
+    displayOrder: payload.displayOrder
   }, {
     toastSuccessKey: 'success.employee.update',
     toastErrorKey: 'errors.employee.update'
   })
 }
 
+export const updateEmployeeOrder = async (
+  id: number,
+  displayOrder: number
+) => {
+  const api = useApi()
+  return api.patch<Employee>(`/employees/${id}`, {
+    displayOrder
+  }, {
+    toast: false
+  })
+}
+
 export const deleteEmployee = async (id: number) => {
   const api = useApi()
   return api.delete(`/employees/${id}`, {}, {
diff --git a/migrations/Version20260210121500.php b/migrations/Version20260210121500.php
new file mode 100644
index 0000000..29a49df
--- /dev/null
+++ b/migrations/Version20260210121500.php
@@ -0,0 +1,26 @@
+<?php
+
+declare(strict_types=1);
+
+namespace DoctrineMigrations;
+
+use Doctrine\DBAL\Schema\Schema;
+use Doctrine\Migrations\AbstractMigration;
+
+final class Version20260210121500 extends AbstractMigration
+{
+    public function getDescription(): string
+    {
+        return 'Add display_order to employees';
+    }
+
+    public function up(Schema $schema): void
+    {
+        $this->addSql('ALTER TABLE employees ADD display_order INT NOT NULL DEFAULT 0');
+    }
+
+    public function down(Schema $schema): void
+    {
+        $this->addSql('ALTER TABLE employees DROP COLUMN display_order');
+    }
+}
diff --git a/migrations/Version20260210123000.php b/migrations/Version20260210123000.php
new file mode 100644
index 0000000..d1fc184
--- /dev/null
+++ b/migrations/Version20260210123000.php
@@ -0,0 +1,39 @@
+<?php
+
+declare(strict_types=1);
+
+namespace DoctrineMigrations;
+
+use Doctrine\DBAL\Schema\Schema;
+use Doctrine\Migrations\AbstractMigration;
+
+final class Version20260210123000 extends AbstractMigration
+{
+    public function getDescription(): string
+    {
+        return 'Backfill employee display_order per site';
+    }
+
+    public function up(Schema $schema): void
+    {
+        // Initialise display_order par site selon le tri nom/prénom/id.
+        $this->addSql('
+            UPDATE employees e
+            SET display_order = ranked.rn
+            FROM (
+                SELECT id,
+                       ROW_NUMBER() OVER (
+                           PARTITION BY site_id
+                           ORDER BY last_name ASC, first_name ASC, id ASC
+                       ) AS rn
+                FROM employees
+            ) ranked
+            WHERE ranked.id = e.id
+        ');
+    }
+
+    public function down(Schema $schema): void
+    {
+        // Pas de rollback pertinent.
+    }
+}
diff --git a/src/Entity/Employee.php b/src/Entity/Employee.php
index ee8153d..95ace70 100644
--- a/src/Entity/Employee.php
+++ b/src/Entity/Employee.php
@@ -37,6 +37,10 @@ class Employee
     #[Groups(['employee:read', 'employee:write'])]
     private ?Site $site = null;
 
+    #[ORM\Column(type: 'integer', options: ['default' => 0])]
+    #[Groups(['employee:read', 'employee:write'])]
+    private int $displayOrder = 0;
+
     #[ORM\Column(type: 'datetime_immutable')]
     private DateTimeImmutable $createdAt;
 
@@ -90,4 +94,16 @@ class Employee
     {
         return $this->createdAt;
     }
+
+    public function getDisplayOrder(): int
+    {
+        return $this->displayOrder;
+    }
+
+    public function setDisplayOrder(int $displayOrder): self
+    {
+        $this->displayOrder = $displayOrder;
+
+        return $this;
+    }
 }
diff --git a/src/State/AbsencePrintProvider.php b/src/State/AbsencePrintProvider.php
index f88fa74..8e6329c 100644
--- a/src/State/AbsencePrintProvider.php
+++ b/src/State/AbsencePrintProvider.php
@@ -115,6 +115,7 @@ class AbsencePrintProvider implements ProviderInterface
             ->leftJoin('e.site', 's')
             ->addSelect('s')
             ->orderBy('s.name', 'ASC')
+            ->addOrderBy('e.displayOrder', 'ASC')
             ->addOrderBy('e.lastName', 'ASC')
             ->addOrderBy('e.firstName', 'ASC')
         ;