feat: add constructors selection and management

app/pages/machine/[id].vue

@@ -105,16 +105,19 @@
               <label class="label">
                 <span class="label-text">Constructeur</span>
               </label>
-              <input 
+              <ConstructeurSelect
                 v-if="isEditMode"
-                :id="getMachineFieldId('constructeur')"
-                v-model="machineConstructeur" 
-                type="text" 
-                class="input input-bordered"
-                @blur="updateMachineInfo"
+                :key="machine.value?.id"
+                v-model="machineConstructeurId"
+                placeholder="Rechercher un constructeur..."
               />
               <div v-else class="input input-bordered bg-base-200">
-                {{ machineConstructeur || 'Non défini' }}
+                <div class="flex flex-col">
+                  <span class="font-medium">{{ machine.value?.constructeur?.name || 'Non défini' }}</span>
+                  <span class="text-xs text-gray-500">
+                    {{ [machine.value?.constructeur?.email, machine.value?.constructeur?.phone].filter(Boolean).join(' • ') }}
+                  </span>
+                </div>
               </div>
             </div>
           </div>
@@ -350,7 +353,7 @@
 </template>
 
 <script setup>
-import { ref, reactive, onMounted, computed } from 'vue'
+import { ref, reactive, onMounted, computed, watch } from 'vue'
 import { useRoute } from 'vue-router'
 import { useMachines } from '~/composables/useMachines'
 import { useComposants } from '~/composables/useComposants'
@@ -362,6 +365,7 @@ import { useDocuments } from '~/composables/useDocuments'
 import { getFileIcon } from '~/utils/fileIcons'
 import ComponentHierarchy from '~/components/ComponentHierarchy.vue'
 import DocumentUpload from '~/components/DocumentUpload.vue'
+import ConstructeurSelect from '~/components/ConstructeurSelect.vue'
 
 const route = useRoute()
 const machineId = route.params.id
@@ -401,7 +405,7 @@ const pieces = ref([])
 const machineName = ref('')
 const machineReference = ref('')
 const machineEmplacement = ref('')
-const machineConstructeur = ref('')
+const machineConstructeurId = ref(null)
 
 // Valeurs des champs personnalisés de la machine
 const machineCustomFieldValues = reactive({})
@@ -409,6 +413,18 @@ const machineCustomFieldValues = reactive({})
 const machineDocumentFiles = ref([])
 const machineDocumentsUploading = ref(false)
 const machineDocumentsLoaded = ref(false)
+const machineConstructeurInitialized = ref(false)
+
+watch(machineConstructeurId, (newValue, oldValue) => {
+  if (!machine.value) return
+  if (!machineConstructeurInitialized.value) {
+    machineConstructeurInitialized.value = true
+    return
+  }
+  if (newValue !== oldValue) {
+    updateMachineInfo()
+  }
+})
 
 // Mode d'édition
 const isEditMode = ref(false)
@@ -434,7 +450,8 @@ const initMachineFields = () => {
     machineName.value = machine.value.name || ''
     machineReference.value = machine.value.reference || ''
     machineEmplacement.value = machine.value.emplacement || ''
-    machineConstructeur.value = machine.value.constructeur || ''
+    machineConstructeurId.value = machine.value.constructeurId || machine.value.constructeur?.id || null
+    machineConstructeurInitialized.value = false
   }
 }
 
@@ -543,7 +560,9 @@ const transformCustomFields = (pieces) => {
     return {
       ...piece,
       customFields,
-      documents: piece.documents || []
+      documents: piece.documents || [],
+      constructeur: piece.constructeur || null,
+      constructeurId: piece.constructeurId || piece.constructeur?.id || null,
     }
   })
 }
@@ -577,7 +596,9 @@ const transformComponentCustomFields = (componentsData) => {
       customFields, // Use customFields for frontend display
       pieces,
       subComponents, // Use the transformed sousComposants as subComponents
-      documents: component.documents || []
+      documents: component.documents || [],
+      constructeur: component.constructeur || null,
+      constructeurId: component.constructeurId || component.constructeur?.id || null,
     };
     
     console.log('Transformed component:', result.name, 'with subComponents:', result.subComponents?.length || 0)
@@ -677,10 +698,11 @@ const updateMachineInfo = async () => {
       name: machineName.value,
       reference: machineReference.value,
       emplacement: machineEmplacement.value,
-      constructeur: machineConstructeur.value
+      constructeurId: machineConstructeurId.value || null
     })
     if (result.success) {
-      // Machine updated successfully
+      machine.value = result.data
+      machineConstructeurId.value = result.data.constructeurId || result.data.constructeur?.id || null
     }
   } catch (error) {
     console.error('Erreur lors de la mise à jour de la machine:', error)
@@ -693,12 +715,12 @@ const updateComponent = async (updatedComponent) => {
     const result = await updateComposantApi(updatedComponent.id, {
       name: updatedComponent.name,
       reference: updatedComponent.reference,
-      constructeur: updatedComponent.constructeur,
+      constructeurId: updatedComponent.constructeurId || updatedComponent.constructeur?.id || null,
       emplacement: updatedComponent.emplacement,
       prix: prixValue && prixValue !== '' ? parseFloat(prixValue) : null
     })
     if (result.success) {
-      // Component updated successfully
+      Object.assign(updatedComponent, result.data)
     }
   } catch (error) {
     console.error('Erreur lors de la mise à jour du composant:', error)
@@ -710,13 +732,12 @@ const updatePieceFromComponent = async (updatedPiece) => {
     const result = await updatePieceApi(updatedPiece.id, {
       name: updatedPiece.name,
       reference: updatedPiece.reference,
-      constructeur: updatedPiece.constructeur,
+      constructeurId: updatedPiece.constructeurId || updatedPiece.constructeur?.id || null,
       emplacement: updatedPiece.emplacement,
       prix: updatedPiece.prix && updatedPiece.prix !== '' ? parseFloat(updatedPiece.prix) : null
     })
     if (result.success) {
-      // Piece updated successfully
-      
+      Object.assign(updatedPiece, result.data)
       // Si la pièce a des champs personnalisés mis à jour, les traiter
       if (updatedPiece.customFields) {
         for (const field of updatedPiece.customFields) {
@@ -741,12 +762,12 @@ const updatePieceInfo = async (updatedPiece) => {
     const result = await updatePieceApi(updatedPiece.id, {
       name: updatedPiece.name,
       reference: updatedPiece.reference,
-      constructeur: updatedPiece.constructeur,
+      constructeurId: updatedPiece.constructeurId || updatedPiece.constructeur?.id || null,
       emplacement: updatedPiece.emplacement,
       prix: updatedPiece.prix && updatedPiece.prix !== '' ? parseFloat(updatedPiece.prix) : null
     })
     if (result.success) {
-      // Piece updated successfully
+      Object.assign(updatedPiece, result.data)
     }
   } catch (error) {
     console.error('Erreur lors de la mise à jour de la pièce:', error)