feat: add product catalogue and product-aware UI

- introduce product catalogue pages, management view entries and shared product composables\n- wire product selection into component/piece flows and machine skeleton requirements\n- display linked product metadata and documents across machine, component and piece views\n- generalize model type tooling to handle PRODUCT category

app/pages/machine-skeleton/index.vue

@@ -58,6 +58,13 @@
                   pièces</span
                 >
               </div>
+              <div class="flex items-center gap-2">
+                <IconLucideBox class="w-4 h-4" aria-hidden="true" />
+                <span
+                  >{{ type.productRequirements?.length || 0 }} produit(s)
+                  requis</span
+                >
+              </div>
             </div>
             <div class="card-actions justify-end mt-4">
               <button
@@ -99,6 +106,7 @@ import { useToast } from "~/composables/useToast";
 import IconLucidePlus from "~icons/lucide/plus";
 import IconLucidePackage from "~icons/lucide/package";
 import IconLucideLayoutGrid from "~icons/lucide/layout-grid";
+import IconLucideBox from "~icons/lucide/box";
 
 const { machineTypes, loading, loadMachineTypes, deleteMachineType } =
   useMachineTypesApi();

app/pages/machine-skeleton/new.vue

@@ -65,6 +65,10 @@
                     <IconLucideList class="h-4 w-4" aria-hidden="true" />
                     {{ type.pieceRequirements?.length || 0 }} groupe(s) de pièces
                   </span>
+                  <span class="inline-flex items-center gap-1">
+                    <IconLucideBox class="h-4 w-4" aria-hidden="true" />
+                    {{ type.productRequirements?.length || 0 }} produit(s)
+                  </span>
                 </div>
               </div>
             </article>
@@ -85,6 +89,7 @@ import { useToast } from '~/composables/useToast'
 import IconLucidePlus from '~icons/lucide/plus'
 import IconLucideClipboardList from '~icons/lucide/clipboard-list'
 import IconLucideList from '~icons/lucide/list'
+import IconLucideBox from '~icons/lucide/box'
 
 const { machineTypes, loadMachineTypes, createMachineType } = useMachineTypesApi()
 const { showError } = useToast()
@@ -100,7 +105,8 @@ const createEmptyType = () => ({
   maintenanceFrequency: '',
   customFields: [],
   componentRequirements: [],
-  pieceRequirements: []
+  pieceRequirements: [],
+  productRequirements: []
 })
 
 const draftType = ref(createEmptyType())
@@ -187,6 +193,21 @@ const normalizePieceRequirements = (requirements = []) =>
     .sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
     .map((req, index) => ({ ...req, orderIndex: index }))
 
+const normalizeProductRequirements = (requirements = []) =>
+  requirements
+    .filter(req => req?.typeProductId)
+    .map((req, index) => ({
+      typeProductId: req.typeProductId,
+      label: req.label?.trim() ? req.label.trim() : undefined,
+      minCount: toIntegerOrNull(req.minCount, 0),
+      maxCount: toIntegerOrNull(req.maxCount, null),
+      required: req.required ?? false,
+      allowNewModels: req.allowNewModels ?? true,
+      orderIndex: typeof req.orderIndex === 'number' ? req.orderIndex : index
+    }))
+    .sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
+    .map((req, index) => ({ ...req, orderIndex: index }))
+
 const buildPayload = typeData => ({
   name: typeData.name,
   description: typeData.description,
@@ -194,7 +215,8 @@ const buildPayload = typeData => ({
   maintenanceFrequency: typeData.maintenanceFrequency,
   customFields: normalizeCustomFields(typeData.customFields),
   componentRequirements: normalizeComponentRequirements(typeData.componentRequirements),
-  pieceRequirements: normalizePieceRequirements(typeData.pieceRequirements)
+  pieceRequirements: normalizePieceRequirements(typeData.pieceRequirements),
+  productRequirements: normalizeProductRequirements(typeData.productRequirements)
 })
 
 const resetForm = () => {