feat(project-management) : extract Projects/Tasks front into Nuxt module layer

Tranche 4 of LST-65. Companion to the backend module migration.

- Move pages (my-tasks, projects, projects/[id]/{index,groups,archives}),
  18 components (project + task), 10 services and 10 DTOs into
  frontend/modules/project-management/ (auto-detected layer).
- Rewrite explicit ~/services/* and ~/services/dto/* imports across 38
  consumers (admin tabs, mail modals, dashboard, mail page, layout) including
  the time-tracking module whose DTOs referenced project/task/task-tag.
- clients.ts and shared DTOs (client, user-data) stay at the root.
- Routes /my-tasks, /projects, /projects/:id(/groups|/archives) preserved;
  i18n stays global.

nuxt build passes; routes confirmed.

frontend/modules/project-management/components/TaskCard.vue

@@ -0,0 +1,157 @@
+<template>
+    <div
+        class="cursor-pointer rounded-lg border border-neutral-200 bg-white p-3 shadow-sm transition hover:shadow-md"
+        draggable="true"
+        @dragstart="onDragStart"
+        @dragend="onDragEnd"
+        @click="emit('click')"
+    >
+        <div class="flex items-start justify-between gap-2">
+            <div class="min-w-0">
+                <div class="flex items-center gap-1">
+                    <span
+                        v-if="task.project && task.number"
+                        class="text-xs font-semibold"
+                        :class="showProjectColor ? '' : 'text-neutral-400'"
+                        :style="showProjectColor && task.project.color ? { color: task.project.color } : {}"
+                    >{{ task.project.code }}{{ task.number }}</span>
+                    <Icon
+                        v-if="task.priority?.label === 'Haute'"
+                        name="mdi:flag-variant"
+                        class="h-3.5 w-3.5 text-red-600"
+                    />
+                </div>
+                <h4 class="line-clamp-2 text-sm font-semibold text-neutral-900">{{ task.title }}</h4>
+            </div>
+            <MalioButtonIcon
+                :icon="isTimerOnTask ? 'mdi:stop-circle-outline' : 'mdi:play-circle-outline'"
+                :aria-label="isTimerOnTask ? 'Arrêter le timer' : 'Démarrer le timer'"
+                variant="ghost"
+                icon-size="20"
+                :button-class="isTimerOnTask ? 'shrink-0 text-[#F18619] hover:text-[#d97314]' : 'shrink-0 text-neutral-400 hover:text-primary-500'"
+                @click.stop="isTimerOnTask ? timerStore.stop() : onPlay()"
+            />
+        </div>
+
+        <div class="mt-2 flex flex-wrap items-center gap-1.5">
+            <span
+                v-if="showStatusBadge && task.status"
+                class="rounded-full px-2 py-0.5 text-xs font-semibold text-white"
+                :style="{ backgroundColor: task.status.color }"
+            >
+                {{ task.status.label }}
+            </span>
+            <span
+                v-if="task.priority"
+                class="rounded-full px-2 py-0.5 text-xs font-semibold text-white"
+                :style="{ backgroundColor: task.priority.color }"
+            >
+                {{ task.priority.label }}
+            </span>
+            <span
+                v-for="tag in task.tags"
+                :key="tag.id"
+                class="rounded-full px-2 py-0.5 text-xs font-semibold text-white"
+                :style="{ backgroundColor: tag.color }"
+            >
+                {{ tag.label }}
+            </span>
+            <!-- Deadline badge -->
+            <span
+                v-if="task.deadline"
+                class="rounded-full px-2 py-0.5 text-xs font-semibold text-white"
+                :style="{ backgroundColor: deadlineColor }"
+                :title="task.deadline"
+            >
+                {{ formatDeadline(task.deadline) }}
+            </span>
+            <!-- Calendar sync icon -->
+            <Icon
+                v-if="task.syncToCalendar"
+                :name="task.calendarSyncError ? 'mdi:alert-circle' : 'mdi:calendar-check'"
+                :class="task.calendarSyncError ? 'text-red-500' : 'text-green-500'"
+                size="14"
+            />
+            <!-- Recurrence icon -->
+            <Icon
+                v-if="task.recurrence"
+                name="mdi:repeat"
+                class="text-blue-500"
+                size="14"
+            />
+            <Icon
+                v-if="task.collaborators?.length"
+                name="mdi:account-group"
+                class="ml-auto h-4 w-4 text-neutral-400"
+                :title="task.collaborators.map(c => c.username).join(', ')"
+            />
+            <UserAvatar
+                v-if="task.assignee"
+                :user="task.assignee"
+                size="xs"
+                :class="task.collaborators?.length ? '' : 'ml-auto'"
+            />
+            <span
+                v-else
+                class="ml-auto flex h-5 w-5 items-center justify-center rounded-full bg-neutral-200 text-neutral-400"
+            >
+                <Icon name="mdi:account-outline" size="14" />
+            </span>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { Task } from '~/modules/project-management/services/dto/task'
+
+const props = withDefaults(defineProps<{
+    task: Task
+    showProjectColor?: boolean
+    showStatusBadge?: boolean
+}>(), {
+    showProjectColor: false,
+    showStatusBadge: false,
+})
+
+const emit = defineEmits<{
+    (e: 'click'): void
+}>()
+
+const timerStore = useTimerStore()
+
+const isTimerOnTask = computed(() => {
+    const entry = timerStore.activeEntry
+    if (!entry?.task) return false
+    const entryTaskId = typeof entry.task === 'string'
+        ? entry.task
+        : (entry.task['@id'] ?? entry.task.id)
+    const taskId = props.task['@id'] ?? props.task.id
+    return entryTaskId === taskId || entryTaskId === `/api/tasks/${props.task.id}`
+})
+
+function onPlay() {
+    timerStore.startFromTask(props.task)
+}
+
+const deadlineColor = computed(() => {
+    if (!props.task.deadline) return ''
+    const daysLeft = (new Date(props.task.deadline).getTime() - Date.now()) / 86400000
+    if (daysLeft < 0) return '#DC2626'
+    if (daysLeft < 2) return '#F59E0B'
+    return '#9CA3AF'
+})
+
+function formatDeadline(d: string): string {
+    return new Date(d).toLocaleDateString('fr-FR', { month: 'short', day: 'numeric' })
+}
+
+function onDragStart(event: DragEvent) {
+    event.dataTransfer!.effectAllowed = 'move'
+    event.dataTransfer!.setData('text/plain', String(props.task.id))
+    ;(event.target as HTMLElement).classList.add('opacity-50')
+}
+
+function onDragEnd(event: DragEvent) {
+    ;(event.target as HTMLElement).classList.remove('opacity-50')
+}
+</script>