docs(changelog) : add v1.10.0 release notes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

app/components/ComponentItem.vue

@@ -6,6 +6,12 @@
       :documents="componentDocuments"
       @close="closePreview"
     />
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
 
     <!-- Component Header -->
     <div class="flex items-center gap-3 p-3 bg-base-200 rounded-lg cursor-pointer" @click="toggleCollapse">
@@ -208,21 +214,23 @@
         <DocumentListInline
           :documents="componentDocuments"
           :can-delete="isEditMode"
+          :can-edit="isEditMode"
           :delete-disabled="uploadingDocuments"
           empty-text="Aucun document lié à ce composant."
           @preview="openPreview"
+          @edit="openEditModal"
           @delete="removeDocument"
         />
       </div>
 
-      <!-- Component Pieces -->
+      <!-- Component Pieces (real MachinePieceLinks) -->
-      <div v-if="component.pieces && component.pieces.length > 0" class="space-y-2">
+      <div v-if="linkedPieces.length > 0" class="space-y-2">
         <p class="text-xs font-semibold text-base-content/50 uppercase tracking-wide">
           Pièces du composant
         </p>
         <div class="space-y-2">
           <PieceItem
-            v-for="piece in component.pieces"
+            v-for="piece in linkedPieces"
             :key="piece.id"
             :piece="piece"
             :is-edit-mode="isEditMode"
@@ -233,6 +241,21 @@
         </div>
       </div>
 
+      <!-- Structure pieces (read-only, from composant definition) -->
+      <div v-if="structurePieces.length > 0" class="space-y-2">
+        <p class="text-xs font-semibold text-base-content/50 uppercase tracking-wide">
+          Pièces incluses par défaut
+        </p>
+        <div class="space-y-2">
+          <PieceItem
+            v-for="piece in structurePieces"
+            :key="piece.id"
+            :piece="piece"
+            :is-edit-mode="false"
+          />
+        </div>
+      </div>
+
       <!-- Sub Components -->
       <div v-if="childComponents.length > 0" class="space-y-2">
         <p class="text-xs font-semibold text-base-content/50 uppercase tracking-wide">
@@ -304,6 +327,7 @@ const {
   ensureDocumentsLoaded,
   handleFilesAdded,
   removeDocument,
+  editDocument,
 } = useEntityDocuments({ entity: () => props.component, entityType: 'composant' })
 
 const {
@@ -318,6 +342,21 @@ const {
   updateCustomField: updateComponentCustomField,
 } = useEntityCustomFields({ entity: () => props.component, entityType: 'composant' })
 
+// --- Document edit modal ---
+const editingDocument = ref(null)
+const editModalVisible = ref(false)
+
+const openEditModal = (doc) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+const handleDocumentUpdated = async (data) => {
+  if (!editingDocument.value?.id) return
+  await editDocument(editingDocument.value.id, data)
+  editModalVisible.value = false
+  editingDocument.value = null
+}
+
 // --- Collapse state ---
 const isCollapsed = ref(true)
 
@@ -341,6 +380,14 @@ const childComponents = computed(() => {
   return Array.isArray(list) ? list : []
 })
 
+// --- Pieces split: real links vs structure definitions ---
+const allPieces = computed(() => {
+  const list = props.component.pieces
+  return Array.isArray(list) ? list : []
+})
+const linkedPieces = computed(() => allPieces.value.filter((p) => !p._structurePiece))
+const structurePieces = computed(() => allPieces.value.filter((p) => p._structurePiece))
+
 // --- Constructeurs ---
 const { constructeurs } = useConstructeurs()
 

app/components/ComponentModelStructureEditor.vue

@@ -10,7 +10,6 @@
       :locked-type-label="displayedRootTypeLabel"
       :allow-subcomponents="allowSubcomponents"
       :max-subcomponent-depth="maxSubcomponentDepth"
-      :restricted-mode="restrictedMode"
       is-root
     />
   </div>
@@ -56,10 +55,6 @@ const props = defineProps({
     type: Number,
     default: Infinity,
   },
-  restrictedMode: {
-    type: Boolean,
-    default: false,
-  },
 })
 
 const emit = defineEmits(['update:modelValue'])

app/components/ComposantSelect.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="space-y-1">
+    <SearchSelect
+      :model-value="modelValue ?? undefined"
+      :options="composantOptions"
+      :loading="loading"
+      :placeholder="placeholder"
+      :empty-text="emptyText"
+      size="sm"
+      option-value="id"
+      option-label="name"
+      :disabled="disabled"
+      @update:modelValue="updateValue"
+    >
+      <template #option-description="{ option }">
+        <span class="text-xs text-base-content/60">
+          {{ formatDescription(option) }}
+        </span>
+      </template>
+    </SearchSelect>
+    <p v-if="helperText" class="text-xs text-base-content/60">
+      {{ helperText }}
+    </p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue'
+import SearchSelect from '~/components/common/SearchSelect.vue'
+import { useComposants } from '~/composables/useComposants'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue?: string | null
+    placeholder?: string
+    emptyText?: string
+    helperText?: string
+    disabled?: boolean
+    typeComposantId?: string | null
+  }>(),
+  {
+    modelValue: '',
+    placeholder: 'Sélectionner un composant…',
+    emptyText: 'Aucun composant disponible',
+    helperText: '',
+    disabled: false,
+    typeComposantId: null,
+  },
+)
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: string | null): void
+}>()
+
+const { loading: globalLoading, loadComposants } = useComposants()
+
+const localComposants = ref<any[]>([])
+const localLoading = ref(false)
+const loading = computed(() => localLoading.value || globalLoading.value)
+
+const composantOptions = computed(() => localComposants.value)
+
+const loadFilteredComposants = async () => {
+  if (!props.typeComposantId) return
+  localLoading.value = true
+  try {
+    const result = await loadComposants({ typeComposantId: props.typeComposantId, itemsPerPage: 500, force: true })
+    if (result.success && result.data?.items) {
+      localComposants.value = result.data.items
+    }
+  }
+  catch (error: unknown) {
+    console.error('Erreur lors du chargement des composants:', error)
+  }
+  finally {
+    localLoading.value = false
+  }
+}
+
+onMounted(() => {
+  loadFilteredComposants()
+})
+
+watch(
+  () => props.typeComposantId,
+  () => {
+    loadFilteredComposants()
+  },
+)
+
+const updateValue = (value: string | number | null | undefined) => {
+  if (value === undefined || value === null || value === '') {
+    emit('update:modelValue', null)
+    return
+  }
+  emit('update:modelValue', String(value))
+}
+
+const formatDescription = (option: any) => {
+  const parts: string[] = []
+  const typeName = option?.typeComposant?.name
+  if (typeName) {
+    parts.push(typeName)
+  }
+  if (option?.reference) {
+    parts.push(`Ref. ${option.reference}`)
+  }
+  if (option?.prix !== undefined && option.prix !== null) {
+    const price = Number(option.prix)
+    if (!Number.isNaN(price)) {
+      parts.push(`${price.toFixed(2)} €`)
+    }
+  }
+  return parts.length ? parts.join(' • ') : 'Sans référence'
+}
+</script>

app/components/DocumentEditModal.vue

@@ -0,0 +1,90 @@
+<template>
+  <Teleport to="body">
+    <div v-if="visible" class="modal modal-open" @click.self="$emit('close')">
+      <div class="modal-box max-w-sm">
+        <h3 class="font-bold text-lg mb-4">
+          Modifier le document
+        </h3>
+
+        <div class="space-y-4">
+          <label class="form-control w-full">
+            <div class="label">
+              <span class="label-text">Nom</span>
+            </div>
+            <input
+              v-model="form.name"
+              type="text"
+              class="input input-bordered input-sm md:input-md w-full"
+            >
+          </label>
+
+          <label class="form-control w-full">
+            <div class="label">
+              <span class="label-text">Type</span>
+            </div>
+            <select
+              v-model="form.type"
+              class="select select-bordered select-sm md:select-md w-full"
+            >
+              <option v-for="t in DOCUMENT_TYPES" :key="t.value" :value="t.value">
+                {{ t.label }}
+              </option>
+            </select>
+          </label>
+        </div>
+
+        <div class="modal-action">
+          <button type="button" class="btn btn-ghost btn-sm md:btn-md" @click="$emit('close')">
+            Annuler
+          </button>
+          <button
+            type="button"
+            class="btn btn-primary btn-sm md:btn-md"
+            :disabled="saving"
+            @click="save"
+          >
+            <span v-if="saving" class="loading loading-spinner loading-xs" />
+            Sauvegarder
+          </button>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { reactive, watch, ref } from 'vue'
+import { DOCUMENT_TYPES } from '~/shared/documentTypes'
+import type { Document } from '~/composables/useDocuments'
+
+const props = defineProps<{
+  visible: boolean
+  document: Document | null
+}>()
+
+const emit = defineEmits<{
+  (e: 'close'): void
+  (e: 'updated', data: { name: string; type: string }): void
+}>()
+
+const form = reactive({ name: '', type: 'documentation' })
+const saving = ref(false)
+
+watch(
+  () => props.document,
+  (doc) => {
+    if (doc) {
+      form.name = doc.name || ''
+      form.type = doc.type || 'documentation'
+    }
+  },
+  { immediate: true },
+)
+
+const save = () => {
+  if (!form.name.trim()) return
+  saving.value = true
+  emit('updated', { name: form.name.trim(), type: form.type })
+  saving.value = false
+}
+</script>

app/components/DocumentUpload.vue

@@ -34,6 +34,21 @@
         @change="onFileChange"
       >
 
+      <div class="w-full max-w-xs mt-2">
+        <label class="text-xs font-semibold uppercase tracking-wide text-base-content/70">
+          Type de document
+        </label>
+        <select
+          class="select select-bordered select-sm w-full mt-1"
+          :value="documentType"
+          @change="emit('update:documentType', $event.target.value)"
+        >
+          <option v-for="t in DOCUMENT_TYPES" :key="t.value" :value="t.value">
+            {{ t.label }}
+          </option>
+        </select>
+      </div>
+
       <ul v-if="selectedFiles.length" class="mt-4 w-full space-y-2 text-left">
         <li v-for="file in selectedFiles" :key="file.name" class="flex items-center justify-between text-sm">
           <div class="flex items-center gap-3">
@@ -69,6 +84,7 @@
 <script setup>
 import { ref, computed, watch, onBeforeUnmount } from 'vue'
 import { useToast } from '~/composables/useToast'
+import { DOCUMENT_TYPES } from '~/shared/documentTypes'
 import { getFileIcon } from '~/utils/fileIcons'
 import IconLucideCloudUpload from '~icons/lucide/cloud-upload'
 
@@ -96,10 +112,14 @@ const props = defineProps({
   maxFileSizeMb: {
     type: Number,
     default: 200
+  },
+  documentType: {
+    type: String,
+    default: 'documentation'
   }
 })
 
-const emit = defineEmits(['update:modelValue', 'files-added'])
+const emit = defineEmits(['update:modelValue', 'files-added', 'update:documentType'])
 
 const dragActive = ref(false)
 const fileInput = ref(null)

app/components/PieceItem.vue

@@ -6,6 +6,12 @@
       :documents="pieceDocuments"
       @close="closePreview"
     />
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
 
     <!-- Piece Header (collapsible, same pattern as ComponentItem) -->
     <div class="flex items-start justify-between p-4 bg-base-200 rounded-lg">
@@ -24,6 +30,12 @@
         <div class="flex-1 min-w-0">
           <h3 class="text-lg font-semibold">
             {{ pieceData.name }}
+            <span
+              v-if="displayQuantity > 1"
+              class="text-sm font-normal text-base-content/60 ml-1"
+            >
+              ×{{ displayQuantity }}
+            </span>
           </h3>
           <div class="flex flex-wrap gap-2 mt-2">
             <span v-if="piece.parentComponentName" class="badge badge-ghost badge-sm">
@@ -63,6 +75,23 @@
     <div v-show="!isCollapsed" class="space-y-4">
       <div class="p-4 bg-base-100 border border-base-200 rounded-lg">
         <div class="space-y-2 text-sm">
+      <div v-if="isEditMode" class="form-control">
+        <label class="label">
+          <span class="label-text text-sm">Quantité</span>
+        </label>
+        <input
+          v-model.number="pieceData.quantity"
+          type="number"
+          min="1"
+          step="1"
+          class="input input-bordered input-sm md:input-md w-24"
+          @blur="updatePiece"
+        />
+      </div>
+      <div v-else-if="displayQuantity > 1">
+        <span class="font-medium">Quantité:</span>
+        <span class="ml-2">{{ displayQuantity }}</span>
+      </div>
       <div>
         <span class="font-medium">Référence:</span>
         <input
@@ -224,9 +253,11 @@
       <DocumentListInline
         :documents="pieceDocuments"
         :can-delete="isEditMode"
+        :can-edit="isEditMode"
         :delete-disabled="uploadingDocuments"
         empty-text="Aucun document lié à cette pièce."
         @preview="openPreview"
+        @edit="openEditModal"
         @delete="removeDocument"
       />
     </div>
@@ -272,6 +303,11 @@ const pieceData = reactive({
   reference: props.piece.reference || '',
   prix: props.piece.prix || '',
   productId: props.piece.product?.id || props.piece.productId || null,
+  quantity: props.piece.quantity ?? 1,
+})
+
+const displayQuantity = computed(() => {
+  return pieceData.quantity ?? 1
 })
 
 // --- Products ---
