refactor(machines) : remove TypeMachine skeleton system, simplify machine creation

- Remove TypeEdit*, TypeInfoDisplay, MachineSkeletonSummary, MachineCreatePreview components
- Remove machine-skeleton pages and type pages
- Remove useMachineTypesApi, useMachineSkeletonEditor, useMachineCreateSelections composables
- Add AddEntityToMachineModal for direct entity linking
- Update machine detail/create pages for direct custom fields
- Fix SearchSelect, category display, and ipartial search filters

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/components/PieceItem.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="border border-gray-200 rounded-lg p-4">
+  <div class="space-y-4">
     <DocumentPreviewModal
       :document="previewDocument"
       :visible="previewVisible"
@@ -7,58 +7,53 @@
       @close="closePreview"
     />
 
-    <div class="flex items-center justify-between mb-3">
-      <div class="flex items-center gap-2">
-        <IconLucidePackage class="w-4 h-4 text-purple-500" aria-hidden="true" />
-        <input
-          v-if="isEditMode"
-          :id="`piece-name-${piece.id}`"
-          v-model="pieceData.name"
-          type="text"
-          class="font-semibold text-lg input input-sm input-bordered"
-          @blur="updatePiece"
-        />
-        <div
-          v-else
-          class="font-semibold text-lg input input-sm input-bordered bg-base-200"
+    <!-- Piece Header (collapsible, same pattern as ComponentItem) -->
+    <div class="flex items-start justify-between p-4 bg-base-200 rounded-lg">
+      <div class="flex items-start gap-3 w-full">
+        <button
+          type="button"
+          class="btn btn-ghost btn-sm btn-circle shrink-0 transition-transform"
+          :class="{ 'rotate-90': !isCollapsed }"
+          :aria-expanded="!isCollapsed"
+          :title="isCollapsed ? 'Déplier les détails de la pièce' : 'Replier les détails de la pièce'"
+          @click="toggleCollapse"
         >
-          {{ pieceData.name }}
+          <IconLucideChevronRight class="w-5 h-5 transition-transform" aria-hidden="true" />
+          <span class="sr-only">{{ isCollapsed ? 'Déplier' : 'Replier' }} la pièce</span>
+        </button>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold">
+            {{ pieceData.name }}
+          </h3>
+          <div class="flex flex-wrap gap-2 mt-2">
+            <span v-if="piece.parentComponentName" class="badge badge-ghost badge-sm">
+              Rattachée à {{ piece.parentComponentName }}
+            </span>
+            <span v-if="pieceData.reference" class="badge badge-outline badge-sm">{{ pieceData.reference }}</span>
+            <template v-if="pieceConstructeursDisplay.length">
+              <span
+                v-for="constructeur in pieceConstructeursDisplay"
+                :key="constructeur.id"
+                class="badge badge-outline badge-sm"
+              >
+                {{ constructeur.name }}
+              </span>
+            </template>
+            <span v-if="pieceData.prix" class="badge badge-primary badge-sm">{{ pieceData.prix }}€</span>
+            <span
+              v-if="displayProductName"
+              class="badge badge-info badge-sm"
+            >
+              Produit&nbsp;: {{ displayProductName }}
+            </span>
+          </div>
         </div>
       </div>
-      <div class="flex flex-wrap items-center gap-2 text-xs">
-        <span
-          v-if="piece.skeletonOnly"
-          class="badge badge-warning badge-sm"
-        >
-          Défini dans le catalogue
-        </span>
-        <span
-          v-if="piece.typeMachinePieceRequirement"
-          class="badge badge-outline badge-sm"
-        >
-          Groupe :
-          {{
-            piece.typeMachinePieceRequirement.label ||
-            piece.typeMachinePieceRequirement.typePiece?.name ||
-            "Non défini"
-          }}
-        </span>
-        <span
-          v-if="piece.parentComponentName"
-          class="badge badge-ghost badge-sm"
-        >
-          Rattachée à {{ piece.parentComponentName }}
-        </span>
-        <span
-          v-if="displayProductName"
-          class="badge badge-info badge-sm"
-        >
-          Produit&nbsp;: {{ displayProductName }}
-        </span>
-      </div>
     </div>
 
-    <div class="space-y-2 text-sm">
+    <div v-show="!isCollapsed" class="space-y-4">
+      <div class="p-4 bg-base-100 border border-gray-200 rounded-lg">
+        <div class="space-y-2 text-sm">
       <div>
         <span class="font-medium">Référence:</span>
         <input
@@ -236,6 +231,7 @@
         </div>
       </div>
     </div>
+      </div>
 
     <!-- Champs personnalisés de la pièce -->
     <div
@@ -480,16 +476,17 @@
         Aucun document lié à cette pièce.
       </p>
     </div>
+    </div>
   </div>
 </template>
 
 <script setup>
-import { reactive, onMounted, watch, computed } from 'vue'
+import { reactive, ref, onMounted, watch, computed } from 'vue'
 import ConstructeurSelect from './ConstructeurSelect.vue'
 import ProductSelect from '~/components/ProductSelect.vue'
 import DocumentUpload from '~/components/DocumentUpload.vue'
 import DocumentPreviewModal from '~/components/DocumentPreviewModal.vue'
-import IconLucidePackage from '~icons/lucide/package'
+import IconLucideChevronRight from '~icons/lucide/chevron-right'
 import { canPreviewDocument, isImageDocument } from '~/utils/documentPreview'
 import { useConstructeurs } from '~/composables/useConstructeurs'
 import { useProducts } from '~/composables/useProducts'
@@ -523,6 +520,8 @@ import { useEntityCustomFields } from '~/composables/useEntityCustomFields'
 const props = defineProps({
   piece: { type: Object, required: true },
   isEditMode: { type: Boolean, default: false },
+  collapseAll: { type: Boolean, default: true },
+  toggleToken: { type: Number, default: 0 },
 })
 
 const emit = defineEmits(['update', 'edit', 'custom-field-update'])
@@ -576,6 +575,23 @@ const {
   updateCustomField,
 } = useEntityCustomFields({ entity: () => props.piece, entityType: 'piece' })
 
+// --- Collapse state ---
+const isCollapsed = ref(true)
+
+watch(
+  () => props.toggleToken,
+  () => {
+    isCollapsed.value = props.collapseAll
+    if (!isCollapsed.value) refreshDocuments()
+  },
+  { immediate: true },
+)
+
+const toggleCollapse = () => {
+  isCollapsed.value = !isCollapsed.value
+  if (!isCollapsed.value) refreshDocuments()
+}
+
 // --- Constructeurs ---
 const { constructeurs } = useConstructeurs()