refactor(frontend) : extract reusable DataTable component from repeated table markup

Replace inline table HTML in 8 files with a shared DataTable component
supporting columns definition, scoped slots for custom cells, and
built-in delete action.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/components/AdminEffortTab.vue

@@ -10,39 +10,15 @@
             </button>
         </div>
 
-        <div class="mt-6 overflow-x-auto rounded-lg border border-neutral-200">
-            <table class="w-full text-left text-sm">
-                <thead class="border-b border-neutral-200 bg-neutral-50">
-                    <tr>
-                        <th class="px-4 py-3 font-semibold text-neutral-700">Libellé</th>
-                        <th class="px-4 py-3 font-semibold text-neutral-700">Actions</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr
-                        v-for="item in items"
-                        :key="item.id"
-                        class="border-b border-neutral-100 hover:bg-neutral-50 cursor-pointer"
-                        @click="openEdit(item)"
-                    >
-                        <td class="px-4 py-3 font-semibold text-primary-500">{{ item.label }}</td>
-                        <td class="px-4 py-3">
-                            <button
-                                class="text-red-500 hover:text-red-700"
-                                @click.stop="handleDelete(item.id)"
-                            >
-                                <Icon name="mdi:delete-outline" size="20" />
-                            </button>
-                        </td>
-                    </tr>
-                    <tr v-if="items.length === 0 && !isLoading">
-                        <td colspan="2" class="px-4 py-8 text-center text-neutral-400">
-                            Aucun effort trouvé.
-                        </td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
+        <DataTable
+            :columns="columns"
+            :items="items"
+            :loading="isLoading"
+            empty-message="Aucun effort trouvé."
+            deletable
+            @row-click="openEdit"
+            @delete="(item) => handleDelete(item.id)"
+        />
 
         <TaskEffortDrawer
             v-model="drawerOpen"
@@ -56,6 +32,12 @@
 import type { TaskEffort } from '~/services/dto/task-effort'
 import { useTaskEffortService } from '~/services/task-efforts'
 
+import type { DataTableColumn } from '~/components/DataTable.vue'
+
+const columns: DataTableColumn[] = [
+    { key: 'label', label: 'Libellé', primary: true },
+]
+
 const { getAll, remove } = useTaskEffortService()
 const items = ref<TaskEffort[]>([])
 const isLoading = ref(true)