wip: machine create skeleton links

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

@@ -400,6 +400,7 @@ import DocumentUpload from '~/components/DocumentUpload.vue'
 import DocumentPreviewModal from '~/components/DocumentPreviewModal.vue'
 import { useComponentTypes } from '~/composables/useComponentTypes'
 import { useComposants } from '~/composables/useComposants'
+import { usePieceTypes } from '~/composables/usePieceTypes'
 import { useCustomFields } from '~/composables/useCustomFields'
 import { useApi } from '~/composables/useApi'
 import { useToast } from '~/composables/useToast'
@@ -434,6 +435,7 @@ const route = useRoute()
 const router = useRouter()
 const { get } = useApi()
 const { componentTypes, loadComponentTypes } = useComponentTypes()
+const { pieceTypes, loadPieceTypes } = usePieceTypes()
 const { updateComposant } = useComposants()
 const { ensureConstructeurs } = useConstructeurs()
 const { upsertCustomFieldValue, updateCustomFieldValue, getCustomFieldValuesByEntity } = useCustomFields()
@@ -500,6 +502,16 @@ const documentPreviewSrc = (document: any) => {
   }
   return document.path
 }
+
+const fetchedPieceTypeMap = ref<Record<string, string>>({})
+const pieceTypeLabelMap = computed(() => ({
+  ...Object.fromEntries(
+    (pieceTypes.value || [])
+      .filter((type: any) => type?.id)
+      .map((type: any) => [type.id, type.name || type.code || '']),
+  ),
+  ...fetchedPieceTypeMap.value,
+}))
 const documentThumbnailClass = (document: any) => {
   if (shouldInlinePdf(document) || (isImageDocument(document) && document?.path)) {
     return 'h-24 w-20'
@@ -1023,6 +1035,8 @@ const resolvePieceLabel = (piece: Record<string, any>) => {
     parts.push(piece.typePiece.name)
   } else if (piece.typePieceLabel) {
     parts.push(piece.typePieceLabel)
+  } else if (piece.typePieceId && pieceTypeLabelMap.value[piece.typePieceId]) {
+    parts.push(pieceTypeLabelMap.value[piece.typePieceId])
   } else if (piece.typePiece?.code) {
     parts.push(`Famille ${piece.typePiece.code}`)
   } else if (piece.familyCode) {
@@ -1033,6 +1047,42 @@ const resolvePieceLabel = (piece: Record<string, any>) => {
   return parts.length ? parts.join(' • ') : 'Pièce'
 }
 
+const fetchPieceTypeNames = async (ids: string[]) => {
+  const missing = ids.filter((id) => id && !pieceTypeLabelMap.value[id])
+  if (!missing.length) {
+    return
+  }
+  const results = await Promise.allSettled(
+    missing.map((id) => get(`/model_types/${id}`)),
+  )
+  const next = { ...fetchedPieceTypeMap.value }
+  results.forEach((result, index) => {
+    if (result.status !== 'fulfilled') {
+      return
+    }
+    const data = result.value?.data
+    const name = data?.name || data?.code
+    if (name) {
+      next[missing[index]] = name
+    }
+  })
+  fetchedPieceTypeMap.value = next
+}
+
+watch(
+  selectedTypeStructure,
+  (structure) => {
+    const ids = getStructurePieces(structure)
+      .map((piece: any) => piece?.typePieceId)
+      .filter((id: any): id is string => typeof id === 'string' && id.trim().length > 0)
+    if (!ids.length) {
+      return
+    }
+    fetchPieceTypeNames(Array.from(new Set(ids))).catch(() => {})
+  },
+  { immediate: true },
+)
+
 const resolveSubcomponentLabel = (node: Record<string, any>) => {
   const parts: string[] = []
   if (node.alias) {
@@ -1158,7 +1208,7 @@ const saveCustomFieldValues = async (updatedComponent: any) => {
 }
 
 onMounted(async () => {
-  await Promise.allSettled([loadComponentTypes(), fetchComponent()])
+  await Promise.allSettled([loadComponentTypes(), loadPieceTypes(), fetchComponent()])
   loading.value = false
   if (component.value?.id) {
     await refreshDocuments()

app/pages/component/create.vue

@@ -355,6 +355,7 @@ import { usePieces } from '~/composables/usePieces'
 import { usePieceTypes } from '~/composables/usePieceTypes'
 import { useProducts } from '~/composables/useProducts'
 import { useProductTypes } from '~/composables/useProductTypes'
+import { useApi } from '~/composables/useApi'
 import { useToast } from '~/composables/useToast'
 import { useCustomFields } from '~/composables/useCustomFields'
 import { useDocuments } from '~/composables/useDocuments'
@@ -375,6 +376,7 @@ interface ComponentCatalogType extends ModelType {
 
 const route = useRoute()
 const router = useRouter()
+const { get } = useApi()
 
 const { componentTypes, loadComponentTypes, loadingComponentTypes } = useComponentTypes()
 const { pieceTypes, loadPieceTypes } = usePieceTypes()
@@ -418,13 +420,15 @@ const structureDataLoading = computed(
   () => piecesLoading.value || componentsLoading.value || productsLoading.value,
 )
 
-const pieceTypeLabelMap = computed(() =>
-  Object.fromEntries(
+const fetchedPieceTypeMap = ref<Record<string, string>>({})
+const pieceTypeLabelMap = computed(() => ({
+  ...Object.fromEntries(
     (pieceTypes.value || [])
       .filter((type: any) => type?.id)
       .map((type: any) => [type.id, type.name || type.code || '']),
   ),
-)
+  ...fetchedPieceTypeMap.value,
+}))
 const productTypeLabelMap = computed(() =>
   Object.fromEntries(
     (productTypes.value || [])
@@ -804,6 +808,8 @@ const resolvePieceLabel = (piece: Record<string, any>) => {
     parts.push(piece.typePiece.name)
   } else if (piece.typePieceLabel) {
     parts.push(piece.typePieceLabel)
+  } else if (piece.typePieceId && pieceTypeLabelMap.value[piece.typePieceId]) {
+    parts.push(pieceTypeLabelMap.value[piece.typePieceId])
   } else if (piece.typePiece?.code) {
     parts.push(`Famille ${piece.typePiece.code}`)
   } else if (piece.familyCode) {
@@ -814,6 +820,42 @@ const resolvePieceLabel = (piece: Record<string, any>) => {
   return parts.length ? parts.join(' • ') : 'Pièce'
 }
 
+const fetchPieceTypeNames = async (ids: string[]) => {
+  const missing = ids.filter((id) => id && !pieceTypeLabelMap.value[id])
+  if (!missing.length) {
+    return
+  }
+  const results = await Promise.allSettled(
+    missing.map((id) => get(`/model_types/${id}`)),
+  )
+  const next = { ...fetchedPieceTypeMap.value }
+  results.forEach((result, index) => {
+    if (result.status !== 'fulfilled') {
+      return
+    }
+    const data = result.value?.data
+    const name = data?.name || data?.code
+    if (name) {
+      next[missing[index]] = name
+    }
+  })
+  fetchedPieceTypeMap.value = next
+}
+
+watch(
+  selectedTypeStructure,
+  (structure) => {
+    const ids = getStructurePieces(structure)
+      .map((piece: any) => piece?.typePieceId)
+      .filter((id: any): id is string => typeof id === 'string' && id.trim().length > 0)
+    if (!ids.length) {
+      return
+    }
+    fetchPieceTypeNames(Array.from(new Set(ids))).catch(() => {})
+  },
+  { immediate: true },
+)
+
 const resolveProductLabel = (product: Record<string, any>) => {
   const parts: string[] = []
   if (product.role) {