feat: gérer les constructeurs multiples

app/components/PieceItem.vue

@@ -68,22 +68,33 @@
       </div>
       <div>
         <span class="font-medium">Constructeur:</span>
-        <span v-if="!isEditMode" class="ml-2">
-          <span class="font-medium">{{
-            piece.constructeur?.name || "Non défini"
-          }}</span>
-          <span v-if="piece.constructeur" class="block text-xs text-gray-500">
-            {{
-              [piece.constructeur?.email, piece.constructeur?.phone]
-                .filter(Boolean)
-                .join(" • ")
-            }}
+        <div v-if="!isEditMode" class="ml-2">
+          <div v-if="pieceConstructeursDisplay.length" class="space-y-1">
+            <div
+              v-for="constructeur in pieceConstructeursDisplay"
+              :key="constructeur.id"
+              class="flex flex-col"
+            >
+              <span class="font-medium">
+                {{ constructeur.name }}
+              </span>
+              <span
+                v-if="formatConstructeurContact(constructeur)"
+                class="text-xs text-gray-500"
+              >
+                {{ formatConstructeurContact(constructeur) }}
+              </span>
+            </div>
+          </div>
+          <span v-else class="font-medium">
+            Non défini
           </span>
-        </span>
+        </div>
         <ConstructeurSelect
           v-else
           class="w-full"
-          :model-value="piece.constructeurId || piece.constructeur?.id || null"
+          :model-value="pieceConstructeurIds"
+          placeholder="Sélectionner un ou plusieurs constructeurs..."
           @update:model-value="handleConstructeurChange"
         />
       </div>
@@ -353,6 +364,7 @@
 <script setup>
 import { reactive, onMounted, watch, ref, computed } from "vue";
 import ConstructeurSelect from "./ConstructeurSelect.vue";
+import { useConstructeurs } from "~/composables/useConstructeurs";
 import { useCustomFields } from "~/composables/useCustomFields";
 import { useToast } from "~/composables/useToast";
 import { useDocuments } from "~/composables/useDocuments";
@@ -361,6 +373,11 @@ import { canPreviewDocument, isImageDocument, isPdfDocument } from "~/utils/docu
 import DocumentUpload from "~/components/DocumentUpload.vue";
 import DocumentPreviewModal from "~/components/DocumentPreviewModal.vue";
 import IconLucidePackage from "~icons/lucide/package";
+import {
+  formatConstructeurContact as formatConstructeurContactSummary,
+  resolveConstructeurs,
+  uniqueConstructeurIds,
+} from "~/shared/constructeurUtils";
 
 const props = defineProps({
   piece: {
@@ -716,8 +733,39 @@ const candidateCustomFields = computed(() => {
   return Array.from(map.values());
 });
 
+const { constructeurs } = useConstructeurs();
+
+const pieceConstructeurIds = computed(() =>
+  uniqueConstructeurIds(
+    props.piece,
+    Array.isArray(props.piece.constructeurs) ? props.piece.constructeurs : [],
+    props.piece.constructeur ? [props.piece.constructeur] : [],
+  ),
+);
+
+const pieceConstructeursDisplay = computed(() =>
+  resolveConstructeurs(
+    pieceConstructeurIds.value,
+    Array.isArray(props.piece.constructeurs) ? props.piece.constructeurs : [],
+    props.piece.constructeur ? [props.piece.constructeur] : [],
+    constructeurs.value,
+  ),
+);
+
+const formatConstructeurContact = (constructeur) =>
+  formatConstructeurContactSummary(constructeur);
+
 const handleConstructeurChange = (value) => {
-  props.piece.constructeurId = value;
+  const ids = uniqueConstructeurIds(value);
+  props.piece.constructeurIds = [...ids];
+  props.piece.constructeurId = null;
+  props.piece.constructeur = null;
+  props.piece.constructeurs = resolveConstructeurs(
+    ids,
+    constructeurs.value,
+    Array.isArray(props.piece.constructeurs) ? props.piece.constructeurs : [],
+  );
+
   updatePiece();
 };
 
@@ -971,7 +1019,7 @@ const updatePiece = () => {
     ...props.piece,
     ...pieceData,
     prix: prixValue && prixValue !== "" ? parseFloat(prixValue) : null,
-    constructeurId: props.piece.constructeurId || null,
+    constructeurIds: pieceConstructeurIds.value,
   });
 };