@@ -301,6 +337,7 @@ const {
   refreshDocuments,
   handleFilesAdded,
   removeDocument,
+  editDocument,
 } = useEntityDocuments({ entity: () => props.piece, entityType: 'piece' })
 
 const {
@@ -315,6 +352,21 @@ const {
   updateCustomField,
 } = useEntityCustomFields({ entity: () => props.piece, entityType: 'piece' })
 
+// --- Document edit modal ---
+const editingDocument = ref(null)
+const editModalVisible = ref(false)
+
+const openEditModal = (doc) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+const handleDocumentUpdated = async (data) => {
+  if (!editingDocument.value?.id) return
+  await editDocument(editingDocument.value.id, data)
+  editModalVisible.value = false
+  editingDocument.value = null
+}
+
 // --- Collapse state ---
 const isCollapsed = ref(true)
 
@@ -432,13 +484,14 @@ const updatePiece = () => {
   let parsedPrice = null
   if (prixValue !== null && prixValue !== undefined && String(prixValue).trim().length > 0) {
     const numeric = Number(prixValue)
-    if (!Number.isNaN(numeric)) parsedPrice = numeric
+    if (!Number.isNaN(numeric)) parsedPrice = String(numeric)
   }
   const product = selectedProduct.value ? { ...selectedProduct.value } : null
   emit('update', {
     ...props.piece,
     ...pieceData,
     prix: parsedPrice,
+    quantity: pieceData.quantity ?? 1,
     productId: pieceData.productId || null,
     product,
     constructeurIds: pieceConstructeurIds.value,
@@ -478,11 +531,12 @@ watch(
 )
 
 watch(
-  () => [props.piece.name, props.piece.reference, props.piece.prix],
+  () => [props.piece.name, props.piece.reference, props.piece.prix, props.piece.quantity],
   () => {
     pieceData.name = props.piece.name || ''
     pieceData.reference = props.piece.reference || ''
     pieceData.prix = props.piece.prix || ''
+    pieceData.quantity = props.piece.quantity ?? 1
   },
 )
 
@@ -490,6 +544,7 @@ onMounted(() => {
   pieceData.name = props.piece.name || ''
   pieceData.reference = props.piece.reference || ''
   pieceData.prix = props.piece.prix || ''
+  pieceData.quantity = props.piece.quantity ?? 1
   loadProducts().catch(() => {})
   if (pieceData.productId) ensureProductLoaded(pieceData.productId)
   if (!props.piece.documents?.length) refreshDocuments()

app/components/PieceModelStructureEditor.vue

@@ -29,7 +29,6 @@
                 <select
                   v-model="product.typeProductId"
                   class="select select-bordered select-xs"
-                  :disabled="isProductLocked(product)"
                   @change="handleProductTypeSelect(product)"
                 >
                   <option value="">
@@ -46,26 +45,16 @@
               </div>
             </div>
             <button
-              v-if="!isProductLocked(product)"
               type="button"
               class="btn btn-error btn-xs btn-square"
               @click="removeProduct(index)"
             >
               <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
             </button>
-            <div v-else class="tooltip tooltip-left" data-tip="Ce produit ne peut pas être supprimé car des éléments utilisent cette catégorie">
-              <button
-                type="button"
-                class="btn btn-ghost btn-xs btn-square opacity-30 cursor-not-allowed"
-                disabled
-              >
-                <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
-              </button>
-            </div>
           </div>
         </li>
       </ul>
-      <button v-if="!restrictedMode" type="button" class="btn btn-outline btn-xs" @click="addProduct">
+      <button type="button" class="btn btn-outline btn-xs" @click="addProduct">
         <IconLucidePlus class="w-3 h-3 mr-2" aria-hidden="true" />
         Ajouter
       </button>
@@ -111,7 +100,7 @@
                   class="input input-bordered input-xs"
                   placeholder="Nom du champ"
                 >
-                <select v-model="field.type" class="select select-bordered select-xs" :disabled="isFieldLocked(field)">
+                <select v-model="field.type" class="select select-bordered select-xs">
                   <option value="text">
                     Texte
                   </option>
@@ -131,7 +120,7 @@
               </div>
 
               <div class="flex items-center gap-2 text-xs">
-                <input v-model="field.required" type="checkbox" class="checkbox checkbox-xs" :disabled="isFieldLocked(field)">
+                <input v-model="field.required" type="checkbox" class="checkbox checkbox-xs">
                 Obligatoire
               </div>
 
@@ -140,27 +129,16 @@
                 v-model="field.optionsText"
                 class="textarea textarea-bordered textarea-xs h-20"
                 placeholder="Option 1&#10;Option 2"
-                :disabled="isFieldLocked(field)"
               />
             </div>
 
             <button
-              v-if="!isFieldLocked(field)"
               type="button"
               class="btn btn-error btn-xs btn-square"
               @click="removeField(index)"
             >
               <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
             </button>
-            <div v-else class="tooltip tooltip-left" data-tip="Ce champ ne peut pas être supprimé car des éléments utilisent cette catégorie">
-              <button
-                type="button"
-                class="btn btn-ghost btn-xs btn-square opacity-30 cursor-not-allowed"
-                disabled
-              >
-                <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
-              </button>
-            </div>
           </div>
         </li>
       </ul>
@@ -183,7 +161,6 @@ defineOptions({ name: 'PieceModelStructureEditor' })
 
 const props = defineProps<{
   modelValue?: PieceModelStructure | null
-  restrictedMode?: boolean
 }>()
 
 const emit = defineEmits<{
@@ -194,9 +171,6 @@ const {
   fields,
   products,
   productTypeOptions,
-  restrictedMode,
-  isFieldLocked,
-  isProductLocked,
   formatProductTypeOption,
   handleProductTypeSelect,
   addProduct,

app/components/PieceSelect.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="space-y-1">
+    <SearchSelect
+      :model-value="modelValue ?? undefined"
+      :options="pieceOptions"
+      :loading="loading"
+      :placeholder="placeholder"
+      :empty-text="emptyText"
+      size="sm"
+      option-value="id"
+      option-label="name"
+      :disabled="disabled"
+      @update:modelValue="updateValue"
+    >
+      <template #option-description="{ option }">
+        <span class="text-xs text-base-content/60">
+          {{ formatDescription(option) }}
+        </span>
+      </template>
+    </SearchSelect>
+    <p v-if="helperText" class="text-xs text-base-content/60">
+      {{ helperText }}
+    </p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue'
+import SearchSelect from '~/components/common/SearchSelect.vue'
+import { usePieces } from '~/composables/usePieces'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue?: string | null
+    placeholder?: string
+    emptyText?: string
+    helperText?: string
+    disabled?: boolean
+    typePieceId?: string | null
+  }>(),
+  {
+    modelValue: '',
+    placeholder: 'Sélectionner une pièce…',
+    emptyText: 'Aucune pièce disponible',
+    helperText: '',
+    disabled: false,
+    typePieceId: null,
+  },
+)
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: string | null): void
+}>()
+
+const { loading: globalLoading, loadPieces } = usePieces()
+
+const localPieces = ref<any[]>([])
+const localLoading = ref(false)
+const loading = computed(() => localLoading.value || globalLoading.value)
+
+const pieceOptions = computed(() => localPieces.value)
+
+const loadFilteredPieces = async () => {
+  if (!props.typePieceId) return
+  localLoading.value = true
+  try {
+    const result = await loadPieces({ typePieceId: props.typePieceId, itemsPerPage: 500, force: true })
+    if (result.success && result.data?.items) {
+      localPieces.value = result.data.items
+    }
+  }
+  catch (error: unknown) {
+    console.error('Erreur lors du chargement des pièces:', error)
+  }
+  finally {
+    localLoading.value = false
+  }
+}
+
+onMounted(() => {
+  loadFilteredPieces()
+})
+
+watch(
+  () => props.typePieceId,
+  () => {
+    loadFilteredPieces()
+  },
+)
+
+const updateValue = (value: string | number | null | undefined) => {
+  if (value === undefined || value === null || value === '') {
+    emit('update:modelValue', null)
+    return
+  }
+  emit('update:modelValue', String(value))
+}
+
+const formatDescription = (option: any) => {
+  const parts: string[] = []
+  const typeName = option?.typePiece?.name
+  if (typeName) {
+    parts.push(typeName)
+  }
+  if (option?.reference) {
+    parts.push(`Ref. ${option.reference}`)
+  }
+  if (option?.prix !== undefined && option.prix !== null) {
+    const price = Number(option.prix)
+    if (!Number.isNaN(price)) {
+      parts.push(`${price.toFixed(2)} €`)
+    }
+  }
+  return parts.length ? parts.join(' • ') : 'Sans référence'
+}
+</script>

app/components/ProductSelect.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, watch } from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import SearchSelect from '~/components/common/SearchSelect.vue'
 import { useProducts } from '~/composables/useProducts'
 
@@ -52,43 +52,39 @@ const emit = defineEmits<{
   (e: 'update:modelValue', value: string | null): void
 }>()
 
-const { products, loading, loadProducts } = useProducts()
+const { loading: globalLoading, loadProducts } = useProducts()
 
-const productOptions = computed(() => {
+const localProducts = ref<any[]>([])
-  const baseOptions = Array.isArray(products.value) ? products.value : []
+const localLoading = ref(false)
-  if (!props.typeProductId) {
+const loading = computed(() => localLoading.value || globalLoading.value)
-    return baseOptions
+
+const productOptions = computed(() => localProducts.value)
+
+const loadFilteredProducts = async () => {
+  if (!props.typeProductId) return
+  localLoading.value = true
+  try {
+    const result = await loadProducts({ typeProductId: props.typeProductId, itemsPerPage: 500, force: true })
+    if (result.success && result.data?.items) {
+      localProducts.value = result.data.items
+    }
   }
-
+  catch (error: unknown) {
-  const allowedTypeId = String(props.typeProductId)
+    console.error('Erreur lors du chargement des produits:', error)
-  return baseOptions.filter((product) => {
+  }
-    const typeId =
+  finally {
-      product?.typeProductId ||
+    localLoading.value = false
-      product?.typeProduct?.id ||
+  }
-      null
+}
-    return typeId ? String(typeId) === allowedTypeId : false
-  })
-})
 
 onMounted(() => {
-  if (productOptions.value.length === 0) {
+  loadFilteredProducts()
-    loadProducts().catch((error) => {
-      console.error('Erreur lors du chargement des produits:', error)
-    })
-  }
 })
 
 watch(
-  () => props.modelValue,
+  () => props.typeProductId,
-  (value) => {
+  () => {
-    if (typeof value === 'string') {
+    loadFilteredProducts()
-      const exists = productOptions.value.some((product) => product.id === value)
-      if (!exists && productOptions.value.length === 0 && !loading.value) {
-        loadProducts().catch((error) => {
-          console.error('Erreur lors du chargement des produits:', error)
-        })
-      }
-    }
   },
 )
 
@@ -102,8 +98,12 @@ const updateValue = (value: string | number | null | undefined) => {
 
 const formatDescription = (option: any) => {
   const parts: string[] = []
+  const typeName = option?.typeProduct?.name
+  if (typeName) {
+    parts.push(typeName)
+  }
   if (option?.reference) {
-    parts.push(option.reference)
+    parts.push(`Ref. ${option.reference}`)
   }
   if (option?.supplierPrice !== undefined && option.supplierPrice !== null) {
     const price = Number(option.supplierPrice)

app/components/StructureNodeEditor.vue

@@ -109,7 +109,7 @@
                       class="input input-bordered input-xs"
                       placeholder="Nom du champ"
                     />
-                    <select v-model="field.type" class="select select-bordered select-xs" :disabled="isCustomFieldLocked(index)">
+                    <select v-model="field.type" class="select select-bordered select-xs">
                       <option value="text">Texte</option>
                       <option value="number">Nombre</option>
                       <option value="select">Liste</option>
@@ -118,7 +118,7 @@
                     </select>
                   </div>
                   <div class="flex items-center gap-2 text-xs">
-                    <input v-model="field.required" type="checkbox" class="checkbox checkbox-xs" :disabled="isCustomFieldLocked(index)" />
+                    <input v-model="field.required" type="checkbox" class="checkbox checkbox-xs" />
                     Obligatoire
                   </div>
                   <textarea
@@ -126,26 +126,15 @@
                     v-model="field.optionsText"
                     class="textarea textarea-bordered textarea-xs h-20"
                     placeholder="Option 1&#10;Option 2"
-                    :disabled="isCustomFieldLocked(index)"
                   ></textarea>
                 </div>
                 <button
-                  v-if="!isCustomFieldLocked(index)"
                   type="button"
                   class="btn btn-error btn-xs btn-square"
                   @click="removeCustomField(index)"
                 >
                   <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
                 </button>
-                <div v-else class="tooltip tooltip-left" data-tip="Ce champ ne peut pas être supprimé car des éléments utilisent cette catégorie">
-                  <button
-                    type="button"
-                    class="btn btn-ghost btn-xs btn-square opacity-30 cursor-not-allowed"
-                    disabled
-                  >
-                    <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
-                  </button>
-                </div>
               </div>
             </div>
           </div>
@@ -189,7 +178,6 @@
                     <select
                       v-model="product.typeProductId"
                       class="select select-bordered select-xs"
-                      :disabled="isProductLocked(index)"
                       @change="handleProductTypeSelect(product)"
                     >
                       <option value="">
@@ -205,22 +193,13 @@
                     </select>
                   </div>
                 </div>
-                <button v-if="!isProductLocked(index)" type="button" class="btn btn-error btn-xs btn-square" @click="removeProduct(index)">
+                <button type="button" class="btn btn-error btn-xs btn-square" @click="removeProduct(index)">
                   <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
                 </button>
-                <div v-else class="tooltip tooltip-left" data-tip="Ce produit ne peut pas être supprimé car des éléments utilisent cette catégorie">
-                  <button
-                    type="button"
-                    class="btn btn-ghost btn-xs btn-square opacity-30 cursor-not-allowed"
-                    disabled
-                  >
-                    <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
-                  </button>
-                </div>
               </div>
             </div>
           </div>
-          <button v-if="!restrictedMode" type="button" class="btn btn-outline btn-xs" @click="addProduct">
+          <button type="button" class="btn btn-outline btn-xs" @click="addProduct">
             <IconLucidePlus class="w-3 h-3 mr-2" aria-hidden="true" />
             Ajouter
           </button>
@@ -261,7 +240,6 @@
                       <select
                         v-model="piece.typePieceId"
                         class="select select-bordered select-xs"
-                        :disabled="isPieceLocked(index)"
                         @change="handlePieceTypeSelect(piece)"
                       >
                         <option value="">
@@ -280,19 +258,15 @@
                       {{ piece.typePieceId ? `Sélection : ${getPieceTypeLabel(piece.typePieceId) || 'Inconnue'}` : 'Aucune famille sélectionnée' }}
                     </p>
                   </div>
+                  <!-- Quantity is set per-component on the component edit page -->
                 </div>
-                <button v-if="!isPieceLocked(index)" type="button" class="btn btn-error btn-xs btn-square" @click="removePiece(index)">
+                <button type="button" class="btn btn-error btn-xs btn-square" @click="removePiece(index)">
                   <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
                 </button>
-                <div v-else class="tooltip tooltip-left" data-tip="Cette pièce ne peut pas être supprimée">
-                  <button type="button" class="btn btn-ghost btn-xs btn-square opacity-30 cursor-not-allowed" disabled>
-                    <IconLucideTrash class="w-4 h-4" aria-hidden="true" />
-                  </button>
-                </div>
               </div>
             </div>
           </div>
-          <button v-if="!restrictedMode" type="button" class="btn btn-outline btn-xs" @click="addPiece">
+          <button type="button" class="btn btn-outline btn-xs" @click="addPiece">
             <IconLucidePlus class="w-3 h-3 mr-2" aria-hidden="true" />
             Ajouter
           </button>
@@ -334,14 +308,12 @@
                 :product-types="productTypes"
                 :allow-subcomponents="childAllowSubcomponents"
                 :max-subcomponent-depth="maxSubcomponentDepth"
-                :restricted-mode="restrictedMode"
-                :is-locked="isSubcomponentLocked(index)"
                 @remove="removeSubComponent(index)"
               />
             </div>
           </div>
           <button
-            v-if="canManageSubcomponents && !restrictedMode"
+            v-if="canManageSubcomponents"
             type="button"
             class="btn btn-outline btn-xs"
             @click="addSubComponent"
@@ -374,7 +346,6 @@ const props = withDefaults(defineProps<{
   lockedTypeLabel?: string
   allowSubcomponents?: boolean
   maxSubcomponentDepth?: number
-  restrictedMode?: boolean
   isLocked?: boolean
 }>(), {
   depth: 0,
@@ -386,19 +357,13 @@ const props = withDefaults(defineProps<{
   lockedTypeLabel: '',
   allowSubcomponents: true,
   maxSubcomponentDepth: Infinity,
-  restrictedMode: false,
   isLocked: false,
 })
 
 const emit = defineEmits(['remove'])
 
 const {
-  isCustomFieldLocked,
-  isPieceLocked,
-  isProductLocked,
-  isSubcomponentLocked,
   isLocked,
-  restrictedMode,
   componentTypes,
   pieceTypes,
   productTypes,

app/components/SyncConfirmationModal.vue

@@ -0,0 +1,112 @@
+<script setup lang="ts">
+import type { SyncPreviewResult } from '~/services/modelTypes';
+
+const props = defineProps<{
+  preview: SyncPreviewResult | null;
+  open: boolean;
+  loading: boolean;
+}>();
+
+const emit = defineEmits<{
+  confirm: [];
+  cancel: [];
+}>();
+
+const dialogRef = ref<HTMLDialogElement>();
+
+watch(() => props.open, (isOpen) => {
+  if (isOpen) {
+    dialogRef.value?.showModal();
+  }
+  else {
+    dialogRef.value?.close();
+  }
+});
+
+const hasDeletions = computed(() => {
+  if (!props.preview) return false;
+  return Object.values(props.preview.deletions).some(v => v > 0);
+});
+
+const hasModifications = computed(() => {
+  if (!props.preview) return false;
+  return Object.values(props.preview.modifications).some(v => v > 0);
+});
+
+const totalAdditions = computed(() => {
+  if (!props.preview) return 0;
+  return Object.values(props.preview.additions).reduce((sum, v) => sum + v, 0);
+});
+
+const totalDeletions = computed(() => {
+  if (!props.preview) return 0;
+  return Object.values(props.preview.deletions).reduce((sum, v) => sum + v, 0);
+});
+
+const totalModifications = computed(() => {
+  if (!props.preview) return 0;
+  return Object.values(props.preview.modifications).reduce((sum, v) => sum + v, 0);
+});
+
+function handleCancel() {
+  emit('cancel');
+}
+
+function handleConfirm() {
+  emit('confirm');
+}
+</script>
+
+<template>
+  <dialog ref="dialogRef" class="modal" @close="handleCancel">
+    <div class="modal-box">
+      <h3 class="text-lg font-bold">
+        Synchronisation des éléments liés
+      </h3>
+
+      <div v-if="preview" class="py-4 space-y-3">
+        <p>
+          Cette modification impactera
+          <strong>{{ preview.itemCount }}</strong>
+          élément(s) lié(s).
+        </p>
+
+        <ul class="list-disc list-inside space-y-1">
+          <li v-if="totalAdditions > 0" class="text-success">
+            {{ totalAdditions }} ajout(s)
+          </li>
+          <li v-if="totalDeletions > 0" class="text-error">
+            {{ totalDeletions }} suppression(s)
+          </li>
+          <li v-if="totalModifications > 0" class="text-warning">
+            {{ totalModifications }} modification(s)
+          </li>
+        </ul>
+
+        <div v-if="hasDeletions" role="alert" class="alert alert-warning">
+          <span>Des éléments seront supprimés. Cette action est irréversible.</span>
+        </div>
+
+        <div v-if="hasModifications" role="alert" class="alert alert-info">
+          <span>Des valeurs de champs personnalisés seront réinitialisées.</span>
+        </div>
+      </div>
+
+      <div class="modal-action">
+        <button class="btn btn-ghost" :disabled="loading" @click="handleCancel">
+          Annuler
+        </button>
+        <button class="btn btn-primary" :disabled="loading" @click="handleConfirm">
+          <span v-if="loading" class="loading loading-spinner loading-sm" />
+          Confirmer la synchronisation
+        </button>
+      </div>
+    </div>
+
+    <form method="dialog" class="modal-backdrop">
+      <button @click="handleCancel">
+        close
+      </button>
+    </form>
+  </dialog>
+</template>

app/components/common/DocumentListInline.vue

@@ -31,8 +31,9 @@
           />
         </div>
         <div>
-          <div class="font-medium">
+          <div class="font-medium flex items-center gap-2">
             {{ document.name }}
+            <span class="badge badge-sm badge-outline">{{ getDocumentTypeLabel(document.type || 'documentation') }}</span>
           </div>
           <div class="text-xs text-base-content/70">
             {{ document.mimeType || 'Inconnu' }} • {{ formatSize(document.size) }}
@@ -40,6 +41,15 @@
         </div>
       </div>
       <div class="flex items-center gap-2">
+        <button
+          v-if="canEdit"
+          type="button"
+          class="btn btn-ghost btn-xs"
+          title="Modifier"
+          @click="$emit('edit', document)"
+        >
+          Modifier
+        </button>
         <button
           type="button"
           class="btn btn-ghost btn-xs"
@@ -74,6 +84,7 @@
 </template>
 
 <script setup lang="ts">
+import { getDocumentTypeLabel } from '~/shared/documentTypes'
 import { canPreviewDocument, isImageDocument } from '~/utils/documentPreview'
 import {
   documentIcon,
@@ -89,10 +100,12 @@ import type { Document } from '~/composables/useDocuments'
 withDefaults(defineProps<{
   documents: Document[]
   canDelete?: boolean
+  canEdit?: boolean
   deleteDisabled?: boolean
   emptyText?: string
 }>(), {
   canDelete: false,
+  canEdit: false,
   deleteDisabled: false,
   emptyText: 'Aucun document.',
 })
@@ -100,5 +113,6 @@ withDefaults(defineProps<{
 defineEmits<{
   (e: 'preview', document: Document): void
   (e: 'delete', documentId: string): void
+  (e: 'edit', document: Document): void
 }>()
 </script>

app/components/common/SearchSelect.vue

@@ -69,7 +69,7 @@
                     {{ resolveLabel(option) }}
                   </slot>
                 </span>
-                <span v-if="resolveDescription(option)" class="text-xs text-base-content/50">
+                <span v-if="$slots['option-description'] || resolveDescription(option)" class="text-xs text-base-content/50">
                   <slot name="option-description" :option="option">
                     {{ resolveDescription(option) }}
                   </slot>

app/components/machine/MachineInfoCard.vue

@@ -72,23 +72,23 @@
             placeholder="Rechercher un ou plusieurs fournisseurs..."
             @update:modelValue="$emit('update:constructeur-ids', $event)"
           />
-          <div v-else class="input input-bordered bg-base-200">
+          <div v-else class="border border-base-300 rounded-btn bg-base-200 px-4 py-2 min-h-12 flex items-center">
-            <div v-if="machineConstructeursDisplay.length" class="space-y-1">
+            <div v-if="machineConstructeursDisplay.length" class="flex flex-wrap gap-2">
-              <div
+              <span
                 v-for="constructeur in machineConstructeursDisplay"
                 :key="constructeur.id"
-                class="flex flex-col"
+                class="badge badge-ghost gap-1"
               >
-                <span class="font-medium">{{ constructeur.name }}</span>
+                {{ constructeur.name }}
                 <span
                   v-if="formatConstructeurContactSummary(constructeur)"
-                  class="text-xs text-base-content/50"
+                  class="text-xs opacity-60"
                 >
-                  {{ formatConstructeurContactSummary(constructeur) }}
+                  · {{ formatConstructeurContactSummary(constructeur) }}
                 </span>
-              </div>
+              </span>
             </div>
-            <span v-else class="font-medium">Non défini</span>
+            <span v-else class="text-base-content/50">Non défini</span>
           </div>
         </div>
       </div>

app/components/machine/MachinePiecesCard.vue

@@ -28,10 +28,11 @@
         <div v-for="piece in pieces" :key="piece.id">
           <PieceItem
             :piece="piece"
-            :is-edit-mode="false"
+            :is-edit-mode="isEditMode"
             :show-delete="isEditMode"
             :collapse-all="collapsed"
             :toggle-token="collapseToggleToken"
+            @update="$emit('update-piece', $event)"
             @edit="$emit('edit-piece', $event)"
             @delete="$emit('remove-piece', piece.linkId || piece.id)"
           />
@@ -62,6 +63,7 @@ defineProps<{
 
 defineEmits<{
   'toggle-collapse': []
+  'update-piece': [piece: any]
   'edit-piece': [piece: any]
   'add-piece': []
   'remove-piece': [linkId: string]

app/components/model-types/ModelTypeForm.vue

@@ -15,8 +15,7 @@
           minlength="2"
           maxlength="120"
           required
-          :disabled="restrictedMode"
+          />
-        />
         <p v-if="errors.name" class="mt-1 text-sm text-error">{{ errors.name }}</p>
       </div>
       <div>
@@ -48,7 +47,6 @@
           rows="4"
           name="notes"
           maxlength="2000"
-          :disabled="restrictedMode"
         ></textarea>
         <p class="mt-1 text-xs text-base-content/70">Saisissez des informations complémentaires (facultatif).</p>
       </div>
@@ -83,7 +81,6 @@
             v-model="componentStructure"
             :allow-subcomponents="allowComponentSubcomponents"
             :max-subcomponent-depth="componentSubcomponentMaxDepth"
-            :restricted-mode="restrictedMode"
           />
         </div>
 
@@ -95,7 +92,7 @@
             Aperçu :
             <span class="font-medium text-base-content">{{ pieceStructurePreview }}</span>
           </p>
-          <PieceModelStructureEditor v-model="pieceStructure" :restricted-mode="restrictedMode" />
+          <PieceModelStructureEditor v-model="pieceStructure" />
         </div>
 
         <div
@@ -106,30 +103,11 @@
             Aperçu :
             <span class="font-medium text-base-content">{{ productStructurePreview }}</span>
           </p>
-          <PieceModelStructureEditor v-model="productStructure" :restricted-mode="restrictedMode" />
+          <PieceModelStructureEditor v-model="productStructure" />
         </div>
       </template>
     </section>
 
-    <div
-      v-if="restrictedMode && restrictedModeMessage"
-      class="alert alert-info"
-      role="status"
-      aria-live="polite"
-    >
-      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-6 h-6"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
-      <span>{{ restrictedModeMessage }}</span>
-    </div>
-
-    <div
-      v-if="disableSubmit"
-      class="alert alert-warning"
-      role="alert"
-      aria-live="polite"
-    >
-      <span>{{ disableSubmitMessage }}</span>
-    </div>
-
     <footer class="flex flex-col gap-3 border-t border-base-300 pt-4 sm:flex-row sm:justify-end">
       <button type="button" class="btn btn-ghost" :disabled="saving" @click="emit('cancel')">
         Annuler
@@ -172,10 +150,6 @@ const props = withDefaults(defineProps<{
   structureLoading?: boolean
   allowComponentSubcomponents?: boolean
   componentSubcomponentMaxDepth?: number
-  disableSubmit?: boolean
-  disableSubmitMessage?: string
-  restrictedMode?: boolean
-  restrictedModeMessage?: string
   readonly?: boolean
 }>(), {
   initialData: null,
@@ -184,10 +158,6 @@ const props = withDefaults(defineProps<{
   structureLoading: false,
   allowComponentSubcomponents: true,
   componentSubcomponentMaxDepth: 1,
-  disableSubmit: false,
-  disableSubmitMessage: '',
-  restrictedMode: false,
-  restrictedModeMessage: '',
   readonly: false,
 })
 
@@ -205,19 +175,7 @@ const componentSubcomponentMaxDepth = computed(() =>
     ? props.componentSubcomponentMaxDepth
     : 1,
 )
-const disableSubmit = computed(() => props.disableSubmit === true)
-const disableSubmitMessage = computed(() =>
-  (props.disableSubmitMessage && props.disableSubmitMessage.trim())
-    ? props.disableSubmitMessage
-    : 'Cette catégorie ne peut pas être modifiée car des éléments y sont déjà liés.',
-)
 const isReadonly = computed(() => props.readonly === true)
-const restrictedMode = computed(() => props.restrictedMode === true || isReadonly.value)
-const restrictedModeMessage = computed(() =>
-  (props.restrictedModeMessage && props.restrictedModeMessage.trim())
-    ? props.restrictedModeMessage
-    : '',
-)
 
 const form = reactive<ModelTypePayload>({
   name: '',
@@ -294,7 +252,7 @@ const resetForm = () => {
 }
 
 const submitLabel = computed(() => (props.mode === 'edit' ? 'Enregistrer' : 'Créer'))
-const isSubmitDisabled = computed(() => saving.value || structureLoading.value || disableSubmit.value || isReadonly.value)
+const isSubmitDisabled = computed(() => saving.value || structureLoading.value || isReadonly.value)
 
 const validate = () => {
   errors.name = undefined

app/composables/useCategoryEditGuard.ts

@@ -1,114 +0,0 @@
-import { computed, ref } from 'vue'
-import { useApi } from '~/composables/useApi'
-import { useToast } from '~/composables/useToast'
-
-type GuardLabels = {
-  singular: string
-  plural: string
-  verifying: string
-}
-
-type GuardConfig = {
-  endpoint: string
-  filterKey: string
-  labels: GuardLabels
-}
-
-const extractTotal = (payload: any, fallbackLength: number) => {
-  if (typeof payload?.totalItems === 'number') {
-    return payload.totalItems
-  }
-  if (typeof payload?.['hydra:totalItems'] === 'number') {
-    return payload['hydra:totalItems']
-  }
-  if (Array.isArray(payload?.member)) {
-    return payload.member.length
-  }
-  if (Array.isArray(payload?.['hydra:member'])) {
-    return payload['hydra:member'].length
-  }
-  return fallbackLength
-}
-
-export function useCategoryEditGuard (config: GuardConfig) {
-  const { get } = useApi()
-  const { showInfo } = useToast()
-
-  const linkedCount = ref(0)
-  const linkedLoading = ref(false)
-
-  const loadLinkedCount = async (modelTypeId: string) => {
-    linkedLoading.value = true
-    try {
-      const params = new URLSearchParams()
-      params.set('itemsPerPage', '1')
-      params.set(config.filterKey, `/api/model_types/${modelTypeId}`)
-
-      const result = await get(`${config.endpoint}?${params.toString()}`)
-      if (!result.success) {
-        linkedCount.value = 0
-        return
-      }
-
-      const fallbackLength = Array.isArray(result.data?.member)
-        ? result.data.member.length
-        : Array.isArray(result.data?.['hydra:member'])
-          ? result.data['hydra:member'].length
-          : 0
-
-      linkedCount.value = extractTotal(result.data, fallbackLength)
-    } catch (_error) {
-      linkedCount.value = 0
-    } finally {
-      linkedLoading.value = false
-    }
-  }
-
-  const isRestrictedMode = computed(
-    () => !linkedLoading.value && linkedCount.value > 0,
-  )
-
-  const isSubmitBlocked = computed(
-    () => linkedLoading.value,
-  )
-
-  const restrictedModeMessage = computed(() => {
-    if (linkedLoading.value) {
-      return config.labels.verifying
-    }
-    if (linkedCount.value <= 0) {
-      return ''
-    }
-    if (linkedCount.value === 1) {
-      return `Mode restreint : 1 ${config.labels.singular} est déjà lié à cette catégorie. Vous pouvez ajouter de nouveaux champs personnalisés et renommer les existants, mais pas modifier leur type ou les supprimer.`
-    }
-    return `Mode restreint : ${linkedCount.value} ${config.labels.plural} sont déjà liés à cette catégorie. Vous pouvez ajouter de nouveaux champs personnalisés et renommer les existants, mais pas modifier leur type ou les supprimer.`
-  })
-
-  const submitBlockMessage = computed(() => {
-    if (linkedLoading.value) {
-      return config.labels.verifying
-    }
-    return ''
-  })
-
-  const guardSubmitOrNotify = () => {
-    if (!isSubmitBlocked.value) {
-      return false
-    }
-    showInfo(submitBlockMessage.value || 'Veuillez patienter...')
-    return true
-  }
-
-  return {
-    linkedCount,
-    linkedLoading,
-    isRestrictedMode,
-    isSubmitBlocked,
-    restrictedModeMessage,
-    submitBlockMessage,
-    loadLinkedCount,
-    guardSubmitOrNotify,
-  }
-}
-

app/composables/useComponentCreate.ts

@@ -344,7 +344,7 @@ export function useComponentCreate() {
           selectedDocuments.value = []
         }
         toast.showSuccess('Composant créé avec succès')
-        await router.push('/component-catalog')
+        await router.push(`/component/${createdComponent.id}/edit`)
       }
       else if (result.error) {
         toast.showError(result.error)

app/composables/useComponentEdit.ts

@@ -53,13 +53,13 @@ const historyFieldLabels: Record<string, string> = {
 export function useComponentEdit(componentId: string) {
   const { canEdit } = usePermissions()
   const router = useRouter()
-  const { get } = useApi()
+  const { get, patch } = useApi()
   const { componentTypes, loadComponentTypes } = useComponentTypes()
   const { pieceTypes, loadPieceTypes } = usePieceTypes()
   const { productTypes, loadProductTypes } = useProductTypes()
-  const { updateComposant, loadComposants, composants: componentCatalogRef } = useComposants()
+  const { updateComposant, composants: componentCatalogRef } = useComposants()
-  const { pieces, loadPieces } = usePieces()
+  const { pieces } = usePieces()
-  const { products, loadProducts } = useProducts()
+  const { products } = useProducts()
   const { ensureConstructeurs } = useConstructeurs()
   const { upsertCustomFieldValue, updateCustomFieldValue } = useCustomFields()
   const toast = useToast()
@@ -269,6 +269,97 @@ export function useComponentEdit(componentId: string) {
     }
   })
 
+  // --- Slot selection entries (for selectors) ---
+
+  const pieceSlotEntries = computed(() => {
+    const structure = component.value?.structure
+    if (!structure?.pieces) return []
+    return (structure.pieces as any[]).map((slot: any, i: number) => ({
+      slotId: slot.slotId,
+      typePieceId: slot.typePieceId,
+      selectedPieceId: slot.selectedPieceId ?? null,
+      quantity: slot.quantity ?? 1,
+      position: slot.position ?? i,
+      label: pieceTypeLabelMap.value[slot.typePieceId] || `Pièce #${i + 1}`,
+    }))
+  })
+
+  const productSlotEntries = computed(() => {
+    const structure = component.value?.structure
+    if (!structure?.products) return []
+    return (structure.products as any[]).map((slot: any, i: number) => ({
+      slotId: slot.slotId,
+      typeProductId: slot.typeProductId,
+      selectedProductId: slot.selectedProductId ?? null,
+      familyCode: slot.familyCode,
+      position: slot.position ?? i,
+      label: productTypeLabelMap.value[slot.typeProductId] || `Produit #${i + 1}`,
+    }))
+  })
+
+  const subcomponentSlotEntries = computed(() => {
+    const structure = component.value?.structure
+    if (!structure?.subcomponents) return []
+    return (structure.subcomponents as any[]).map((slot: any, i: number) => ({
+      slotId: slot.slotId,
+      typeComposantId: slot.typeComposantId,
+      selectedComponentId: slot.selectedComponentId ?? null,
+      alias: slot.alias,
+      familyCode: slot.familyCode,
+      position: slot.position ?? i,
+      label: slot.alias || `Sous-composant #${i + 1}`,
+    }))
+  })
+
+  const savePieceSlotSelection = async (slotId: string, selectedPieceId: string | null) => {
+    const result = await patch(`/composant-piece-slots/${slotId}`, { selectedPieceId })
+    if (result.success) {
+      const structure = component.value?.structure
+      if (structure?.pieces) {
+        const slot = (structure.pieces as any[]).find((s: any) => s.slotId === slotId)
+        if (slot) slot.selectedPieceId = selectedPieceId
+      }
+      toast.showSuccess('Pièce mise à jour')
+    }
+  }
+
+  const saveProductSlotSelection = async (slotId: string, selectedProductId: string | null) => {
+    const result = await patch(`/composant-product-slots/${slotId}`, { selectedProductId })
+    if (result.success) {
+      const structure = component.value?.structure
+      if (structure?.products) {
+        const slot = (structure.products as any[]).find((s: any) => s.slotId === slotId)
+        if (slot) slot.selectedProductId = selectedProductId
+      }
+      toast.showSuccess('Produit mis à jour')
+    }
+  }
+
+  const saveSubcomponentSlotSelection = async (slotId: string, selectedComposantId: string | null) => {
+    const result = await patch(`/composant-subcomponent-slots/${slotId}`, { selectedComposantId })
+    if (result.success) {
+      const structure = component.value?.structure
+      if (structure?.subcomponents) {
+        const slot = (structure.subcomponents as any[]).find((s: any) => s.slotId === slotId)
+        if (slot) slot.selectedComponentId = selectedComposantId
+      }
+      toast.showSuccess('Sous-composant mis à jour')
+    }
+  }
+
+  const saveSlotQuantity = async (slotId: string, quantity: number) => {
+    if (!slotId || quantity < 1) return
+    const result = await patch(`/composant-piece-slots/${slotId}`, { quantity: Math.max(1, quantity) })
+    if (result.success) {
+      const structure = component.value?.structure
+      if (structure?.pieces) {
+        const slot = (structure.pieces as any[]).find((s: any) => s.slotId === slotId)
+        if (slot) slot.quantity = quantity
+      }
+      toast.showSuccess('Quantité mise à jour')
+    }
+  }
+
   const submitEdition = async () => {
     if (!component.value) {
       return
@@ -312,7 +403,7 @@ export function useComponentEdit(componentId: string) {
           ],
           { customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
         )
-        await router.push('/component-catalog')
+        toast.showSuccess('Composant mis à jour avec succès.')
       }
     }
     catch (error: any) {
@@ -406,15 +497,6 @@ export function useComponentEdit(componentId: string) {
       fetchComponent(),
     ])
     loading.value = false
-
-    // Defer bulk catalog loads — only needed when component has structure selections
-    if (component.value?.structure) {
-      Promise.allSettled([
-        loadPieces({ itemsPerPage: 200 }),
-        loadProducts({ itemsPerPage: 200 }),
-        loadComposants({ itemsPerPage: 200 }),
-      ]).catch(() => {})
-    }
   })
 
   return {
@@ -440,6 +522,9 @@ export function useComponentEdit(componentId: string) {
     selectedType,
     selectedTypeStructure,
     structureSelections,
+    pieceSlotEntries,
+    productSlotEntries,
+    subcomponentSlotEntries,
 
     // History
     history,
@@ -453,6 +538,10 @@ export function useComponentEdit(componentId: string) {
     handleFilesAdded,
     refreshDocuments,
     submitEdition,
+    saveSlotQuantity,
+    savePieceSlotSelection,
+    saveProductSlotSelection,
+    saveSubcomponentSlotSelection,
     resolvePieceLabel,
     resolveProductLabel,
     resolveSubcomponentLabel,

app/composables/useComposants.ts

@@ -42,6 +42,7 @@ interface LoadComposantsOptions {
   orderBy?: string
   orderDir?: 'asc' | 'desc'
   typeName?: string
+  typeComposantId?: string
   force?: boolean
 }
 
@@ -109,17 +110,18 @@ export function useComposants() {
       orderBy = 'name',
       orderDir = 'asc',
       typeName,
+      typeComposantId,
       force = false,
     } = options
 
-    if (!force && loaded.value && !search && !typeName && page === 1) {
+    if (!force && loaded.value && !search && !typeName && !typeComposantId && page === 1) {
       return {
         success: true,
         data: { items: composants.value, total: total.value, page, itemsPerPage },
       }
     }
 
-    if (loading.value) {
+    if (!typeComposantId && loading.value) {
       return {
         success: true,
         data: { items: composants.value, total: total.value, page, itemsPerPage },
@@ -128,33 +130,41 @@ export function useComposants() {
 
     loading.value = true
     try {
-
       const params = new URLSearchParams()
       params.set('itemsPerPage', String(itemsPerPage))
       params.set('page', String(page))
 
       if (search && search.trim()) {
-        params.set('name', search.trim())
+        params.set('q', search.trim())
       }
 
       if (typeName && typeName.trim()) {
         params.set('typeComposant.name', typeName.trim())
       }
 
+      if (typeComposantId) {
+        params.set('typeComposant', typeComposantId)
+      }
+
       params.set(`order[${orderBy}]`, orderDir)
 
       const result = await get(`/composants?${params.toString()}`)
       if (result.success) {
         const items = extractCollection(result.data)
         const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
-        composants.value = enrichedItems
+        const resultTotal = extractTotal(result.data, items.length)
-        total.value = extractTotal(result.data, items.length)
+
-        loaded.value = true
+        if (!typeComposantId) {
+          composants.value = enrichedItems
+          total.value = resultTotal
+          loaded.value = true
+        }
+
         return {
           success: true,
           data: {
             items: enrichedItems,
-            total: total.value,
+            total: resultTotal,
             page,
             itemsPerPage,
           },

app/composables/useDocuments.ts

@@ -11,6 +11,7 @@ export interface Document {
   size: number
   fileUrl: string
   downloadUrl: string
+  type?: string
   /** @deprecated Legacy Base64 data URI — use fileUrl instead */
   path?: string
   createdAt?: string
@@ -32,6 +33,7 @@ export interface UploadContext {
   composantId?: string
   productId?: string
   pieceId?: string
+  type?: string
 }
 
 export interface DocumentResult {
@@ -47,6 +49,7 @@ interface LoadDocumentsOptions {
   orderBy?: string
   orderDir?: 'asc' | 'desc'
   attachmentFilter?: string
+  type?: string
   force?: boolean
 }
 
@@ -63,7 +66,7 @@ const extractTotal = (payload: unknown, fallbackLength: number): number => {
 }
 
 export function useDocuments() {
-  const { get, postFormData, delete: del } = useApi()
+  const { get, patch, postFormData, delete: del } = useApi()
   const { showError, showSuccess } = useToast()
 
   const loadFromEndpoint = async (
@@ -103,10 +106,11 @@ export function useDocuments() {
       orderBy = 'createdAt',
       orderDir = 'desc',
       attachmentFilter = 'all',
+      type = 'all',
       force = false,
     } = options
 
-    if (!force && loaded.value && !search && page === 1 && attachmentFilter === 'all') {
+    if (!force && loaded.value && !search && page === 1 && attachmentFilter === 'all' && type === 'all') {
       return { success: true, data: documents.value }
     }
 
@@ -128,6 +132,10 @@ export function useDocuments() {
         params.set(`exists[${attachmentFilter}]`, 'true')
       }
 
+      if (type && type !== 'all') {
+        params.set('type', type)
+      }
+
       params.set(`order[${orderBy}]`, orderDir)
 
       const result = await get(`/documents?${params.toString()}`)
@@ -218,6 +226,7 @@ export function useDocuments() {
         const formData = new FormData()
         formData.append('file', file)
         formData.append('name', file.name)
+        if (context.type) formData.append('type', context.type)
 
         if (context.siteId) formData.append('siteId', context.siteId)
         if (context.machineId) formData.append('machineId', context.machineId)
@@ -280,6 +289,33 @@ export function useDocuments() {
     }
   }
 
+  const updateDocument = async (
+    id: string,
+    data: { name?: string; type?: string },
+  ): Promise<DocumentResult> => {
+    loading.value = true
+    try {
+      const result = await patch(`/documents/${id}`, data)
+      if (result.success && result.data) {
+        const updated = result.data as Document
+        const index = documents.value.findIndex((doc) => doc.id === id)
+        if (index !== -1) {
+          documents.value[index] = { ...documents.value[index], ...updated }
+        }
+        showSuccess('Document mis à jour')
+        return { success: true, data: updated }
+      }
+      if (result.error) showError(result.error)
+      return result as DocumentResult
+    } catch (error) {
+      const err = error as Error
+      showError('Impossible de mettre à jour le document')
+      return { success: false, error: err.message }
+    } finally {
+      loading.value = false
+    }
+  }
+
   return {
     documents,
     total,
@@ -292,6 +328,7 @@ export function useDocuments() {
     loadDocumentsByPiece,
     loadDocumentsByProduct,
     uploadDocuments,
+    updateDocument,
     deleteDocument,
   }
 }

app/composables/useEntityDocuments.ts

@@ -17,7 +17,7 @@ export interface EntityDocumentsDeps {
 
 export function useEntityDocuments(deps: EntityDocumentsDeps) {
   const { entity, entityType } = deps
-  const { uploadDocuments, deleteDocument } = useDocuments()
+  const { uploadDocuments, deleteDocument, updateDocument } = useDocuments()
 
   const loadDocumentsFn = entityType === 'composant'
     ? useDocuments().loadDocumentsByComponent
@@ -56,7 +56,7 @@ export function useEntityDocuments(deps: EntityDocumentsDeps) {
   // CRUD operations
   const refreshDocuments = async () => {
     const e = entity()
-    if (!e?.id) return
+    if (!e?.id || e._structurePiece) return
     loadingDocuments.value = true
     try {
       const result: any = await loadDocumentsFn(e.id, { updateStore: false })
@@ -104,6 +104,19 @@ export function useEntityDocuments(deps: EntityDocumentsDeps) {
     }
   }
 
+  const editDocument = async (id: string, data: { name?: string; type?: string }) => {
+    const result: any = await updateDocument(id, data)
+    if (result.success) {
+      const e = entity()
+      const docs = e.documents || []
+      const index = docs.findIndex((doc: any) => doc.id === id)
+      if (index !== -1) {
+        docs[index] = { ...docs[index], ...data }
+      }
+    }
+    return result
+  }
+
   return {
     documents,
     selectedFiles,
@@ -118,5 +131,6 @@ export function useEntityDocuments(deps: EntityDocumentsDeps) {
     ensureDocumentsLoaded,
     handleFilesAdded,
     removeDocument,
+    editDocument,
   }
 }

app/composables/useEntityTypes.ts

@@ -127,8 +127,8 @@ export function useEntityTypes(config: EntityTypeConfig) {
       showSuccess(`Type de ${label} "${data.name}" créé`)
       return { success: true, data: normalized }
     } catch (error) {
-      const err = error as Error & { data?: { message?: string }; message?: string }
+      const err = error as Error & { data?: { error?: string; message?: string }; message?: string }
-      const raw = err?.data?.message || err?.message
+      const raw = err?.data?.error || err?.data?.message || err?.message
       const message = humanizeError(raw)
       showError(`Impossible de créer le type de ${label} : ${message}`)
       return { success: false, error: message }
@@ -153,8 +153,8 @@ export function useEntityTypes(config: EntityTypeConfig) {
       showSuccess(`Type de ${label} "${data.name}" mis à jour`)
       return { success: true, data: normalized }
     } catch (error) {
-      const err = error as Error & { data?: { message?: string }; message?: string }
+      const err = error as Error & { data?: { error?: string; message?: string }; message?: string }
-      const raw = err?.data?.message || err?.message
+      const raw = err?.data?.error || err?.data?.message || err?.message
       const message = humanizeError(raw)
       showError(`Impossible de mettre à jour le type de ${label} : ${message}`)
       return { success: false, error: message }
@@ -171,8 +171,8 @@ export function useEntityTypes(config: EntityTypeConfig) {
       showSuccess(`Type de ${label} supprimé`)
       return { success: true }
     } catch (error) {
-      const err = error as Error & { data?: { message?: string }; message?: string }
+      const err = error as Error & { data?: { error?: string; message?: string }; message?: string }
-      const raw = err?.data?.message || err?.message
+      const raw = err?.data?.error || err?.data?.message || err?.message
       const message = humanizeError(raw)
       showError(`Impossible de supprimer le type de ${label} : ${message}`)
       return { success: false, error: message }

app/composables/useMachineDetailData.ts

@@ -42,7 +42,7 @@ export function useMachineDetailData(machineId: string) {
   const { componentTypes, loadComponentTypes } = useComponentTypes()
   const { pieceTypes, loadPieceTypes } = usePieceTypes()
   const { upsertCustomFieldValue } = useCustomFields()
-  const { get } = useApi()
+  const { get, patch: apiPatch } = useApi()
   const toast = useToast()
   const { constructeurs, loadConstructeurs } = useConstructeurs()
   const { sites, loadSites } = useSites()
@@ -274,6 +274,7 @@ export function useMachineDetailData(machineId: string) {
     updateMachineApi,
     updateComposantApi: updateComposantApi,
     updatePieceApi,
+    apiPatch,
     toast,
   })
 

app/composables/useMachineDetailUpdates.ts

@@ -33,6 +33,7 @@ export interface UseMachineDetailUpdatesDeps {
   updateMachineApi: (id: string, data: any) => Promise<unknown>
   updateComposantApi: (id: string, data: any) => Promise<unknown>
   updatePieceApi: (id: string, data: any) => Promise<unknown>
+  apiPatch: (endpoint: string, data?: unknown) => Promise<any>
   toast: { showInfo: (msg: string) => void }
 }
 
@@ -53,6 +54,7 @@ export function useMachineDetailUpdates(deps: UseMachineDetailUpdatesDeps) {
     updateMachineApi,
     updateComposantApi,
     updatePieceApi,
+    apiPatch,
     toast,
   } = deps
 
@@ -108,18 +110,18 @@ export function useMachineDetailUpdates(deps: UseMachineDetailUpdatesDeps) {
       const productId = updatedComponent.productId
         ? String(updatedComponent.productId)
         : null
-      const prix =
+      const prixStr =
         updatedComponent.prix !== null &&
         updatedComponent.prix !== undefined &&
         String(updatedComponent.prix).trim() !== ''
-          ? Number(updatedComponent.prix)
+          ? String(updatedComponent.prix)
           : null
 
       const result: any = await updateComposantApi(updatedComponent.id as string, {
         name: updatedComponent.name,
         reference: updatedComponent.reference,
         constructeurIds: cIds,
-        prix: Number.isNaN(prix) ? null : prix,
+        prix: prixStr,
         productId,
       } as any)
       if (result.success) {
@@ -138,18 +140,18 @@ export function useMachineDetailUpdates(deps: UseMachineDetailUpdatesDeps) {
       updatedPiece.constructeur,
     )
     const productId = updatedPiece.productId ? String(updatedPiece.productId) : null
-    const prix =
+    const prixStr =
       updatedPiece.prix !== null &&
       updatedPiece.prix !== undefined &&
       String(updatedPiece.prix).trim() !== ''
-        ? Number(updatedPiece.prix)
+        ? String(updatedPiece.prix)
         : null
 
     const result: any = await updatePieceApi(updatedPiece.id as string, {
       name: updatedPiece.name,
-      reference: updatedPiece.reference,
+      reference: updatedPiece.reference || null,
       constructeurIds: cIds,
-      prix: Number.isNaN(prix) ? null : prix,
+      prix: prixStr,
       productId,
     } as any)
     if (result.success) {
@@ -179,6 +181,13 @@ export function useMachineDetailUpdates(deps: UseMachineDetailUpdatesDeps) {
           )
         }
       }
+
+      // Update slot quantity if this is a composant structure piece
+      const slotId = updatedPiece.slotId as string | null
+      const quantity = typeof updatedPiece.quantity === 'number' ? Math.max(1, updatedPiece.quantity) : null
+      if (slotId && quantity !== null) {
+        await apiPatch(`/composant-piece-slots/${slotId}`, { quantity })
+      }
     } catch (error) {
       console.error('Erreur lors de la mise à jour de la pièce:', error)
     }
@@ -187,6 +196,13 @@ export function useMachineDetailUpdates(deps: UseMachineDetailUpdatesDeps) {
   const updatePieceInfo = async (updatedPiece: AnyRecord) => {
     try {
       await _buildAndUpdatePiece(updatedPiece)
+
+      // Update link quantity if this is a direct machine piece
+      const linkId = updatedPiece.linkId || updatedPiece.machinePieceLinkId
+      const quantity = typeof updatedPiece.quantity === 'number' ? Math.max(1, updatedPiece.quantity) : null
+      if (linkId && quantity !== null) {
+        await apiPatch(`/machine_piece_links/${linkId}`, { quantity })
+      }
     } catch (error) {
       console.error('Erreur lors de la mise à jour de la pièce:', error)
     }

app/composables/useMachineHierarchy.ts

@@ -181,6 +181,7 @@ export const buildMachineHierarchyFromLinks = (
       parentLinkId: resolveIdentifier(link.parentLinkId, link.parentMachinePieceLinkId, appliedPiece.parentLinkId),
       parentPieceLinkId: resolveIdentifier(link.parentPieceLinkId, appliedPiece.parentPieceLinkId),
       parentPieceId: resolveIdentifier(appliedPiece.parentPieceId, link.parentPieceId),
+      quantity: typeof link.quantity === 'number' ? link.quantity : 1,
       definition: appliedPiece.definition || originalPiece?.definition || {},
       customFields: appliedPiece.customFields || [],
     }
@@ -214,10 +215,39 @@ export const buildMachineHierarchyFromLinks = (
 
     const componentName = (compOverrides?.name || appliedComponent.name || (appliedComponent.definition as AnyRecord)?.alias || (appliedComponent.definition as AnyRecord)?.name || originalComponent?.name || 'Composant') as string
 
-    const pieces = Array.isArray(link.pieceLinks)
+    const linkedPieces = Array.isArray(link.pieceLinks)
       ? (link.pieceLinks as AnyRecord[]).map((pl) => createPieceNode(pl, componentName)).filter(Boolean) as AnyRecord[]
       : []
 
+    // If no linked pieces exist, build read-only entries from the composant's structure
+    const structurePieceDefs = (!linkedPieces.length && appliedComponent.structure && typeof appliedComponent.structure === 'object')
+      ? (Array.isArray((appliedComponent.structure as AnyRecord).pieces) ? (appliedComponent.structure as AnyRecord).pieces as AnyRecord[] : [])
+      : []
+    const structurePieces = structurePieceDefs.map((def, index) => {
+      const definition = (def.definition && typeof def.definition === 'object' ? def.definition : def) as AnyRecord
+      const resolved = (def.resolvedPiece && typeof def.resolvedPiece === 'object' ? def.resolvedPiece : null) as AnyRecord | null
+      const quantity = typeof definition.quantity === 'number' ? definition.quantity : (typeof def.quantity === 'number' ? def.quantity : 1)
+      return {
+        ...(resolved || {}),
+        id: resolved?.id || `structure-piece-${composantId}-${index}`,
+        pieceId: resolved?.id || null,
+        name: resolved?.name || definition.role || definition.name || def.role || def.name || `Pièce ${index + 1}`,
+        reference: resolved?.reference || definition.reference || def.reference || null,
+        prix: resolved?.prix ?? null,
+        constructeurs: resolved?.constructeurs || [],
+        documents: [],
+        quantity,
+        slotId: def.slotId || definition.slotId || null,
+        typePieceId: resolved?.typePieceId || definition.typePieceId || def.typePieceId || null,
+        typePiece: resolved?.typePiece || null,
+        parentComponentLinkId: machineComponentLinkId,
+        parentComponentName: componentName,
+        _structurePiece: true,
+      }
+    }) as AnyRecord[]
+
+    const pieces = linkedPieces.length ? linkedPieces : structurePieces
+
     const subComponents = Array.isArray(link.childLinks)
       ? (link.childLinks as AnyRecord[]).map(createComponentNode).filter(Boolean) as AnyRecord[]
       : []
@@ -243,6 +273,7 @@ export const buildMachineHierarchyFromLinks = (
       originalComposant: originalComponent,
       machineComponentLink: link,
       machineComponentLinkId,
+      linkId: machineComponentLinkId,
       componentLinkId: machineComponentLinkId,
       parentComponentLinkId: resolveIdentifier(link.parentComponentLinkId, link.parentLinkId, link.parentMachineComponentLinkId, appliedComponent.parentComponentLinkId),
       parentComposantId: resolveIdentifier(appliedComponent.parentComposantId, link.parentComponentId),

app/composables/usePieceEdit.ts

@@ -412,7 +412,7 @@ export function usePieceEdit(pieceId: string) {
           ],
           { customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
         )
-        await router.push('/pieces-catalog')
+        toast.showSuccess('Pièce mise à jour avec succès.')
       }
     }
     catch (error: any) {

app/composables/usePieceStructureEditorLogic.ts

@@ -20,7 +20,6 @@ export type EditorProduct = {
 interface Deps {
   props: {
     modelValue?: PieceModelStructure | null
-    restrictedMode?: boolean
   }
   emit: (event: 'update:modelValue', value: PieceModelStructure) => void
 }
@@ -159,6 +158,13 @@ const buildPayload = (
         orderIndex: index,
       }
 
+      if (field.id) {
+        payload.id = field.id
+      }
+      if (field.customFieldId) {
+        payload.customFieldId = field.customFieldId
+      }
+
       if (type === 'select') {
         const options = normalizeLineEndings(field.optionsText)
           .split('\n')
@@ -202,8 +208,6 @@ export function usePieceStructureEditorLogic(deps: Deps) {
   const products = ref<EditorProduct[]>(hydrateProducts(props.modelValue))
   const restState = ref<Record<string, unknown>>(extractRest(props.modelValue))
 
-  const initialFieldUids = ref<Set<string>>(new Set(fields.value.map(f => f.uid)))
-  const initialProductUids = ref<Set<string>>(new Set(products.value.map(p => p.uid)))
 
   // --- Product types ---
 
@@ -250,18 +254,6 @@ export function usePieceStructureEditorLogic(deps: Deps) {
     }
   }
 
-  // --- Locked state ---
-
-  const isFieldLocked = (field: EditorField): boolean => {
-    return props.restrictedMode === true && initialFieldUids.value.has(field.uid)
-  }
-
-  const isProductLocked = (product: EditorProduct): boolean => {
-    return props.restrictedMode === true && initialProductUids.value.has(product.uid)
-  }
-
-  const restrictedMode = computed(() => props.restrictedMode === true)
-
   // --- CRUD ---
 
   const createEmptyProduct = (): EditorProduct => ({
@@ -407,8 +399,6 @@ export function usePieceStructureEditorLogic(deps: Deps) {
       products.value = hydrateProducts(value)
       products.value.forEach(product => updateProductTypeMetadata(product))
       lastEmitted = incomingSerialized
-      initialFieldUids.value = new Set(fields.value.map(f => f.uid))
-      initialProductUids.value = new Set(products.value.map(p => p.uid))
     },
     { deep: true },
   )
@@ -426,9 +416,6 @@ export function usePieceStructureEditorLogic(deps: Deps) {
     fields,
     products,
     productTypeOptions,
-    restrictedMode,
-    isFieldLocked,
-    isProductLocked,
     formatProductTypeOption,
     handleProductTypeSelect,
     addProduct,

app/composables/usePieces.ts

@@ -43,6 +43,7 @@ interface LoadPiecesOptions {
   orderBy?: string
   orderDir?: 'asc' | 'desc'
   typeName?: string
+  typePieceId?: string
   force?: boolean
 }
 
@@ -119,17 +120,20 @@ export function usePieces() {
       orderBy = 'name',
       orderDir = 'asc',
       typeName,
+      typePieceId,
       force = false,
     } = options
 
-    if (!force && loaded.value && !search && !typeName && page === 1) {
+    // Only use cache for unfiltered full-catalog loads
+    if (!force && loaded.value && !search && !typeName && !typePieceId && page === 1) {
       return {
         success: true,
         data: { items: pieces.value, total: total.value, page, itemsPerPage },
       }
     }
 
-    if (loading.value) {
+    // For filtered queries, don't block on global loading state
+    if (!typePieceId && loading.value) {
       return {
         success: true,
         data: { items: pieces.value, total: total.value, page, itemsPerPage },
@@ -138,33 +142,42 @@ export function usePieces() {
 
     loading.value = true
     try {
-
       const params = new URLSearchParams()
       params.set('itemsPerPage', String(itemsPerPage))
       params.set('page', String(page))
 
       if (search && search.trim()) {
-        params.set('name', search.trim())
+        params.set('q', search.trim())
       }
 
       if (typeName && typeName.trim()) {
         params.set('typePiece.name', typeName.trim())
       }
 
+      if (typePieceId) {
+        params.set('typePiece', typePieceId)
+      }
+
       params.set(`order[${orderBy}]`, orderDir)
 
       const result = await get(`/pieces?${params.toString()}`)
       if (result.success) {
         const items = extractCollection(result.data)
         const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
-        pieces.value = enrichedItems
+        const resultTotal = extractTotal(result.data, items.length)
-        total.value = extractTotal(result.data, items.length)
+
-        loaded.value = true
+        // Only update global cache for unfiltered queries
+        if (!typePieceId) {
+          pieces.value = enrichedItems
+          total.value = resultTotal
+          loaded.value = true
+        }
+
         return {
           success: true,
           data: {
             items: enrichedItems,
-            total: total.value,
+            total: resultTotal,
             page,
             itemsPerPage,
           },

app/composables/useProducts.ts

@@ -41,6 +41,7 @@ interface LoadProductsOptions {
   orderBy?: string
   orderDir?: 'asc' | 'desc'
   typeName?: string
+  typeProductId?: string
   force?: boolean
 }
 
@@ -118,17 +119,18 @@ export function useProducts() {
       orderBy = 'name',
       orderDir = 'asc',
       typeName,
+      typeProductId,
       force = false,
     } = options
 
-    if (!force && loaded.value && !search && !typeName && page === 1) {
+    if (!force && loaded.value && !search && !typeName && !typeProductId && page === 1) {
       return {
         success: true,
         data: { items: products.value, total: total.value, page, itemsPerPage },
       }
     }
 
-    if (loading.value) {
+    if (!typeProductId && loading.value) {
       return {
         success: true,
         data: { items: products.value, total: total.value, page, itemsPerPage },
@@ -143,27 +145,36 @@ export function useProducts() {
       params.set('page', String(page))
 
       if (search && search.trim()) {
-        params.set('name', search.trim())
+        params.set('q', search.trim())
       }
 
       if (typeName && typeName.trim()) {
         params.set('typeProduct.name', typeName.trim())
       }
 
+      if (typeProductId) {
+        params.set('typeProduct', typeProductId)
+      }
+
       params.set(`order[${orderBy}]`, orderDir)
 
       const result = await get(`/products?${params.toString()}`)
       if (result.success) {
         const items = extractCollection(result.data)
         const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
-        products.value = enrichedItems
+        const resultTotal = extractTotal(result.data, items.length)
-        total.value = extractTotal(result.data, items.length)
+
-        loaded.value = true
+        if (!typeProductId) {
+          products.value = enrichedItems
+          total.value = resultTotal
+          loaded.value = true
+        }
+
         return {
           success: true,
           data: {
             items: enrichedItems,
-            total: total.value,
+            total: resultTotal,
             page,
             itemsPerPage,
           },

app/composables/useStructureNodeCrud.ts

@@ -1,51 +1,11 @@
-import { ref } from 'vue'
 import type { EditableStructureNode } from '~/composables/useStructureNodeLogic'
 
 export interface StructureNodeCrudDeps {
   node: EditableStructureNode
-  restrictedMode: boolean
   canManageSubcomponents: () => boolean
 }
 
 export function useStructureNodeCrud(props: StructureNodeCrudDeps) {
-  // --- Lock state ---
-  const initialCustomFieldIndices = ref<Set<number>>(new Set())
-  const initialPieceIndices = ref<Set<number>>(new Set())
-  const initialProductIndices = ref<Set<number>>(new Set())
-  const initialSubcomponentIndices = ref<Set<number>>(new Set())
-
-  const initializeLockedIndices = () => {
-    if (props.restrictedMode) {
-      const customFieldsLength = Array.isArray(props.node.customFields) ? props.node.customFields.length : 0
-      const piecesLength = Array.isArray(props.node.pieces) ? props.node.pieces.length : 0
-      const productsLength = Array.isArray(props.node.products) ? props.node.products.length : 0
-      const subcomponentsLength = Array.isArray(props.node.subcomponents) ? props.node.subcomponents.length : 0
-
-      initialCustomFieldIndices.value = new Set(Array.from({ length: customFieldsLength }, (_, i) => i))
-      initialPieceIndices.value = new Set(Array.from({ length: piecesLength }, (_, i) => i))
-      initialProductIndices.value = new Set(Array.from({ length: productsLength }, (_, i) => i))
-      initialSubcomponentIndices.value = new Set(Array.from({ length: subcomponentsLength }, (_, i) => i))
-    }
-  }
-
-  initializeLockedIndices()
-
-  const isCustomFieldLocked = (index: number): boolean => {
-    return props.restrictedMode === true && initialCustomFieldIndices.value.has(index)
-  }
-
-  const isPieceLocked = (index: number): boolean => {
-    return props.restrictedMode === true && initialPieceIndices.value.has(index)
-  }
-
-  const isProductLocked = (index: number): boolean => {
-    return props.restrictedMode === true && initialProductIndices.value.has(index)
-  }
-
-  const isSubcomponentLocked = (index: number): boolean => {
-    return props.restrictedMode === true && initialSubcomponentIndices.value.has(index)
-  }
-
   // --- Helpers ---
   const ensureArray = (key: 'customFields' | 'pieces' | 'products' | 'subcomponents') => {
     if (!Array.isArray((props.node as any)[key])) {
@@ -115,6 +75,7 @@ export function useStructureNodeCrud(props: StructureNodeCrudDeps) {
       reference: '',
       familyCode: '',
       role: '',
+      quantity: 1,
     })
   }
 
@@ -158,11 +119,6 @@ export function useStructureNodeCrud(props: StructureNodeCrudDeps) {
   }
 
   return {
-    // Lock checks
-    isCustomFieldLocked,
-    isPieceLocked,
-    isProductLocked,
-    isSubcomponentLocked,
     // Helpers exposed for watchers
     reindexCustomFields,
     // CRUD

app/composables/useStructureNodeLogic.ts

@@ -25,14 +25,12 @@ export interface StructureNodeLogicDeps {
   lockedTypeLabel: string
   allowSubcomponents: boolean
   maxSubcomponentDepth: number
-  restrictedMode: boolean
   isLocked: boolean
 }
 
 export function useStructureNodeLogic(props: StructureNodeLogicDeps) {
   // --- Computed props ---
   const isLocked = computed(() => props.isLocked === true)
-  const restrictedMode = computed(() => props.restrictedMode === true)
 
   const componentTypes = computed(() => props.componentTypes ?? [])
   const pieceTypes = computed(() => props.pieceTypes ?? [])
@@ -310,7 +308,6 @@ export function useStructureNodeLogic(props: StructureNodeLogicDeps) {
   // --- CRUD & Lock (delegated to useStructureNodeCrud) ---
   const crud = useStructureNodeCrud({
     node: props.node,
-    restrictedMode: props.restrictedMode,
     canManageSubcomponents: () => canManageSubcomponents.value,
   })
 
@@ -395,14 +392,8 @@ export function useStructureNodeLogic(props: StructureNodeLogicDeps) {
   )
 
   return {
-    // Lock checks
-    isCustomFieldLocked: crud.isCustomFieldLocked,
-    isPieceLocked: crud.isPieceLocked,
-    isProductLocked: crud.isProductLocked,
-    isSubcomponentLocked: crud.isSubcomponentLocked,
     // Computed state
     isLocked,
-    restrictedMode,
     componentTypes,
     pieceTypes,
     productTypes,

app/pages/changelog.vue

@@ -69,6 +69,44 @@ const badgeClass = (type: ChangeType) => {
 }
 
 const releases: Release[] = [
+  {
+    version: 'v1.10.0',
+    date: '2026-03-23',
+    changes: [
+      { type: 'feat', text: 'Serveur MCP (Model Context Protocol) : l\'application expose désormais un serveur MCP permettant l\'intégration avec des assistants IA — outils CRUD complets pour toutes les entités, recherche inventaire, historique, commentaires, champs personnalisés, documents, slots et structure machine' },
+      { type: 'feat', text: 'Types de documents : classification des documents par type (Plan, Photo, Fiche technique, Notice, Certificat, Facture, Bon de commande, Autre) avec filtre dédié sur la page documents, sélection du type à l\'upload et possibilité de modifier le type après upload' },
+      { type: 'feat', text: 'Filtre sites multi-sélection sur le Parc Machines : remplacement du menu déroulant par des cases à cocher permettant de filtrer sur un ou plusieurs sites simultanément' },
+      { type: 'feat', text: 'Tri alphabétique automatique des machines sur le Parc Machines' },
+      { type: 'feat', text: 'Recherche par nom OU référence sur les catalogues : la recherche dans les catalogues pièces, composants et produits cherche désormais dans le nom et la référence simultanément (extension Doctrine OR search)' },
+      { type: 'feat', text: 'Quantité sur les slots pièces : ajout d\'un champ quantité éditable directement depuis la page d\'édition d\'un composant' },
+      { type: 'feat', text: 'Lien rapide vers la catégorie depuis la page d\'édition d\'un composant' },
+      { type: 'feat', text: 'Redirection vers la page d\'édition après création d\'un composant, d\'une pièce ou d\'un produit' },
+      { type: 'fix', text: 'Correction de la suppression de fournisseurs sur les pièces, composants et produits : la suppression est maintenant persistée correctement' },
+      { type: 'fix', text: 'Correction de la création de composants : les sélections de pièces, produits et sous-composants sont maintenant sauvegardées, et les slots squelette sont correctement initialisés' },
+      { type: 'fix', text: 'Correction de la perte de données lors de la sauvegarde d\'une catégorie (champs personnalisés et structure)' },
+      { type: 'fix', text: 'Correction de la suppression de composants depuis la fiche machine (utilisation du linkId au lieu du composantId)' },
+      { type: 'fix', text: 'Amélioration de l\'envoi des fournisseurs en PATCH : le tableau est toujours envoyé pour éviter les pertes' },
+      { type: 'fix', text: 'Filtrage serveur des options dans les sélecteurs de slots au lieu du filtrage client' },
+      { type: 'fix', text: 'Page d\'édition pièce : rester sur la page après sauvegarde au lieu de rediriger' },
+      { type: 'fix', text: 'Messages d\'erreur 409 (conflit) : extraction du champ d\'erreur pour un message compréhensible' },
+      { type: 'perf', text: 'Suppression des chargements catalogue redondants sur la page d\'édition composant' },
+    ],
+  },
+  {
+    version: 'v1.9.1',
+    date: '2026-03-16',
+    changes: [
+      { type: 'feat', text: 'Normalisation JSON → tables relationnelles : les structures des composants (pièces, produits, sous-composants) et les squelettes des catégories sont désormais stockés dans des tables dédiées au lieu de colonnes JSON, améliorant la fiabilité et les performances des requêtes' },
+      { type: 'feat', text: 'Synchronisation des catégories (ModelType Sync) : la modification d\'une catégorie (ajout/suppression de slots ou champs personnalisés) peut être propagée automatiquement à tous les éléments existants de cette catégorie, avec prévisualisation des changements avant application' },
+      { type: 'feat', text: 'Sélection interactive des items dans les slots : sur la page d\'édition d\'un composant, il est maintenant possible de choisir directement la pièce, le produit ou le sous-composant assigné à chaque emplacement du squelette via des sélecteurs avec recherche' },
+      { type: 'feat', text: 'Endpoints PATCH pour les slots composant : modification de la quantité et de l\'item sélectionné sur les slots pièce, produit et sous-composant' },
+      { type: 'feat', text: 'Table de relation pièce ↔ produit (PieceProductSlot) avec versioning pour le suivi des modifications de structure' },
+      { type: 'feat', text: 'Gestion des champs personnalisés sur les catégories : synchronisation automatique des définitions de champs (ajout, modification, suppression) lors de la sauvegarde d\'une catégorie' },
+      { type: 'feat', text: 'Suite de tests étendue : 219 tests couvrant les stratégies de synchronisation, le contrôleur de sync et les nouvelles entités' },
+      { type: 'fix', text: 'Correction de l\'affichage des sélections pré-existantes dans les slots : les pièces, produits et sous-composants déjà assignés sont maintenant correctement affichés à l\'ouverture de la page d\'édition (correction du cache catalogue)' },
+      { type: 'fix', text: 'Fallback position/orderIndex sur index de tableau dans les stratégies de sync pour éviter les erreurs quand le champ est absent' },
+    ],
+  },
   {
     version: 'v1.9.0',
     date: '2026-03-09',

app/pages/component-category/[id]/edit.vue

@@ -27,10 +27,6 @@
         :lock-category="true"
         :saving="saving"
         :readonly="!canEdit"
-        :disable-submit="isSubmitBlocked"
-        :disable-submit-message="submitBlockMessage"
-        :restricted-mode="isRestrictedMode"
-        :restricted-mode-message="restrictedModeMessage"
         @submit="handleSubmit"
         @cancel="handleCancel"
       />
@@ -45,6 +41,14 @@
         show-resolved
       />
     </div>
+
+    <SyncConfirmationModal
+      :preview="syncPreviewData"
+      :open="showSyncModal"
+      :loading="syncLoading"
+      @confirm="handleSyncConfirm"
+      @cancel="handleSyncCancel"
+    />
   </main>
 </template>
 
@@ -52,9 +56,8 @@
 import { computed, onMounted, ref } from 'vue'
 import { useHead, useRoute, useRouter } from '#imports'
 import ModelTypeForm from '~/components/model-types/ModelTypeForm.vue'
-import { getModelType, updateModelType, type ModelTypePayload } from '~/services/modelTypes'
+import { getModelType, updateModelType, syncPreview, syncExecute, type ModelTypePayload, type SyncPreviewResult } from '~/services/modelTypes'
 import type { ComponentModelStructure } from '~/shared/types/inventory'
-import { useCategoryEditGuard } from '~/composables/useCategoryEditGuard'
 import { useComponentTypes } from '~/composables/useComponentTypes'
 import { useToast } from '~/composables/useToast'
 
@@ -67,23 +70,10 @@ const { loadComponentTypes } = useComponentTypes()
 const loading = ref(true)
 const saving = ref(false)
 const initialData = ref<Partial<ModelTypePayload> | null>(null)
-
+const showSyncModal = ref(false)
-const {
+const syncLoading = ref(false)
-  isRestrictedMode,
+const syncPreviewData = ref<SyncPreviewResult | null>(null)
-  isSubmitBlocked,
+const pendingPayload = ref<Partial<ModelTypePayload> | null>(null)
-  restrictedModeMessage,
-  submitBlockMessage,
-  loadLinkedCount,
-  guardSubmitOrNotify,
-} = useCategoryEditGuard({
-  endpoint: '/composants',
-  filterKey: 'typeComposant',
-  labels: {
-    singular: 'composant',
-    plural: 'composants',
-    verifying: 'Vérification des composants liés en cours…',
-  },
-})
 
 const title = computed(() =>
   initialData.value?.name
@@ -126,7 +116,6 @@ const loadCategory = async () => {
       structure: (response.structure as ComponentModelStructure | null) ?? undefined,
     }
 
-    await loadLinkedCount(id)
   } catch (error) {
     showError(normalizeError(error))
     await navigateBackToList()
@@ -141,9 +130,6 @@ const handleCancel = () => {
 
 const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   if (!canEdit.value) return
-  if (guardSubmitOrNotify()) {
-    return
-  }
   const id = String(route.params.id)
   saving.value = true
   try {
@@ -151,10 +137,28 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
       ...payload,
       description: payload?.notes ?? null,
     }
-    await updateModelType(id, enrichedPayload)
+
-    await loadComponentTypes({ force: true })
+    // Get sync preview BEFORE saving
-    showSuccess('Catégorie de composant mise à jour avec succès.')
+    const preview = await syncPreview(id, enrichedPayload.structure || {})
-    await navigateBackToList()
+
+    const hasImpact = preview && (
+      Object.values(preview.additions || {}).some(v => v > 0)
+      || Object.values(preview.deletions || {}).some(v => v > 0)
+      || Object.values(preview.modifications || {}).some(v => v > 0)
+    )
+
+    if (hasImpact) {
+      // Show modal for confirmation
+      pendingPayload.value = enrichedPayload
+      syncPreviewData.value = preview
+      showSyncModal.value = true
+    } else {
+      // No impact — save directly + sync
+      await updateModelType(id, enrichedPayload)
+      await syncExecute(id, { confirmDeletions: false, confirmTypeChanges: false })
+      await loadComponentTypes({ force: true })
+      showSuccess('Catégorie de composant mise à jour avec succès.')
+    }
   } catch (error) {
     showError(normalizeError(error))
   } finally {
@@ -162,6 +166,38 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   }
 }
 
+const handleSyncConfirm = async () => {
+  if (!pendingPayload.value) return
+  const id = String(route.params.id)
+
+  syncLoading.value = true
+  try {
+    const hasDeletions = syncPreviewData.value && Object.values(syncPreviewData.value.deletions || {}).some(v => v > 0)
+    const hasModifications = syncPreviewData.value && Object.values(syncPreviewData.value.modifications || {}).some(v => v > 0)
+
+    await updateModelType(id, pendingPayload.value)
+    await syncExecute(id, {
+      confirmDeletions: !!hasDeletions,
+      confirmTypeChanges: !!hasModifications,
+    })
+    await loadComponentTypes({ force: true })
+    showSuccess('Catégorie de composant mise à jour avec succès.')
+  } catch (error) {
+    showError(normalizeError(error))
+  } finally {
+    syncLoading.value = false
+    showSyncModal.value = false
+    pendingPayload.value = null
+    syncPreviewData.value = null
+  }
+}
+
+const handleSyncCancel = () => {
+  showSyncModal.value = false
+  pendingPayload.value = null
+  syncPreviewData.value = null
+}
+
 onMounted(() => {
   loadCategory()
 })

app/pages/component/[id]/edit.vue

@@ -6,6 +6,12 @@
       :documents="componentDocuments"
       @close="closePreview"
     />
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
     <main class="container mx-auto px-6 py-10">
     <div v-if="loading" class="flex flex-col items-center gap-4 py-20 text-center">
       <span class="loading loading-spinner loading-lg" aria-hidden="true" />
@@ -45,20 +51,33 @@
             <label class="label">
               <span class="label-text">Catégorie de composant</span>
             </label>
-            <select
+            <div class="flex items-center gap-2">
-              v-model="selectedTypeId"
+              <select
-              class="select select-bordered select-sm md:select-md"
+                v-model="selectedTypeId"
-              disabled
+                class="select select-bordered select-sm md:select-md flex-1"
-            >
+                disabled
-              <option value="">Sélectionner une catégorie</option>
-              <option
-                v-for="type in componentTypeList"
-                :key="type.id"
-                :value="type.id"
               >
-                {{ type.name }}
+                <option value="">Sélectionner une catégorie</option>
-              </option>
+                <option
-            </select>
+                  v-for="type in componentTypeList"
+                  :key="type.id"
+                  :value="type.id"
+                >
+                  {{ type.name }}
+                </option>
+              </select>
+              <NuxtLink
+                v-if="selectedTypeId"
+                :to="`/component-category/${selectedTypeId}/edit`"
+                class="btn btn-ghost btn-sm"
+                title="Voir la catégorie"
+              >
+                <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor">
+                  <path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z" />
+                  <path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z" />
+                </svg>
+              </NuxtLink>
+            </div>
             <p class="text-xs text-base-content/60 mt-1">
               La catégorie d'origine ne peut pas être modifiée depuis cette page.
             </p>
@@ -152,45 +171,91 @@
         />
 
         <div
-          v-if="structureSelections.hasAny"
+          v-if="pieceSlotEntries.length || productSlotEntries.length || subcomponentSlotEntries.length"
           class="space-y-3 rounded-lg border border-base-200 bg-base-200/30 p-4"
         >
           <header class="space-y-1">
-            <h2 class="font-semibold text-base-content">Sélections actuelles</h2>
+            <h2 class="font-semibold text-base-content">Sélections du squelette</h2>
             <p class="text-xs text-base-content/70">
-              Voici les pièces, produits et sous-composants réellement choisis pour ce composant.
+              Choisissez les pièces, produits et sous-composants pour chaque emplacement requis par la catégorie.
             </p>
           </header>
 
-          <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
+          <div v-if="pieceSlotEntries.length" class="space-y-2">
-            <div v-if="structureSelections.pieces.length" class="space-y-2">
+            <h3 class="font-semibold text-sm text-base-content">Pièces</h3>
-              <h3 class="font-semibold text-sm text-base-content">Pièces choisies</h3>
+            <div class="grid grid-cols-1 gap-3 md:grid-cols-2">
-              <ul class="list-disc list-inside space-y-1 text-sm">
+              <div
-                <li v-for="entry in structureSelections.pieces" :key="`selected-piece-${entry.path}-${entry.id}`">
+                v-for="slot in pieceSlotEntries"
-                  <span class="font-medium">{{ entry.resolvedName }}</span>
+                :key="`piece-slot-${slot.slotId}`"
-                  <span class="text-xs text-base-content/70"> — {{ entry.requirementLabel }}</span>
+                class="form-control"
-                </li>
+              >
-              </ul>
+                <label class="label">
+                  <span class="label-text text-xs font-medium">{{ slot.label }}</span>
+                </label>
+                <div class="flex items-start gap-2">
+                  <div class="flex-1">
+                    <PieceSelect
+                      :model-value="slot.selectedPieceId"
+                      :disabled="!canEdit || saving"
+                      :type-piece-id="slot.typePieceId"
+                      @update:model-value="(value) => savePieceSlotSelection(slot.slotId, value)"
+                    />
+                  </div>
+                  <div class="w-20 shrink-0">
+                    <input
+                      type="number"
+                      :value="slot.quantity"
+                      min="1"
+                      class="input input-bordered input-sm w-full text-center"
+                      :disabled="!canEdit || saving"
+                      title="Quantité"
+                      @change="(e) => saveSlotQuantity(slot.slotId, Number((e.target as HTMLInputElement).value))"
+                    >
+                  </div>
+                </div>
+              </div>
             </div>
+          </div>
 
-            <div v-if="structureSelections.products.length" class="space-y-2">
+          <div v-if="productSlotEntries.length" class="space-y-2">
-              <h3 class="font-semibold text-sm text-base-content">Produits choisis</h3>
+            <h3 class="font-semibold text-sm text-base-content">Produits</h3>
-              <ul class="list-disc list-inside space-y-1 text-sm">
+            <div class="grid grid-cols-1 gap-3 md:grid-cols-2">
-                <li v-for="entry in structureSelections.products" :key="`selected-product-${entry.path}-${entry.id}`">
+              <div
-                  <span class="font-medium">{{ entry.resolvedName }}</span>
+                v-for="slot in productSlotEntries"
-                  <span class="text-xs text-base-content/70"> — {{ entry.requirementLabel }}</span>
+                :key="`product-slot-${slot.slotId}`"
-                </li>
+                class="form-control"
-              </ul>
+              >
+                <label class="label">
+                  <span class="label-text text-xs font-medium">{{ slot.label }}</span>
+                </label>
+                <ProductSelect
+                  :model-value="slot.selectedProductId"
+                  :disabled="!canEdit || saving"
+                  :type-product-id="slot.typeProductId"
+                  @update:model-value="(value) => saveProductSlotSelection(slot.slotId, value)"
+                />
+              </div>
             </div>
+          </div>
 
-            <div v-if="structureSelections.components.length" class="space-y-2">
+          <div v-if="subcomponentSlotEntries.length" class="space-y-2">
-              <h3 class="font-semibold text-sm text-base-content">Sous-composants choisis</h3>
+            <h3 class="font-semibold text-sm text-base-content">Sous-composants</h3>
-              <ul class="list-disc list-inside space-y-1 text-sm">
+            <div class="grid grid-cols-1 gap-3 md:grid-cols-2">
-                <li v-for="entry in structureSelections.components" :key="`selected-component-${entry.path}-${entry.id}`">
+              <div
-                  <span class="font-medium">{{ entry.resolvedName }}</span>
+                v-for="slot in subcomponentSlotEntries"
-                  <span class="text-xs text-base-content/70"> — {{ entry.requirementLabel }}</span>
+                :key="`sub-slot-${slot.slotId}`"
-                </li>
+                class="form-control"
-              </ul>
+              >
+                <label class="label">
+                  <span class="label-text text-xs font-medium">{{ slot.label }}</span>
+                </label>
+                <ComposantSelect
+                  :model-value="slot.selectedComponentId"
+                  :disabled="!canEdit || saving"
+                  :type-composant-id="slot.typeComposantId"
+                  @update:model-value="(value) => saveSubcomponentSlotSelection(slot.slotId, value)"
+                />
+              </div>
             </div>
           </div>
         </div>
@@ -235,9 +300,11 @@
             v-else
             :documents="componentDocuments"
             :can-delete="canEdit"
+            :can-edit="true"
             :delete-disabled="uploadingDocuments"
             empty-text="Aucun document n'est associé à ce composant pour le moment."
             @preview="openPreview"
+            @edit="openEditModal"
             @delete="removeDocument"
           />
         </div>
@@ -275,10 +342,13 @@
 </template>
 
 <script setup lang="ts">
+import { ref } from 'vue'
 import { useRoute } from '#imports'
 import { useComponentEdit } from '~/composables/useComponentEdit'
+import { useDocuments } from '~/composables/useDocuments'
 
 const route = useRoute()
+const { updateDocument } = useDocuments()
 
 const {
   component,
@@ -300,6 +370,9 @@ const {
   selectedType,
   selectedTypeStructure,
   structureSelections,
+  pieceSlotEntries,
+  productSlotEntries,
+  subcomponentSlotEntries,
   history,
   historyLoading,
   historyError,
@@ -308,9 +381,33 @@ const {
   removeDocument,
   handleFilesAdded,
   submitEdition,
+  saveSlotQuantity,
+  savePieceSlotSelection,
+  saveProductSlotSelection,
+  saveSubcomponentSlotSelection,
   resolvePieceLabel,
   resolveProductLabel,
   resolveSubcomponentLabel,
   formatStructurePreview,
 } = useComponentEdit(String(route.params.id))
+
+const editingDocument = ref<any | null>(null)
+const editModalVisible = ref(false)
+
+const openEditModal = (doc: any) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+const handleDocumentUpdated = async (data: { name?: string; type?: string }) => {
+  if (!editingDocument.value?.id) return
+  const result = await updateDocument(editingDocument.value.id, data)
+  if (result.success) {
+    const idx = componentDocuments.value.findIndex((d: any) => d.id === editingDocument.value?.id)
+    if (idx !== -1) {
+      componentDocuments.value[idx] = { ...componentDocuments.value[idx], ...data }
+    }
+  }
+  editModalVisible.value = false
+  editingDocument.value = null
+}
 </script>

app/pages/documents.vue

@@ -7,6 +7,13 @@
       @close="closePreview"
     />
 
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
+
     <section class="card bg-base-100 shadow-sm">
       <div class="card-body space-y-6">
         <DataTable
@@ -55,6 +62,26 @@
                 <option value="product">Produits</option>
               </select>
             </div>
+
+            <div class="flex items-center gap-2">
+              <label
+                class="text-xs font-semibold uppercase tracking-wide text-base-content/70"
+                for="doc-type-filter"
+              >
+                Type
+              </label>
+              <select
+                id="doc-type-filter"
+                v-model="typeFilter"
+                class="select select-bordered select-sm"
+                @change="table.handleFilterChange"
+              >
+                <option value="all">Tous</option>
+                <option v-for="t in DOCUMENT_TYPES" :key="t.value" :value="t.value">
+                  {{ t.label }}
+                </option>
+              </select>
+            </div>
           </template>
 
           <template #cell-name="{ row }">
@@ -77,6 +104,10 @@
             {{ row.mimeType || 'Inconnu' }}
           </template>
 
+          <template #cell-type="{ row }">
+            <span class="badge badge-sm badge-outline">{{ getDocumentTypeLabel(row.type || 'documentation') }}</span>
+          </template>
+
           <template #cell-size="{ row }">
             {{ formatSize(row.size) }}
           </template>
@@ -98,6 +129,14 @@
 
           <template #cell-actions="{ row }">
             <div class="flex justify-end gap-2">
+              <button
+                v-if="canEdit"
+                class="btn btn-ghost btn-xs"
+                type="button"
+                @click="openEditModal(row)"
+              >
+                Modifier
+              </button>
               <button
                 class="btn btn-ghost btn-xs"
                 type="button"
@@ -123,12 +162,15 @@ import { computed, onMounted, ref, type Ref } from 'vue'
 import DataTable from '~/components/common/DataTable.vue'
 import { useDocuments } from '~/composables/useDocuments'
 import { useDataTable } from '~/composables/useDataTable'
+import { usePermissions } from '~/composables/usePermissions'
 import { getFileIcon } from '~/utils/fileIcons'
 import { canPreviewDocument } from '~/utils/documentPreview'
 import { formatFrenchDate } from '~/utils/date'
+import { DOCUMENT_TYPES, getDocumentTypeLabel } from '~/shared/documentTypes'
 import DocumentPreviewModal from '~/components/DocumentPreviewModal.vue'
 
-const { documents, total, loading, loadDocuments } = useDocuments()
+const { documents, total, loading, loadDocuments, updateDocument } = useDocuments()
+const { canEdit } = usePermissions()
 
 const table = useDataTable(
   { fetchData: fetchDocuments },
@@ -139,21 +181,26 @@ const table = useDataTable(
     persistToUrl: true,
     extraParams: {
       filter: { default: 'all' },
+      typeFilter: { default: 'all' },
     },
   },
 )
 
 const attachmentFilter = table.filters.filter as Ref<string>
+const typeFilter = table.filters.typeFilter as Ref<string>
 
 const previewDocument = ref<any>(null)
 const previewVisible = ref(false)
+const editingDocument = ref<any>(null)
+const editModalVisible = ref(false)
 
 const documentsOnPage = computed(() => documents.value.length)
 const paginationState = table.pagination(total, documentsOnPage)
 
 const columns = [
   { key: 'name', label: 'Nom', sortable: true, sortKey: 'name' },
-  { key: 'mimeType', label: 'Type' },
+  { key: 'mimeType', label: 'Type MIME' },
+  { key: 'type', label: 'Type' },
   { key: 'size', label: 'Taille', sortable: true, sortKey: 'size' },
   { key: 'attachment', label: 'Rattaché à' },
   { key: 'createdAt', label: 'Date', sortable: true, sortKey: 'createdAt' },
@@ -168,6 +215,7 @@ async function fetchDocuments() {
     orderBy: table.sortField.value,
     orderDir: table.sortDirection.value as 'asc' | 'desc',
     attachmentFilter: attachmentFilter.value,
+    type: typeFilter.value,
     force: true,
   })
 }
@@ -198,6 +246,25 @@ const closePreview = () => {
   previewDocument.value = null
 }
 
+const openEditModal = (doc: any) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+
+const handleDocumentUpdated = async (data: { name: string; type: string }) => {
+  if (!editingDocument.value?.id) return
+  const result = await updateDocument(editingDocument.value.id, data)
+  if (result.success) {
+    const doc = documents.value.find((d) => d.id === editingDocument.value.id)
+    if (doc) {
+      doc.name = data.name
+      doc.type = data.type
+    }
+  }
+  editModalVisible.value = false
+  editingDocument.value = null
+}
+
 onMounted(() => {
   fetchDocuments()
 })

app/pages/machines/index.vue

@@ -16,16 +16,23 @@
           <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div class="form-control">
               <label class="label">
-                <span class="label-text">Site</span>
+                <span class="label-text">Sites</span>
               </label>
-              <select v-model="selectedSite" class="select select-bordered">
+              <div class="flex flex-wrap gap-3">
-                <option value="">
+                <label
-                  Tous les sites
+                  v-for="site in sites"
-                </option>
+                  :key="site.id"
-                <option v-for="site in sites" :key="site.id" :value="site.id">
+                  class="flex items-center gap-2 cursor-pointer"
-                  {{ site.name }}
+                >
-                </option>
+                  <input
-              </select>
+                    type="checkbox"
+                    class="checkbox checkbox-sm"
+                    :checked="selectedSites.has(site.id)"
+                    @change="selectedSites.has(site.id) ? selectedSites.delete(site.id) : selectedSites.add(site.id)"
+                  >
+                  <span class="text-sm">{{ site.name }}</span>
+                </label>
+              </div>
             </div>
             <div class="form-control">
               <label class="label">
@@ -113,7 +120,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from 'vue'
+import { ref, reactive, computed, onMounted } from 'vue'
 import { useMachines } from '~/composables/useMachines'
 import { useSites } from '~/composables/useSites'
 import { useToast } from '~/composables/useToast'
@@ -128,7 +135,7 @@ const { machines, loading, loadMachines, deleteMachine } = useMachines()
 const { sites, loadSites } = useSites()
 const toast = useToast()
 
-const selectedSite = ref('')
+const selectedSites = reactive(new Set())
 const searchQuery = ref('')
 
 // Enrichir les machines avec les objets site complets
@@ -145,8 +152,8 @@ const enrichedMachines = computed(() => {
 const filteredMachines = computed(() => {
   let filtered = enrichedMachines.value
 
-  if (selectedSite.value) {
+  if (selectedSites.size > 0) {
-    filtered = filtered.filter(machine => machine.siteId === selectedSite.value)
+    filtered = filtered.filter(machine => selectedSites.has(machine.siteId))
   }
 
   if (searchQuery.value.trim()) {
@@ -157,6 +164,10 @@ const filteredMachines = computed(() => {
     )
   }
 
+  filtered = [...filtered].sort((a, b) =>
+    (a.name || '').localeCompare(b.name || '', 'fr')
+  )
+
   return filtered
 })
 

app/pages/piece-category/[id]/edit.vue

@@ -27,10 +27,6 @@
         :lock-category="true"
         :saving="saving"
         :readonly="!canEdit"
-        :disable-submit="isSubmitBlocked"
-        :disable-submit-message="submitBlockMessage"
-        :restricted-mode="isRestrictedMode"
-        :restricted-mode-message="restrictedModeMessage"
         @submit="handleSubmit"
         @cancel="handleCancel"
       />
@@ -45,6 +41,14 @@
         show-resolved
       />
     </div>
+
+    <SyncConfirmationModal
+      :preview="syncPreviewData"
+      :open="showSyncModal"
+      :loading="syncLoading"
+      @confirm="handleSyncConfirm"
+      @cancel="handleSyncCancel"
+    />
   </main>
 </template>
 
@@ -52,9 +56,8 @@
 import { computed, onMounted, ref } from 'vue'
 import { useHead, useRoute, useRouter } from '#imports'
 import ModelTypeForm from '~/components/model-types/ModelTypeForm.vue'
-import { getModelType, updateModelType, type ModelTypePayload } from '~/services/modelTypes'
+import { getModelType, updateModelType, syncPreview, syncExecute, type ModelTypePayload, type SyncPreviewResult } from '~/services/modelTypes'
 import type { PieceModelStructure } from '~/shared/types/inventory'
-import { useCategoryEditGuard } from '~/composables/useCategoryEditGuard'
 import { usePieceTypes } from '~/composables/usePieceTypes'
 import { useToast } from '~/composables/useToast'
 
@@ -67,23 +70,10 @@ const { loadPieceTypes } = usePieceTypes()
 const loading = ref(true)
 const saving = ref(false)
 const initialData = ref<Partial<ModelTypePayload> | null>(null)
-
+const showSyncModal = ref(false)
-const {
+const syncLoading = ref(false)
-  isRestrictedMode,
+const syncPreviewData = ref<SyncPreviewResult | null>(null)
-  isSubmitBlocked,
+const pendingPayload = ref<Partial<ModelTypePayload> | null>(null)
-  restrictedModeMessage,
-  submitBlockMessage,
-  loadLinkedCount,
-  guardSubmitOrNotify,
-} = useCategoryEditGuard({
-  endpoint: '/pieces',
-  filterKey: 'typePiece',
-  labels: {
-    singular: 'pièce',
-    plural: 'pièces',
-    verifying: 'Vérification des pièces liées en cours…',
-  },
-})
 
 const title = computed(() =>
   initialData.value?.name ? `Modifier « ${initialData.value.name} »` : 'Modifier une catégorie de pièce',
@@ -124,7 +114,6 @@ const loadCategory = async () => {
       structure: (response.structure as PieceModelStructure | null) ?? undefined,
     }
 
-    await loadLinkedCount(id)
   } catch (error) {
     showError(normalizeError(error))
     await navigateBackToList()
@@ -139,9 +128,6 @@ const handleCancel = () => {
 
 const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   if (!canEdit.value) return
-  if (guardSubmitOrNotify()) {
-    return
-  }
   const id = String(route.params.id)
   saving.value = true
   try {
@@ -149,10 +135,28 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
       ...payload,
       description: payload?.notes ?? null,
     }
-    await updateModelType(id, enrichedPayload)
+
-    await loadPieceTypes({ force: true })
+    // Get sync preview BEFORE saving
-    showSuccess('Catégorie de pièce mise à jour avec succès.')
+    const preview = await syncPreview(id, enrichedPayload.structure || {})
-    await navigateBackToList()
+
+    const hasImpact = preview && (
+      Object.values(preview.additions || {}).some(v => v > 0)
+      || Object.values(preview.deletions || {}).some(v => v > 0)
+      || Object.values(preview.modifications || {}).some(v => v > 0)
+    )
+
+    if (hasImpact) {
+      // Show modal for confirmation
+      pendingPayload.value = enrichedPayload
+      syncPreviewData.value = preview
+      showSyncModal.value = true
+    } else {
+      // No impact — save directly + sync
+      await updateModelType(id, enrichedPayload)
+      await syncExecute(id, { confirmDeletions: false, confirmTypeChanges: false })
+      await loadPieceTypes({ force: true })
+      showSuccess('Catégorie de pièce mise à jour avec succès.')
+    }
   } catch (error) {
     showError(normalizeError(error))
   } finally {
@@ -160,6 +164,38 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   }
 }
 
+const handleSyncConfirm = async () => {
+  if (!pendingPayload.value) return
+  const id = String(route.params.id)
+
+  syncLoading.value = true
+  try {
+    const hasDeletions = syncPreviewData.value && Object.values(syncPreviewData.value.deletions || {}).some(v => v > 0)
+    const hasModifications = syncPreviewData.value && Object.values(syncPreviewData.value.modifications || {}).some(v => v > 0)
+
+    await updateModelType(id, pendingPayload.value)
+    await syncExecute(id, {
+      confirmDeletions: !!hasDeletions,
+      confirmTypeChanges: !!hasModifications,
+    })
+    await loadPieceTypes({ force: true })
+    showSuccess('Catégorie de pièce mise à jour avec succès.')
+  } catch (error) {
+    showError(normalizeError(error))
+  } finally {
+    syncLoading.value = false
+    showSyncModal.value = false
+    pendingPayload.value = null
+    syncPreviewData.value = null
+  }
+}
+
+const handleSyncCancel = () => {
+  showSyncModal.value = false
+  pendingPayload.value = null
+  syncPreviewData.value = null
+}
+
 onMounted(() => {
   loadCategory()
 })

app/pages/pieces/[id]/edit.vue

@@ -6,6 +6,12 @@
       :documents="pieceDocuments"
       @close="closePreview"
     />
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
     <main class="container mx-auto px-6 py-10">
     <div v-if="loading" class="flex flex-col items-center gap-4 py-20 text-center">
       <span class="loading loading-spinner loading-lg" aria-hidden="true" />
@@ -231,9 +237,11 @@
             v-else
             :documents="pieceDocuments"
             :can-delete="canEdit"
+            :can-edit="true"
             :delete-disabled="uploadingDocuments"
             empty-text="Aucun document n'est associé à cette pièce pour le moment."
             @preview="openPreview"
+            @edit="openEditModal"
             @delete="removeDocument"
           />
         </div>
@@ -271,10 +279,13 @@
 </template>
 
 <script setup lang="ts">
+import { ref } from 'vue'
 import { useRoute } from '#imports'
 import { usePieceEdit } from '~/composables/usePieceEdit'
+import { useDocuments } from '~/composables/useDocuments'
 
 const route = useRoute()
+const { updateDocument } = useDocuments()
 
 const {
   piece,
@@ -310,4 +321,24 @@ const {
   submitEdition,
   formatPieceStructurePreview,
 } = usePieceEdit(String(route.params.id))
+
+const editingDocument = ref<any | null>(null)
+const editModalVisible = ref(false)
+
+const openEditModal = (doc: any) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+const handleDocumentUpdated = async (data: { name?: string; type?: string }) => {
+  if (!editingDocument.value?.id) return
+  const result = await updateDocument(editingDocument.value.id, data)
+  if (result.success) {
+    const idx = pieceDocuments.value.findIndex((d: any) => d.id === editingDocument.value?.id)
+    if (idx !== -1) {
+      pieceDocuments.value[idx] = { ...pieceDocuments.value[idx], ...data }
+    }
+  }
+  editModalVisible.value = false
+  editingDocument.value = null
+}
 </script>

app/pages/pieces/create.vue

@@ -466,7 +466,7 @@ const submitCreation = async () => {
         selectedDocuments.value = []
       }
       toast.showSuccess('Pièce créée avec succès')
-      await router.push('/pieces-catalog')
+      await router.push(`/pieces/${createdPiece.id}/edit`)
     } else if (result.error) {
       toast.showError(result.error)
     }

app/pages/product-category/[id]/edit.vue

@@ -27,10 +27,6 @@
         :lock-category="true"
         :saving="saving"
         :readonly="!canEdit"
-        :disable-submit="isSubmitBlocked"
-        :disable-submit-message="submitBlockMessage"
-        :restricted-mode="isRestrictedMode"
-        :restricted-mode-message="restrictedModeMessage"
         @submit="handleSubmit"
         @cancel="handleCancel"
       />
@@ -45,6 +41,14 @@
         show-resolved
       />
     </div>
+
+    <SyncConfirmationModal
+      :preview="syncPreviewData"
+      :open="showSyncModal"
+      :loading="syncLoading"
+      @confirm="handleSyncConfirm"
+      @cancel="handleSyncCancel"
+    />
   </main>
 </template>
 
@@ -52,9 +56,8 @@
 import { computed, onMounted, ref } from 'vue'
 import { useHead, useRoute, useRouter } from '#imports'
 import ModelTypeForm from '~/components/model-types/ModelTypeForm.vue'
-import { getModelType, updateModelType, type ModelTypePayload } from '~/services/modelTypes'
+import { getModelType, updateModelType, syncPreview, syncExecute, type ModelTypePayload, type SyncPreviewResult } from '~/services/modelTypes'
 import type { ProductModelStructure } from '~/shared/types/inventory'
-import { useCategoryEditGuard } from '~/composables/useCategoryEditGuard'
 import { useProductTypes } from '~/composables/useProductTypes'
 import { useToast } from '~/composables/useToast'
 
@@ -67,23 +70,10 @@ const { loadProductTypes } = useProductTypes()
 const loading = ref(true)
 const saving = ref(false)
 const initialData = ref<Partial<ModelTypePayload> | null>(null)
-
+const showSyncModal = ref(false)
-const {
+const syncLoading = ref(false)
-  isRestrictedMode,
+const syncPreviewData = ref<SyncPreviewResult | null>(null)
-  isSubmitBlocked,
+const pendingPayload = ref<Partial<ModelTypePayload> | null>(null)
-  restrictedModeMessage,
-  submitBlockMessage,
-  loadLinkedCount,
-  guardSubmitOrNotify,
-} = useCategoryEditGuard({
-  endpoint: '/products',
-  filterKey: 'typeProduct',
-  labels: {
-    singular: 'produit',
-    plural: 'produits',
-    verifying: 'Vérification des produits liés en cours…',
-  },
-})
 
 const title = computed(() =>
   initialData.value?.name ? `Modifier « ${initialData.value.name} »` : 'Modifier une catégorie de produit',
@@ -124,7 +114,6 @@ const loadCategory = async () => {
       structure: (response.structure as ProductModelStructure | null) ?? undefined,
     }
 
-    await loadLinkedCount(id)
   } catch (error) {
     showError(normalizeError(error))
     await navigateBackToList()
@@ -139,9 +128,6 @@ const handleCancel = () => {
 
 const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   if (!canEdit.value) return
-  if (guardSubmitOrNotify()) {
-    return
-  }
   const id = String(route.params.id)
   saving.value = true
   try {
@@ -149,10 +135,28 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
       ...payload,
       description: payload?.notes ?? null,
     }
-    await updateModelType(id, enrichedPayload)
+
-    await loadProductTypes({ force: true })
+    // Get sync preview BEFORE saving
-    showSuccess('Catégorie de produit mise à jour avec succès.')
+    const preview = await syncPreview(id, enrichedPayload.structure || {})
-    await navigateBackToList()
+
+    const hasImpact = preview && (
+      Object.values(preview.additions || {}).some(v => v > 0)
+      || Object.values(preview.deletions || {}).some(v => v > 0)
+      || Object.values(preview.modifications || {}).some(v => v > 0)
+    )
+
+    if (hasImpact) {
+      // Show modal for confirmation
+      pendingPayload.value = enrichedPayload
+      syncPreviewData.value = preview
+      showSyncModal.value = true
+    } else {
+      // No impact — save directly + sync
+      await updateModelType(id, enrichedPayload)
+      await syncExecute(id, { confirmDeletions: false, confirmTypeChanges: false })
+      await loadProductTypes({ force: true })
+      showSuccess('Catégorie de produit mise à jour avec succès.')
+    }
   } catch (error) {
     showError(normalizeError(error))
   } finally {
@@ -160,6 +164,38 @@ const handleSubmit = async (payload: Parameters<typeof updateModelType>[1]) => {
   }
 }
 
+const handleSyncConfirm = async () => {
+  if (!pendingPayload.value) return
+  const id = String(route.params.id)
+
+  syncLoading.value = true
+  try {
+    const hasDeletions = syncPreviewData.value && Object.values(syncPreviewData.value.deletions || {}).some(v => v > 0)
+    const hasModifications = syncPreviewData.value && Object.values(syncPreviewData.value.modifications || {}).some(v => v > 0)
+
+    await updateModelType(id, pendingPayload.value)
+    await syncExecute(id, {
+      confirmDeletions: !!hasDeletions,
+      confirmTypeChanges: !!hasModifications,
+    })
+    await loadProductTypes({ force: true })
+    showSuccess('Catégorie de produit mise à jour avec succès.')
+  } catch (error) {
+    showError(normalizeError(error))
+  } finally {
+    syncLoading.value = false
+    showSyncModal.value = false
+    pendingPayload.value = null
+    syncPreviewData.value = null
+  }
+}
+
+const handleSyncCancel = () => {
+  showSyncModal.value = false
+  pendingPayload.value = null
+  syncPreviewData.value = null
+}
+
 onMounted(() => {
   loadCategory()
 })

app/pages/product/[id]/edit.vue

@@ -6,6 +6,12 @@
       :documents="productDocuments"
       @close="closePreview"
     />
+    <DocumentEditModal
+      :visible="editModalVisible"
+      :document="editingDocument"
+      @close="editModalVisible = false"
+      @updated="handleDocumentUpdated"
+    />
     <main class="container mx-auto px-6 py-10">
     <div v-if="loading" class="flex flex-col items-center gap-4 py-16 text-center">
       <span class="loading loading-spinner loading-lg" aria-hidden="true" />
@@ -167,9 +173,11 @@
             v-else
             :documents="productDocuments"
             :can-delete="canEdit"
+            :can-edit="true"
             :delete-disabled="uploadingDocuments || saving"
             empty-text="Aucun document n'est associé à ce produit pour le moment."
             @preview="openPreview"
+            @edit="openEditModal"
             @delete="removeDocument"
           />
         </div>
@@ -244,6 +252,7 @@ const {
   loadDocumentsByProduct,
   uploadDocuments: uploadProductDocuments,
   deleteDocument: deleteProductDocument,
+  updateDocument,
 } = useDocuments()
 const { ensureConstructeurs } = useConstructeurs()
 const {
@@ -265,6 +274,8 @@ const loadingDocuments = ref(false)
 const productDocuments = ref<any[]>([])
 const previewDocument = ref<any | null>(null)
 const previewVisible = ref(false)
+const editingDocument = ref<any | null>(null)
+const editModalVisible = ref(false)
 
 const historyFieldLabels: Record<string, string> = {
   name: 'Nom',
@@ -307,6 +318,23 @@ const openPreview = (doc: any) => {
 }
 const closePreview = () => { previewVisible.value = false; previewDocument.value = null }
 
+const openEditModal = (doc: any) => {
+  editingDocument.value = doc
+  editModalVisible.value = true
+}
+const handleDocumentUpdated = async (data: { name?: string; type?: string }) => {
+  if (!editingDocument.value?.id) return
+  const result = await updateDocument(editingDocument.value.id, data)
+  if (result.success) {
+    const idx = productDocuments.value.findIndex((d: any) => d.id === editingDocument.value?.id)
+    if (idx !== -1) {
+      productDocuments.value[idx] = { ...productDocuments.value[idx], ...data }
+    }
+  }
+  editModalVisible.value = false
+  editingDocument.value = null
+}
+
 const loadProduct = async () => {
   const id = route.params.id
   if (!id || typeof id !== 'string') {
@@ -390,7 +418,7 @@ const loadProductType = async () => {
   // Try using the expanded typeProduct from entity response first
   const embedded = product.value?.typeProduct
   if (embedded && typeof embedded === 'object' && embedded.id) {
-    const embeddedStructure = embedded.structure ?? embedded.productSkeleton ?? null
+    const embeddedStructure = embedded.structure ?? null
     if (embeddedStructure) {
       productType.value = embedded
       structure.value = normalizeProductStructureForSave(embeddedStructure)
@@ -406,7 +434,7 @@ const loadProductType = async () => {
   try {
     const type = await getModelType(product.value.typeProductId)
     productType.value = type
-    structure.value = normalizeProductStructureForSave(type?.structure ?? type?.productSkeleton ?? null)
+    structure.value = normalizeProductStructureForSave(type?.structure ?? null)
   } catch (error) {
     console.error('Erreur lors du chargement du type de produit:', error)
     productType.value = embedded ?? null
@@ -482,7 +510,6 @@ const submitEdition = async () => {
         return
       }
       toast.showSuccess('Produit mis à jour avec succès')
-      await router.push('/product-catalog')
     }
   } catch (error: any) {
     toast.showError(humanizeError(error?.message) || 'Impossible de mettre à jour le produit')

app/pages/product/create.vue

@@ -352,7 +352,7 @@ const submitCreation = async () => {
         }
       }
       toast.showSuccess('Produit créé avec succès')
-      await router.push('/product-catalog')
+      await router.push(`/product/${productId}/edit`)
     }
   } catch (error: any) {
     toast.showError(error?.message || 'Erreur lors de la création du produit')

app/services/modelTypes.ts

@@ -46,9 +46,6 @@ export interface ModelType extends BaseModelTypePayload {
   updatedAt: string;
   category: ModelCategory;
   structure: ModelTypeStructure;
-  componentSkeleton?: ComponentModelStructure | null;
-  pieceSkeleton?: PieceModelStructure | null;
-  productSkeleton?: ProductModelStructure | null;
 }
 
 export interface ModelTypeListParams {
@@ -86,42 +83,9 @@ const normalizeModelType = (item: any): ModelType => {
   if (!item || typeof item !== 'object') {
     return item as ModelType;
   }
-  if (!item.structure) {
-    if (item.category === 'COMPONENT' && item.componentSkeleton) {
-      item.structure = item.componentSkeleton;
-    } else if (item.category === 'PIECE' && item.pieceSkeleton) {
-      item.structure = item.pieceSkeleton;
-    } else if (item.category === 'PRODUCT' && item.productSkeleton) {
-      item.structure = item.productSkeleton;
-    }
-  }
   return item as ModelType;
 };
 
-const mapStructureToSkeleton = <T extends Record<string, any>>(payload: T): T => {
-  if (!payload || typeof payload !== 'object') {
-    return payload;
-  }
-  if (!('structure' in payload)) {
-    return payload;
-  }
-  const structure = (payload as any).structure;
-  if (!structure) {
-    return payload;
-  }
-  const category = (payload as any).category;
-  const next = { ...payload } as Record<string, any>;
-  if (category === 'COMPONENT') {
-    next.componentSkeleton = structure;
-  } else if (category === 'PIECE') {
-    next.pieceSkeleton = structure;
-  } else if (category === 'PRODUCT') {
-    next.productSkeleton = structure;
-  }
-  delete next.structure;
-  return next as T;
-};
-
 export async function listModelTypes(params: ModelTypeListParams = {}, opts: { signal?: AbortSignal } = {}) {
   const requestFetch = useRequestFetch();
   const query: Record<string, string | number> = {};
@@ -178,28 +142,26 @@ export async function listModelTypes(params: ModelTypeListParams = {}, opts: { s
 
 export function createModelType(payload: ModelTypePayload, opts: { signal?: AbortSignal } = {}) {
   const requestFetch = useRequestFetch();
-  const mappedPayload = mapStructureToSkeleton(payload);
   return requestFetch<ModelType>(ENDPOINT, createOptions({
     method: 'POST',
     headers: {
       'Content-Type': 'application/ld+json',
       Accept: 'application/ld+json',
     },
-    body: mappedPayload,
+    body: payload,
     signal: opts.signal,
   })).then(normalizeModelType);
 }
 
 export function updateModelType(id: string, payload: Partial<ModelTypePayload>, opts: { signal?: AbortSignal } = {}) {
   const requestFetch = useRequestFetch();
-  const mappedPayload = mapStructureToSkeleton(payload);
   return requestFetch<ModelType>(`${ENDPOINT}/${id}`, createOptions({
     method: 'PATCH',
     headers: {
       'Content-Type': 'application/merge-patch+json',
       Accept: 'application/ld+json',
     },
-    body: mappedPayload,
+    body: payload,
     signal: opts.signal,
   })).then(normalizeModelType);
 }
@@ -249,3 +211,45 @@ export function convertCategory(id: string, opts: { signal?: AbortSignal } = {})
     signal: opts.signal,
   }));
 }
+
+export interface SyncPreviewResult {
+  modelTypeId: string;
+  category: string;
+  itemCount: number;
+  additions: Record<string, number>;
+  deletions: Record<string, number>;
+  modifications: Record<string, number>;
+}
+
+export interface SyncExecuteResult {
+  itemsUpdated: number;
+  additions: Record<string, number>;
+  deletions: Record<string, number>;
+  modifications: Record<string, number>;
+}
+
+export function syncPreview(id: string, structure: unknown, opts: { signal?: AbortSignal } = {}) {
+  const requestFetch = useRequestFetch();
+  return requestFetch<SyncPreviewResult>(`${ENDPOINT}/${id}/sync-preview`, createOptions({
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'Accept': 'application/json',
+    },
+    body: { structure },
+    signal: opts.signal,
+  }));
+}
+
+export function syncExecute(id: string, confirmation: { confirmDeletions: boolean; confirmTypeChanges: boolean }, opts: { signal?: AbortSignal } = {}) {
+  const requestFetch = useRequestFetch();
+  return requestFetch<SyncExecuteResult>(`${ENDPOINT}/${id}/sync`, createOptions({
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'Accept': 'application/json',
+    },
+    body: confirmation,
+    signal: opts.signal,
+  }));
+}

app/shared/constructeurUtils.ts

@@ -155,9 +155,7 @@ export const buildConstructeurRequestPayload = <T extends Record<string, any>>(
   delete next.constructeurs;
   delete next.constructeurIds;
 
-  if (ids.length) {
+  next.constructeurs = ids.map((id) => `/api/constructeurs/${id}`);
-    next.constructeurs = ids.map((id) => `/api/constructeurs/${id}`);
-  }
 
   return next as T & { constructeurs?: string[] };
 };

app/shared/documentTypes.ts

@@ -0,0 +1,15 @@
+export const DOCUMENT_TYPES = [
+  { value: 'documentation', label: 'Documentation' },
+  { value: 'devis', label: 'Devis' },
+  { value: 'facture', label: 'Facture' },
+  { value: 'plan', label: 'Plan' },
+  { value: 'photo', label: 'Photo' },
+  { value: 'autre', label: 'Autre' },
+] as const
+
+export type DocumentTypeValue = (typeof DOCUMENT_TYPES)[number]['value']
+
+export const getDocumentTypeLabel = (value: string): string => {
+  const found = DOCUMENT_TYPES.find((t) => t.value === value)
+  return found?.label ?? value
+}

app/shared/model/componentStructure.ts

@@ -175,6 +175,9 @@ export const normalizeStructureForSave = (input: any): any => {
     if (piece.reference) {
       payload.reference = piece.reference
     }
+    if ((piece as any).quantity !== undefined && (piece as any).quantity >= 1) {
+      payload.quantity = (piece as any).quantity
+    }
     return payload
   }) as any
 

app/shared/model/componentStructureHydrate.ts

@@ -103,6 +103,7 @@ export const hydratePieces = (pieces: any[]): ComponentModelPiece[] => {
     reference: piece?.reference ?? '',
     familyCode: piece?.familyCode ?? piece?.typePiece?.code ?? '',
     role: piece?.role ?? '',
+    ...(piece?.quantity !== undefined && piece.quantity >= 1 ? { quantity: piece.quantity } : {}),
   }))
 }
 
@@ -175,6 +176,7 @@ export const mapComponentPieces = (pieces: any[]): ComponentModelPiece[] => {
     typePieceLabel: piece?.typePieceLabel ?? piece?.typePiece?.name ?? '',
     familyCode: piece?.familyCode ?? piece?.typePiece?.code ?? '',
     role: piece?.role ?? '',
+    ...(piece?.quantity !== undefined && piece.quantity >= 1 ? { quantity: piece.quantity } : {}),
   }))
 }
 

app/shared/model/componentStructureSanitize.ts

@@ -162,6 +162,8 @@ export const sanitizePieces = (pieces: any[]): ComponentModelPiece[] => {
       const rawRole = typeof piece?.role === 'string' ? piece.role.trim() : ''
       const role = rawRole.length > 0 ? rawRole : undefined
 
+      const quantity = typeof piece?.quantity === 'number' && piece.quantity >= 1 ? piece.quantity : undefined
+
       if (!typePieceId && !typePieceLabel && !reference && !familyCode) {
         return null
       }
@@ -182,6 +184,9 @@ export const sanitizePieces = (pieces: any[]): ComponentModelPiece[] => {
       if (typePieceLabel) {
         result.typePieceLabel = typePieceLabel
       }
+      if (quantity !== undefined) {
+        result.quantity = quantity
+      }
       return result
     })
     .filter((piece): piece is ComponentModelPiece => !!piece)

app/shared/model/definitionOverrides.ts

@@ -4,7 +4,7 @@ export interface DefinitionOverridePayload {
   name?: string
   reference?: string
   constructeurIds?: string[]
-  prix?: number
+  prix?: string
 }
 
 export const sanitizeDefinitionOverrides = (definition: any): DefinitionOverridePayload | null => {
@@ -41,7 +41,7 @@ export const sanitizeDefinitionOverrides = (definition: any): DefinitionOverride
   if (definition.prix !== undefined && definition.prix !== null && definition.prix !== '') {
     const parsed = Number(definition.prix)
     if (!Number.isNaN(parsed)) {
-      payload.prix = parsed
+      payload.prix = String(parsed)
     }
   }
 

app/shared/model/pieceProductStructure.ts

@@ -125,6 +125,8 @@ const hydratePieceCustomFields = (fields: any[]): PieceModelStructureEditorField
         ? field.options.join('\n')
         : '',
     orderIndex: typeof field?.orderIndex === 'number' ? field.orderIndex : index,
+    ...(field?.id ? { id: field.id } : {}),
+    ...(field?.customFieldId ? { customFieldId: field.customFieldId } : {}),
   }))
 }
 

app/shared/types/inventory.ts

@@ -21,6 +21,7 @@ export interface ComponentModelPiece {
   reference?: string
   familyCode?: string
   role?: string
+  quantity?: number
 }
 
 export interface ComponentModelProduct {
@@ -60,6 +61,8 @@ export interface PieceModelCustomField {
   key?: string
   value?: unknown
   defaultValue?: string | null
+  id?: string
+  customFieldId?: string
 }
 
 export interface PieceModelProduct {
@@ -156,6 +159,7 @@ const validatePiece = (
   const reference = ensureString(value.reference)
   const familyCode = ensureString(value.familyCode)
   const role = ensureString(value.role)
+  const quantity = typeof value.quantity === 'number' && value.quantity >= 1 ? value.quantity : undefined
 
   if (!typePieceId && !typePieceLabel && !reference && !familyCode) {
     issues.push(`${path}: au moins un identifiant, une famille ou une référence de pièce est requis`)
@@ -168,6 +172,7 @@ const validatePiece = (
     ...(reference ? { reference } : {}),
     ...(familyCode ? { familyCode } : {}),
     ...(role ? { role } : {}),
+    ...(quantity ? { quantity } : {}),
   }
 }
 

app/shared/utils/customFieldFormUtils.ts

@@ -225,7 +225,10 @@ export const buildCustomFieldInputs = (
     if (fieldName) mapByName.set(fieldName, entry)
   })
 
-  return definitions
+  const matchedIds = new Set<string>()
+  const matchedNames = new Set<string>()
+
+  const result = definitions
     .map((definition) => {
       const definitionId = definition.customFieldId || definition.id || null
       const matched = (definitionId ? mapById.get(definitionId) : null) || mapByName.get(definition.name)
@@ -239,6 +242,11 @@ export const buildCustomFieldInputs = (
         }
       }
 
+      const matchedFieldId = matched.customField?.id || matched.customFieldId || null
+      if (matchedFieldId) matchedIds.add(matchedFieldId)
+      const matchedFieldName = matched.customField?.name || matched.name || null
+      if (matchedFieldName) matchedNames.add(matchedFieldName)
+
       const resolvedValue = extractStoredCustomFieldValue(matched)
       return {
         ...definition,
@@ -253,7 +261,36 @@ export const buildCustomFieldInputs = (
         ),
       }
     })
-    .sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
+
+  // Include values with embedded definitions that didn't match any structure definition
+  valueList.forEach((entry, index) => {
+    if (!entry || typeof entry !== 'object') return
+    const cf = entry.customField
+    if (!cf || typeof cf !== 'object') return
+    const fieldId = cf.id || entry.customFieldId || null
+    const fieldName = cf.name || entry.name || null
+    if (fieldId && matchedIds.has(fieldId)) return
+    if (fieldName && matchedNames.has(fieldName)) return
+
+    const name = resolveFieldName(cf)
+    if (!name) return
+
+    const type = resolveFieldType(cf)
+    const resolvedValue = extractStoredCustomFieldValue(entry)
+    result.push({
+      id: fieldId,
+      name,
+      type,
+      required: resolveRequiredFlag(cf),
+      options: resolveOptions(cf),
+      value: formatDefaultValue(type, resolvedValue),
+      customFieldId: fieldId,
+      customFieldValueId: entry.id ?? null,
+      orderIndex: typeof cf.orderIndex === 'number' ? cf.orderIndex : definitions.length + index,
+    })
+  })
+
+  return result.sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
 }
 
 // ---------------------------------------------------------------------------

app/shared/utils/productDisplayUtils.ts

@@ -196,34 +196,19 @@ export const getProductDisplay = (
 
   const structuralCandidates = [
     source.products,
-    source.productSkeleton,
     (source.definition as AnyRecord)?.products,
-    (source.definition as AnyRecord)?.productSkeleton,
     ((source.definition as AnyRecord)?.structure as AnyRecord)?.products,
-    ((source.definition as AnyRecord)?.structure as AnyRecord)?.productSkeleton,
     (source.structure as AnyRecord)?.products,
-    (source.structure as AnyRecord)?.productSkeleton,
     (source.requirement as AnyRecord)?.products,
-    (source.requirement as AnyRecord)?.productSkeleton,
     ((source.requirement as AnyRecord)?.structure as AnyRecord)?.products,
-    ((source.requirement as AnyRecord)?.structure as AnyRecord)?.productSkeleton,
-    ((source.requirement as AnyRecord)?.componentSkeleton as AnyRecord)?.products,
     (source.typeComposant as AnyRecord)?.products,
-    (source.typeComposant as AnyRecord)?.productSkeleton,
     ((source.typeComposant as AnyRecord)?.structure as AnyRecord)?.products,
-    ((source.typeComposant as AnyRecord)?.structure as AnyRecord)?.productSkeleton,
     (source.originalComposant as AnyRecord)?.products,
-    (source.originalComposant as AnyRecord)?.productSkeleton,
     ((source.originalComposant as AnyRecord)?.definition as AnyRecord)?.products,
-    ((source.originalComposant as AnyRecord)?.definition as AnyRecord)?.productSkeleton,
     (((source.originalComposant as AnyRecord)?.definition as AnyRecord)?.structure as AnyRecord)?.products,
-    (((source.originalComposant as AnyRecord)?.definition as AnyRecord)?.structure as AnyRecord)?.productSkeleton,
     (source.originalComponent as AnyRecord)?.products,
-    (source.originalComponent as AnyRecord)?.productSkeleton,
     ((source.originalComponent as AnyRecord)?.definition as AnyRecord)?.products,
-    ((source.originalComponent as AnyRecord)?.definition as AnyRecord)?.productSkeleton,
     (((source.originalComponent as AnyRecord)?.definition as AnyRecord)?.structure as AnyRecord)?.products,
-    (((source.originalComponent as AnyRecord)?.definition as AnyRecord)?.structure as AnyRecord)?.productSkeleton,
   ]
 
   const structuralProducts = structuralCandidates

app/shared/utils/structureAssignmentHelpers.ts

@@ -176,6 +176,7 @@ export function sanitizePieceDefinition(definition: ComponentModelPiece) {
     typePieceLabel: definition.typePieceLabel ?? null,
     reference: definition.reference ?? null,
     familyCode: (definition as any).familyCode ?? null,
+    quantity: typeof (definition as any).quantity === 'number' ? (definition as any).quantity : null,
   })
 }
 

app/shared/utils/structureSelectionUtils.ts

@@ -3,6 +3,9 @@ export type SelectionEntry = {
   path: string
   requirementLabel: string
   resolvedName: string
+  quantity?: number
+  slotId?: string
+  _definition?: Record<string, any>
 }
 
 export type StructureSelectionResult = {
@@ -59,6 +62,9 @@ export function collectStructureSelections(
         path: isNonEmptyString(entry?.path) ? entry.path : `${nodePath}:piece-${index + 1}`,
         requirementLabel: resolvers.resolvePieceLabel(definition),
         resolvedName: catalogPiece?.name || selectedId,
+        quantity: typeof definition?.quantity === 'number' ? definition.quantity : undefined,
+        slotId: isNonEmptyString(entry?.slotId) ? entry.slotId : undefined,
+        _definition: definition,
       })
     })
 

tests/components/ModelTypeForm.test.ts

@@ -225,56 +225,6 @@ describe('category lock', () => {
   })
 })
 
-// ---------------------------------------------------------------------------
-// Restricted mode
-// ---------------------------------------------------------------------------
-describe('restricted mode', () => {
-  it('shows restricted mode message', () => {
-    const wrapper = mountForm({
-      restrictedMode: true,
-      restrictedModeMessage: 'Mode restreint actif',
-    })
-    expect(wrapper.text()).toContain('Mode restreint actif')
-    expect(wrapper.find('.alert-info').exists()).toBe(true)
-  })
-
-  it('does not show restricted mode message when not restricted', () => {
-    const wrapper = mountForm({
-      restrictedMode: false,
-    })
-    expect(wrapper.find('.alert-info').exists()).toBe(false)
-  })
-
-  it('disables name input in restricted mode', () => {
-    const wrapper = mountForm({ restrictedMode: true })
-    expect((getNameInput(wrapper).element as HTMLInputElement).disabled).toBe(true)
-  })
-})
-
-// ---------------------------------------------------------------------------
-// Submit disabled
-// ---------------------------------------------------------------------------
-describe('submit disabled', () => {
-  it('disables submit button when disableSubmit is true', () => {
-    const wrapper = mountForm({ disableSubmit: true })
-    expect((getSubmitButton(wrapper).element as HTMLButtonElement).disabled).toBe(true)
-  })
-
-  it('shows warning alert when disableSubmit is true', () => {
-    const wrapper = mountForm({
-      disableSubmit: true,
-      disableSubmitMessage: 'Cannot save now',
-    })
-    expect(wrapper.find('.alert-warning').exists()).toBe(true)
-    expect(wrapper.text()).toContain('Cannot save now')
-  })
-
-  it('does not show warning when disableSubmit is false', () => {
-    const wrapper = mountForm({ disableSubmit: false })
-    expect(wrapper.find('.alert-warning').exists()).toBe(false)
-  })
-})
-
 // ---------------------------------------------------------------------------
 // Saving state
 // ---------------------------------------------------------------------------

tests/components/PieceModelStructureEditor.test.ts

@@ -227,98 +227,6 @@ describe('required checkbox', () => {
   })
 })
 
-// ---------------------------------------------------------------------------
-// Restricted mode
-// ---------------------------------------------------------------------------
-describe('restricted mode', () => {
-  it('allows editing name of pre-existing field', () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: {
-        customFields: [{ name: 'Locked Field', type: 'text', required: false, orderIndex: 0 }],
-        products: [],
-      },
-    })
-
-    const nameInput = wrapper.find('input[type="text"]')
-    expect((nameInput.element as HTMLInputElement).disabled).toBe(false)
-  })
-
-  it('disables type select for pre-existing field', () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: {
-        customFields: [{ name: 'Locked', type: 'text', required: false, orderIndex: 0 }],
-        products: [],
-      },
-    })
-
-    const selects = wrapper.findAll('select')
-    const typeSelect = selects[selects.length - 1]
-    expect((typeSelect.element as HTMLSelectElement).disabled).toBe(true)
-  })
-
-  it('disables required checkbox for pre-existing field', () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: {
-        customFields: [{ name: 'Locked', type: 'text', required: false, orderIndex: 0 }],
-        products: [],
-      },
-    })
-
-    const checkbox = wrapper.find('input[type="checkbox"]')
-    expect((checkbox.element as HTMLInputElement).disabled).toBe(true)
-  })
-
-  it('hides delete button for pre-existing field', () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: {
-        customFields: [{ name: 'Locked', type: 'text', required: false, orderIndex: 0 }],
-        products: [],
-      },
-    })
-
-    // btn-error should not exist for locked fields
-    const deleteBtn = wrapper.find('button.btn-error')
-    expect(deleteBtn.exists()).toBe(false)
-  })
-
-  it('allows full editing of newly added field', async () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: {
-        customFields: [],
-        products: [],
-      },
-    })
-
-    await getAddFieldButton(wrapper).trigger('click')
-    await nextTick()
-
-    // New field should have an editable type select (not disabled)
-    const selects = wrapper.findAll('select')
-    const typeSelect = selects[selects.length - 1]
-    expect((typeSelect.element as HTMLSelectElement).disabled).toBe(false)
-
-    // Delete button should exist for new field
-    const deleteBtn = wrapper.find('button.btn-error')
-    expect(deleteBtn.exists()).toBe(true)
-  })
-
-  it('hides product add button in restricted mode', () => {
-    const wrapper = mountEditor({
-      restrictedMode: true,
-      modelValue: { customFields: [], products: [] },
-    })
-
-    const addButtons = wrapper.findAll('button').filter(b => b.text().includes('Ajouter'))
-    // Only the "add field" button should be visible, not the product one
-    expect(addButtons.length).toBe(1)
-  })
-})
-
 // ---------------------------------------------------------------------------
 // Add product
 // ---------------------------------------------------------------------------

tests/composables/useCategoryEditGuard.test.ts

@@ -1,269 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest'
-
-import { useCategoryEditGuard } from '~/composables/useCategoryEditGuard'
-
-// ---------------------------------------------------------------------------
-// Mocks
-// ---------------------------------------------------------------------------
-
-const mockGet = vi.fn()
-const mockShowInfo = vi.fn()
-
-vi.mock('~/composables/useApi', () => ({
-  useApi: () => ({
-    get: mockGet,
-    post: vi.fn(),
-    patch: vi.fn(),
-    put: vi.fn(),
-    delete: vi.fn(),
-    apiCall: vi.fn(),
-  }),
-}))
-
-vi.mock('~/composables/useToast', () => ({
-  useToast: () => ({
-    showInfo: mockShowInfo,
-    showSuccess: vi.fn(),
-    showError: vi.fn(),
-    showToast: vi.fn(),
-    toasts: { value: [] },
-    clearAll: vi.fn(),
-  }),
-}))
-
-const GUARD_CONFIG = {
-  endpoint: '/composants',
-  filterKey: 'typeComposant',
-  labels: {
-    singular: 'composant',
-    plural: 'composants',
-    verifying: 'Vérification des composants liés en cours…',
-  },
-}
-
-beforeEach(() => {
-  vi.clearAllMocks()
-})
-
-// ---------------------------------------------------------------------------
-// Initial state
-// ---------------------------------------------------------------------------
-describe('initial state', () => {
-  it('has linkedCount 0 and restrictedMode false', () => {
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    expect(guard.linkedCount.value).toBe(0)
-    expect(guard.isRestrictedMode.value).toBe(false)
-    expect(guard.isSubmitBlocked.value).toBe(false)
-    expect(guard.linkedLoading.value).toBe(false)
-  })
-
-  it('has empty messages when no linked items', () => {
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    expect(guard.restrictedModeMessage.value).toBe('')
-    expect(guard.submitBlockMessage.value).toBe('')
-  })
-})
-
-// ---------------------------------------------------------------------------
-// loadLinkedCount
-// ---------------------------------------------------------------------------
-describe('loadLinkedCount', () => {
-  it('sets linkedCount from API totalItems', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 5, member: [] },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(5)
-    expect(guard.isRestrictedMode.value).toBe(true)
-    expect(mockGet).toHaveBeenCalledWith(
-      expect.stringContaining('/composants?'),
-    )
-  })
-
-  it('sets linkedCount 0 when API returns 0 items', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 0, member: [] },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(0)
-    expect(guard.isRestrictedMode.value).toBe(false)
-  })
-
-  it('extracts totalItems from hydra:totalItems format', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { 'hydra:totalItems': 3, 'hydra:member': [{}, {}, {}] },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(3)
-  })
-
-  it('falls back to member.length when no totalItems', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { member: [{}, {}] },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(2)
-  })
-
-  it('falls back to hydra:member.length', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { 'hydra:member': [{}] },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(1)
-  })
-
-  it('sets linkedCount 0 on API failure', async () => {
-    mockGet.mockResolvedValue({ success: false })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(0)
-    expect(guard.isRestrictedMode.value).toBe(false)
-  })
-
-  it('sets linkedCount 0 on exception', async () => {
-    mockGet.mockRejectedValue(new Error('Network error'))
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedCount.value).toBe(0)
-  })
-
-  it('sends correct filter parameters', async () => {
-    mockGet.mockResolvedValue({ success: true, data: { totalItems: 0 } })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('abc-123')
-
-    const callUrl = mockGet.mock.calls[0][0] as string
-    expect(callUrl).toContain('itemsPerPage=1')
-    expect(callUrl).toContain('typeComposant=%2Fapi%2Fmodel_types%2Fabc-123')
-  })
-})
-
-// ---------------------------------------------------------------------------
-// restrictedModeMessage
-// ---------------------------------------------------------------------------
-describe('restrictedModeMessage', () => {
-  it('shows singular message for 1 linked item', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 1 },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.restrictedModeMessage.value).toContain('1 composant')
-    expect(guard.restrictedModeMessage.value).toContain('Mode restreint')
-  })
-
-  it('shows plural message for multiple linked items', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 5 },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.restrictedModeMessage.value).toContain('5 composants')
-    expect(guard.restrictedModeMessage.value).toContain('renommer les existants')
-  })
-
-  it('uses custom labels from config', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 3 },
-    })
-
-    const guard = useCategoryEditGuard({
-      endpoint: '/pieces',
-      filterKey: 'typePiece',
-      labels: { singular: 'pièce', plural: 'pièces', verifying: 'Vérification...' },
-    })
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.restrictedModeMessage.value).toContain('3 pièces')
-  })
-})
-
-// ---------------------------------------------------------------------------
-// isSubmitBlocked & submitBlockMessage
-// ---------------------------------------------------------------------------
-describe('submit blocking', () => {
-  it('blocks submit during loading', () => {
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    // Simulate loading state by starting a load without awaiting
-    mockGet.mockReturnValue(new Promise(() => {})) // Never resolves
-    guard.loadLinkedCount('mt-1')
-
-    expect(guard.linkedLoading.value).toBe(true)
-    expect(guard.isSubmitBlocked.value).toBe(true)
-    expect(guard.submitBlockMessage.value).toBe(GUARD_CONFIG.labels.verifying)
-  })
-
-  it('unblocks submit after loading completes', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 5 },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.isSubmitBlocked.value).toBe(false)
-    expect(guard.submitBlockMessage.value).toBe('')
-  })
-})
-
-// ---------------------------------------------------------------------------
-// guardSubmitOrNotify
-// ---------------------------------------------------------------------------
-describe('guardSubmitOrNotify', () => {
-  it('returns false when not blocked', async () => {
-    mockGet.mockResolvedValue({
-      success: true,
-      data: { totalItems: 0 },
-    })
-
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    await guard.loadLinkedCount('mt-1')
-
-    expect(guard.guardSubmitOrNotify()).toBe(false)
-    expect(mockShowInfo).not.toHaveBeenCalled()
-  })
-
-  it('returns true and shows info when blocked', () => {
-    const guard = useCategoryEditGuard(GUARD_CONFIG)
-    // Simulate loading
-    mockGet.mockReturnValue(new Promise(() => {}))
-    guard.loadLinkedCount('mt-1')
-
-    expect(guard.guardSubmitOrNotify()).toBe(true)
-    expect(mockShowInfo).toHaveBeenCalled()
-  })
-})

tests/services/modelTypes.test.ts

@@ -50,60 +50,55 @@ beforeEach(() => {
 // normalizeModelType (tested via getModelType which calls .then(normalizeModelType))
 // ---------------------------------------------------------------------------
 describe('normalizeModelType (via getModelType)', () => {
-  it('maps componentSkeleton to structure for COMPONENT', async () => {
+  it('returns structure as-is for COMPONENT', async () => {
-    const skeleton = { customFields: [{ name: 'Weight' }] }
+    const structure = { customFields: [{ name: 'Weight' }] }
     mockFetch.mockResolvedValue(fakeModelType({
       category: 'COMPONENT',
-      structure: null,
+      structure: structure as any,
-      componentSkeleton: skeleton as any,
     }))
 
     const result = await getModelType('mt-1')
-    expect(result.structure).toEqual(skeleton)
+    expect(result.structure).toEqual(structure)
   })
 
-  it('maps pieceSkeleton to structure for PIECE', async () => {
+  it('returns structure as-is for PIECE', async () => {
-    const skeleton = { customFields: [{ name: 'Size' }] }
+    const structure = { customFields: [{ name: 'Size' }] }
     mockFetch.mockResolvedValue(fakeModelType({
       category: 'PIECE',
-      structure: null,
+      structure: structure as any,
-      pieceSkeleton: skeleton as any,
     }))
 
     const result = await getModelType('mt-1')
-    expect(result.structure).toEqual(skeleton)
+    expect(result.structure).toEqual(structure)
   })
 
-  it('maps productSkeleton to structure for PRODUCT', async () => {
+  it('returns structure as-is for PRODUCT', async () => {
-    const skeleton = { customFields: [{ name: 'Brand' }] }
+    const structure = { customFields: [{ name: 'Brand' }] }
     mockFetch.mockResolvedValue(fakeModelType({
       category: 'PRODUCT',
-      structure: null,
+      structure: structure as any,
-      productSkeleton: skeleton as any,
     }))
 
     const result = await getModelType('mt-1')
-    expect(result.structure).toEqual(skeleton)
+    expect(result.structure).toEqual(structure)
   })
 
-  it('does not override existing structure', async () => {
+  it('preserves null structure', async () => {
-    const existing = { customFields: [{ name: 'Existing' }] }
     mockFetch.mockResolvedValue(fakeModelType({
       category: 'COMPONENT',
-      structure: existing as any,
+      structure: null,
-      componentSkeleton: { customFields: [{ name: 'Skeleton' }] } as any,
     }))
 
     const result = await getModelType('mt-1')
-    expect(result.structure).toEqual(existing)
+    expect(result.structure).toBeNull()
   })
 })
 
 // ---------------------------------------------------------------------------
-// createModelType — maps structure to skeleton
+// createModelType — sends structure directly
 // ---------------------------------------------------------------------------
 describe('createModelType', () => {
-  it('sends POST with componentSkeleton for COMPONENT', async () => {
+  it('sends POST with structure for COMPONENT', async () => {
     const structure = { customFields: [] }
     mockFetch.mockResolvedValue(fakeModelType())
 
@@ -120,11 +115,10 @@ describe('createModelType', () => {
     const [endpoint, options] = mockFetch.mock.calls[0]
     expect(endpoint).toBe('/model_types')
     expect(options.method).toBe('POST')
-    expect(options.body.componentSkeleton).toEqual(structure)
+    expect(options.body.structure).toEqual(structure)
-    expect(options.body.structure).toBeUndefined()
   })
 
-  it('sends POST with pieceSkeleton for PIECE', async () => {
+  it('sends POST with structure for PIECE', async () => {
     const structure = { customFields: [], products: [] }
     mockFetch.mockResolvedValue(fakeModelType({ category: 'PIECE' }))
 
@@ -136,11 +130,10 @@ describe('createModelType', () => {
     })
 
     const [, options] = mockFetch.mock.calls[0]
-    expect(options.body.pieceSkeleton).toEqual(structure)
+    expect(options.body.structure).toEqual(structure)
-    expect(options.body.structure).toBeUndefined()
   })
 
-  it('sends POST with productSkeleton for PRODUCT', async () => {
+  it('sends POST with structure for PRODUCT', async () => {
     const structure = { customFields: [] }
     mockFetch.mockResolvedValue(fakeModelType({ category: 'PRODUCT' }))
 
@@ -152,15 +145,15 @@ describe('createModelType', () => {
     })
 
     const [, options] = mockFetch.mock.calls[0]
-    expect(options.body.productSkeleton).toEqual(structure)
+    expect(options.body.structure).toEqual(structure)
   })
 })
 
 // ---------------------------------------------------------------------------
-// updateModelType — maps structure to skeleton
+// updateModelType — sends structure directly
 // ---------------------------------------------------------------------------
 describe('updateModelType', () => {
-  it('sends PATCH with correct endpoint and skeleton', async () => {
+  it('sends PATCH with correct endpoint and structure', async () => {
     const structure = { customFields: [{ name: 'Updated' }] }
     mockFetch.mockResolvedValue(fakeModelType())
 
@@ -176,10 +169,10 @@ describe('updateModelType', () => {
     expect(endpoint).toBe('/model_types/mt-1')
     expect(options.method).toBe('PATCH')
     expect(options.headers['Content-Type']).toBe('application/merge-patch+json')
-    expect(options.body.componentSkeleton).toEqual(structure)
+    expect(options.body.structure).toEqual(structure)
   })
 
-  it('sends payload without skeleton when no structure', async () => {
+  it('sends payload without structure when not provided', async () => {
     mockFetch.mockResolvedValue(fakeModelType())
 
     await updateModelType('mt-1', {
@@ -189,7 +182,7 @@ describe('updateModelType', () => {
     })
 
     const [, options] = mockFetch.mock.calls[0]
-    expect(options.body.componentSkeleton).toBeUndefined()
+    expect(options.body.structure).toBeUndefined()
     expect(options.body.name).toBe('Just Name')
   })
 })