Initial commit with contrats and domaines modules

resources/js/Components/Commandes/HistoriqueTimeline.vue

@@ -0,0 +1,57 @@
+<script setup>
+import { usePage } from '@inertiajs/vue3'
+import StatutBadge from './StatutBadge.vue'
+
+defineProps({
+    historique: { type: Array, required: true },
+})
+
+const page = usePage()
+const statuts = page.props.config?.statuts ?? {}
+
+function formatDate(dt) {
+    if (!dt) return ''
+    return new Intl.DateTimeFormat('fr-FR', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' }).format(new Date(dt))
+}
+</script>
+
+<template>
+    <div class="flow-root">
+        <ul class="-mb-8">
+            <li v-for="(entry, idx) in historique" :key="entry.id" class="relative pb-8">
+                <!-- Vertical line (except last) -->
+                <span v-if="idx !== historique.length - 1"
+                    class="absolute left-4 top-4 -ml-px h-full w-0.5 bg-gray-200" aria-hidden="true" />
+
+                <div class="relative flex items-start space-x-3">
+                    <!-- Dot -->
+                    <div class="relative flex h-8 w-8 items-center justify-center rounded-full bg-white ring-8 ring-white">
+                        <div class="h-3 w-3 rounded-full bg-blue-500 ring-2 ring-white" />
+                    </div>
+
+                    <!-- Content -->
+                    <div class="min-w-0 flex-1">
+                        <div class="flex flex-wrap items-center gap-2 text-sm">
+                            <span class="font-medium text-gray-900">{{ entry.user?.name ?? 'Système' }}</span>
+                            <template v-if="entry.ancien_statut">
+                                <StatutBadge :statut="entry.ancien_statut" size="sm" />
+                                <svg class="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+                                </svg>
+                            </template>
+                            <StatutBadge :statut="entry.nouveau_statut" size="sm" />
+                        </div>
+                        <p v-if="entry.commentaire" class="mt-1 text-sm text-gray-600 italic">
+                            "{{ entry.commentaire }}"
+                        </p>
+                        <time class="mt-0.5 block text-xs text-gray-400">{{ formatDate(entry.created_at) }}</time>
+                    </div>
+                </div>
+            </li>
+        </ul>
+
+        <p v-if="!historique.length" class="text-sm text-gray-400 italic text-center py-4">
+            Aucun historique disponible.
+        </p>
+    </div>
+</template>