fix(slots) : filter slot select options server-side instead of client-side

PieceSelect, ProductSelect and ComposantSelect were loading up to 200
items then filtering client-side by typeId. If the matching items were
not in the first 200, the dropdown appeared empty.

Now each select component uses API Platform filters (typePiece,
typeProduct, typeComposant) to fetch only relevant items server-side,
with local state to avoid overwriting the global catalog cache.

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

app/components/PieceSelect.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 { usePieces } from '~/composables/usePieces'
 
@@ -52,43 +52,39 @@ const emit = defineEmits<{
   (e: 'update:modelValue', value: string | null): void
 }>()
 
-const { pieces, loading, loadPieces } = usePieces()
+const { loading: globalLoading, loadPieces } = usePieces()
 
-const pieceOptions = computed(() => {
-  const baseOptions = Array.isArray(pieces.value) ? pieces.value : []
-  if (!props.typePieceId) {
-    return baseOptions
+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
+    }
   }
-
-  const allowedTypeId = String(props.typePieceId)
-  return baseOptions.filter((piece: any) => {
-    const typeId =
-      piece?.typePieceId ||
-      piece?.typePiece?.id ||
-      null
-    return typeId ? String(typeId) === allowedTypeId : false
-  })
-})
+  catch (error: unknown) {
+    console.error('Erreur lors du chargement des pièces:', error)
+  }
+  finally {
+    localLoading.value = false
+  }
+}
 
 onMounted(() => {
-  if (pieceOptions.value.length === 0) {
-    loadPieces({ itemsPerPage: 200 }).catch((error: unknown) => {
-      console.error('Erreur lors du chargement des pièces:', error)
-    })
-  }
+  loadFilteredPieces()
 })
 
 watch(
-  () => props.modelValue,
-  (value) => {
-    if (typeof value === 'string' && value) {
-      const exists = pieceOptions.value.some((piece: any) => piece.id === value)
-      if (!exists && !loading.value) {
-        loadPieces({ itemsPerPage: 200, force: true }).catch((error: unknown) => {
-          console.error('Erreur lors du chargement des pièces:', error)
-        })
-      }
-    }
+  () => props.typePieceId,
+  () => {
+    loadFilteredPieces()
   },
 )