MALIO-DEV/Inventory_frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(front): extract shared utils and rewire pages

Browse Source
This commit is contained in:
Matthieu
2026-02-06 17:16:16 +01:00
parent 1fbd1d1b2e
commit 9ee348fff0
36 changed files with 1686 additions and 2194 deletions
Download Patch File Download Diff File Expand all files Collapse all files

555
app/pages/component/[id]/edit.vue
View File

@@ -539,26 +539,34 @@ import { formatStructurePreview, normalizeStructureForEditor } from '~/shared/mo
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import type { ComponentModelStructure } from '~/shared/types/inventory'
import type { ModelType } from '~/services/modelTypes'
import { getFileIcon } from '~/utils/fileIcons'
import { canPreviewDocument, isImageDocument, isPdfDocument } from '~/utils/documentPreview'
import { canPreviewDocument } from '~/utils/documentPreview'
import {
type CustomFieldInput,
fieldKey,
buildCustomFieldInputs,
requiredCustomFieldsFilled as _requiredCustomFieldsFilled,
saveCustomFieldValues as _saveCustomFieldValues,
} from '~/shared/utils/customFieldFormUtils'
import {
documentIcon,
formatSize,
shouldInlinePdf,
documentPreviewSrc,
documentThumbnailClass,
downloadDocument,
} from '~/shared/utils/documentDisplayUtils'
import {
historyActionLabel,
formatHistoryDate,
formatHistoryValue,
historyDiffEntries as _historyDiffEntries,
} from '~/shared/utils/historyDisplayUtils'
interface ComponentCatalogType extends ModelType {
structure: ComponentModelStructure | null
customFields?: Array<Record<string, any>>
}
interface CustomFieldInput {
id: string | null
name: string
type: string
required: boolean
options: string[]
value: string
customFieldId: string | null
customFieldValueId: string | null
orderIndex: number
}
const route = useRoute()
const router = useRouter()
const { get } = useApi()
@@ -601,75 +609,8 @@ const historyFieldLabels: Record<string, string> = {
constructeurIds: 'Fournisseurs',
}
const historyActionLabel = (action: string) => {
if (action === 'create') {
return 'Création'
}
if (action === 'delete') {
return 'Suppression'
}
return 'Modification'
}
const historyDateFormatter = new Intl.DateTimeFormat('fr-FR', {
dateStyle: 'medium',
timeStyle: 'short',
})
const formatHistoryDate = (value: string) => {
const date = new Date(value)
if (Number.isNaN(date.getTime())) {
return value
}
return historyDateFormatter.format(date)
}
const formatHistoryValue = (value: unknown): string => {
if (value === null || value === undefined || value === '') {
return '—'
}
if (Array.isArray(value)) {
if (value.length === 0) {
return '—'
}
return value.map((item) => formatHistoryValue(item)).join(', ')
}
if (typeof value === 'object') {
const maybeRecord = value as Record<string, unknown>
const name = typeof maybeRecord.name === 'string' ? maybeRecord.name : null
const id = typeof maybeRecord.id === 'string' ? maybeRecord.id : null
if (name && id) {
return `${name} (#${id})`
}
if (name) {
return name
}
if (id) {
return `#${id}`
}
try {
return JSON.stringify(value)
} catch (error) {
return String(value)
}
}
return String(value)
}
const historyDiffEntries = (entry: ComponentHistoryEntry) => {
const diff = entry.diff ?? {}
return Object.entries(diff).map(([field, change]) => {
const label = historyFieldLabels[field] ?? field
const fromLabel = formatHistoryValue(change?.from)
const toLabel = formatHistoryValue(change?.to)
return {
field,
label,
fromLabel,
toLabel,
}
})
}
const historyDiffEntries = (entry: ComponentHistoryEntry) =>
_historyDiffEntries(entry, historyFieldLabels)
const selectedTypeId = ref<string>('')
const editionForm = reactive({
name: '' as string,
@@ -679,49 +620,6 @@ const editionForm = reactive({
})
const customFieldInputs = ref<CustomFieldInput[]>([])
const documentIcon = (doc: any) =>
getFileIcon({ name: doc?.filename || doc?.name, mime: doc?.mimeType })
const formatSize = (size: number | null | undefined) => {
if (size === null || size === undefined) {
return '—'
}
if (size === 0) {
return '0 B'
}
const units = ['B', 'KB', 'MB', 'GB']
const index = Math.min(units.length - 1, Math.floor(Math.log(size) / Math.log(1024)))
const formatted = size / Math.pow(1024, index)
return `${formatted.toFixed(1)} ${units[index]}`
}
const PDF_PREVIEW_MAX_BYTES = 5 * 1024 * 1024
const shouldInlinePdf = (document: any) => {
if (!document || !isPdfDocument(document) || !document.path) {
return false
}
if (typeof document.size === 'number' && document.size > PDF_PREVIEW_MAX_BYTES) {
return false
}
return true
}
const appendPdfViewerParams = (src: string) => {
if (!src || src.startsWith('data:')) {
return src || ''
}
if (src.includes('#')) {
return `${src}&toolbar=0&navpanes=0`
}
return `${src}#toolbar=0&navpanes=0`
}
const documentPreviewSrc = (document: any) => {
if (!document?.path) {
return ''
}
if (isPdfDocument(document)) {
return appendPdfViewerParams(document.path)
}
return document.path
}
const fetchedPieceTypeMap = ref<Record<string, string>>({})
const pieceTypeLabelMap = computed(() => ({
...Object.fromEntries(
@@ -761,12 +659,6 @@ const componentCatalogMap = computed(() =>
.map((item: any) => [String(item.id), item]),
),
)
const documentThumbnailClass = (document: any) => {
if (shouldInlinePdf(document) || (isImageDocument(document) && document?.path)) {
return 'h-24 w-20'
}
return 'h-16 w-16'
}
const openPreview = (doc: any) => {
if (!doc || !canPreviewDocument(doc)) {
return
@@ -778,20 +670,6 @@ const closePreview = () => {
previewVisible.value = false
previewDocument.value = null
}
const downloadDocument = (doc: any) => {
if (!doc?.path) {
return
}
const target = String(doc.path)
if (target.startsWith('data:')) {
const link = document.createElement('a')
link.href = target
link.download = doc.filename || doc.name || 'document'
link.click()
return
}
window.open(target, '_blank')
}
const removeDocument = async (documentId: string | number | null | undefined) => {
if (!documentId) {
return
@@ -865,15 +743,7 @@ const refreshCustomFieldInputs = (
}
const requiredCustomFieldsFilled = computed(() =>
customFieldInputs.value.every((field) => {
if (!field.required) {
return true
}
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}),
_requiredCustomFieldsFilled(customFieldInputs.value),
)
const canSubmit = computed(() => Boolean(
@@ -883,19 +753,6 @@ const canSubmit = computed(() => Boolean(
!saving.value,
))
const toFieldString = (value: unknown): string => {
if (value === null || value === undefined) {
return ''
}
if (typeof value === 'string') {
return value
}
if (typeof value === 'number' || typeof value === 'boolean') {
return String(value)
}
return ''
}
const fetchComponent = async () => {
const id = route.params.id
if (!id || typeof id !== 'string') {
@@ -996,7 +853,15 @@ const submitEdition = async () => {
const result = await updateComposant(component.value.id, payload)
if (result.success) {
const updatedComponent = result.data
await saveCustomFieldValues(updatedComponent)
await _saveCustomFieldValues(
'composant',
updatedComponent.id,
[
updatedComponent?.typeComposant?.customFields,
updatedComponent?.typeMachineComponentRequirement?.typeComposant?.customFields,
],
{ customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
)
await router.push('/component-catalog')
}
} catch (error: any) {
@@ -1006,260 +871,6 @@ const submitEdition = async () => {
}
}
const buildCustomFieldInputs = (
structure: ComponentModelStructure | null,
values: any[] | null,
): CustomFieldInput[] => {
const normalizedStructure = structure ? normalizeStructureForEditor(structure) : null
const definitions = normalizeCustomFieldInputs(normalizedStructure)
const valueList = Array.isArray(values) ? values : []
const mapById = new Map<string, any>()
const mapByName = new Map<string, any>()
valueList.forEach((entry) => {
if (!entry || typeof entry !== 'object') {
return
}
const fieldId = entry.customField?.id || entry.customFieldId || null
if (fieldId) {
mapById.set(fieldId, entry)
}
const fieldName = entry.customField?.name || entry.name || entry.key || null
if (fieldName) {
mapByName.set(fieldName, entry)
}
})
const resolved: CustomFieldInput[] = definitions.map((definition) => {
const definitionId = definition.customFieldId || definition.id || null
const matched = (definitionId ? mapById.get(definitionId) : null) || mapByName.get(definition.name)
if (!matched) {
return {
...definition,
customFieldId: definition.customFieldId || definition.id,
customFieldValueId: null,
orderIndex: definition.orderIndex,
}
}
const resolvedValue = extractStoredCustomFieldValue(matched)
return {
...definition,
customFieldId: matched.customField?.id || definition.customFieldId || definition.id,
customFieldValueId: matched.id ?? null,
value: formatDefaultValue(definition.type, resolvedValue),
orderIndex: Math.min(
definition.orderIndex ?? 0,
typeof matched.customField?.orderIndex === 'number'
? matched.customField.orderIndex
: definition.orderIndex ?? 0,
),
}
}).sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
return resolved
}
const fieldKey = (field: CustomFieldInput, index: number) =>
field.customFieldValueId || field.id || `${field.name}-${index}`
const normalizeCustomFieldInputs = (structure: ComponentModelStructure | null): CustomFieldInput[] => {
if (!structure || typeof structure !== 'object') {
return []
}
const fields = Array.isArray(structure.customFields) ? structure.customFields : []
return fields
.map((field, index) => normalizeCustomField(field, index))
.filter((field): field is CustomFieldInput => field !== null)
.sort((a, b) => a.orderIndex - b.orderIndex)
}
const normalizeCustomField = (rawField: any, fallbackIndex = 0): CustomFieldInput | null => {
if (!rawField || typeof rawField !== 'object') {
return null
}
const name = resolveFieldName(rawField)
if (!name) {
return null
}
const type = resolveFieldType(rawField)
const required = resolveRequiredFlag(rawField)
const options = resolveOptions(rawField)
const defaultSource = resolveDefaultValue(rawField)
const value = formatDefaultValue(type, defaultSource)
const id = typeof rawField.id === 'string' ? rawField.id : null
const customFieldId = typeof rawField.customFieldId === 'string' ? rawField.customFieldId : id
const customFieldValueId = typeof rawField.customFieldValueId === 'string'
? rawField.customFieldValueId
: null
const orderIndex = typeof rawField.orderIndex === 'number' ? rawField.orderIndex : fallbackIndex
return { id, name, type, required, options, value, customFieldId, customFieldValueId, orderIndex }
}
const resolveFieldName = (field: any): string => {
if (typeof field?.name === 'string' && field.name.trim()) {
return field.name.trim()
}
if (typeof field?.key === 'string' && field.key.trim()) {
return field.key.trim()
}
if (typeof field?.label === 'string' && field.label.trim()) {
return field.label.trim()
}
return ''
}
const resolveFieldType = (field: any): string => {
const allowed = ['text', 'number', 'select', 'boolean', 'date']
const rawType =
typeof field?.type === 'string'
? field.type
: typeof field?.value?.type === 'string'
? field.value.type
: ''
const value = rawType.toLowerCase()
return allowed.includes(value) ? value : 'text'
}
const resolveDefaultValue = (field: any): any => {
if (!field || typeof field !== 'object') {
return null
}
if (field.defaultValue !== undefined && field.defaultValue !== null) {
return field.defaultValue
}
if (field.value !== undefined && field.value !== null && typeof field.value !== 'object') {
return field.value
}
if (field.default !== undefined && field.default !== null) {
return field.default
}
if (field.value && typeof field.value === 'object') {
if ((field.value as any).defaultValue !== undefined && (field.value as any).defaultValue !== null) {
return (field.value as any).defaultValue
}
if ((field.value as any).value !== undefined && (field.value as any).value !== null && typeof (field.value as any).value !== 'object') {
return (field.value as any).value
}
}
return null
}
const formatDefaultValue = (type: string, defaultValue: any): string => {
if (defaultValue === null || defaultValue === undefined) {
return ''
}
if (typeof defaultValue === 'object') {
if (defaultValue === null) {
return ''
}
if ('defaultValue' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).defaultValue)
}
if ('value' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).value)
}
return ''
}
if (type === 'boolean') {
const normalized = String(defaultValue).toLowerCase()
if (normalized === 'true' || normalized === '1') {
return 'true'
}
if (normalized === 'false' || normalized === '0') {
return 'false'
}
return ''
}
return String(defaultValue)
}
const resolveRequiredFlag = (field: any): boolean => {
if (typeof field?.required === 'boolean') {
return field.required
}
const nestedRequired = field?.value?.required
if (typeof nestedRequired === 'boolean') {
return nestedRequired
}
if (typeof nestedRequired === 'string') {
const normalized = nestedRequired.toLowerCase()
return normalized === 'true' || normalized === '1'
}
return false
}
const resolveOptions = (field: any): string[] => {
const sources = [field?.options, field?.value?.options, field?.value?.choices]
for (const source of sources) {
if (Array.isArray(source)) {
const mapped = source
.map((option: unknown) => {
if (option === null || option === undefined) {
return ''
}
if (typeof option === 'string') {
return option.trim()
}
if (typeof option === 'object') {
const record = option || {}
const keys = ['value', 'label', 'name']
for (const key of keys) {
const candidate = record[key]
if (typeof candidate === 'string' && candidate.trim().length > 0) {
return candidate.trim()
}
}
}
const fallback = String(option).trim()
return fallback === '[object Object]' ? '' : fallback
})
.filter((option) => option.length > 0)
if (mapped.length) {
return mapped
}
}
}
return []
}
const extractStoredCustomFieldValue = (entry: any): any => {
if (entry === null || entry === undefined) {
return ''
}
if (typeof entry === 'string' || typeof entry === 'number' || typeof entry === 'boolean') {
return entry
}
if (typeof entry !== 'object') {
return String(entry)
}
const direct = entry.value
if (direct !== undefined && direct !== null) {
if (typeof direct === 'object') {
if (direct === null) {
return ''
}
if ('value' in direct && direct.value !== undefined && direct.value !== null) {
return direct.value
}
if ('defaultValue' in direct && direct.defaultValue !== undefined && direct.defaultValue !== null) {
return direct.defaultValue
}
return ''
}
return direct
}
if (entry.defaultValue !== undefined && entry.defaultValue !== null) {
return entry.defaultValue
}
if (entry.customFieldValue?.value !== undefined && entry.customFieldValue?.value !== null) {
return entry.customFieldValue.value
}
return ''
}
const getStructureCustomFields = (structure: ComponentModelStructure | null) => {
return Array.isArray(structure?.customFields) ? structure.customFields : []
}
@@ -1513,104 +1124,6 @@ const structureSelections = computed(() => {
}
})
const buildCustomFieldMetadata = (field: CustomFieldInput) => ({
customFieldName: field.name,
customFieldType: field.type,
customFieldRequired: field.required,
customFieldOptions: field.options,
})
const shouldPersistField = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}
const formatValueForPersistence = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' ? 'true' : 'false'
}
return toFieldString(field.value).trim()
}
const saveCustomFieldValues = async (updatedComponent: any) => {
if (!updatedComponent || !updatedComponent.id) {
return
}
const definitionMap = new Map<string, string>()
const registerDefinitions = (fields: any[]) => {
if (!Array.isArray(fields)) {
return
}
fields.forEach((field) => {
if (!field || typeof field !== 'object') {
return
}
const name = typeof field.name === 'string' ? field.name : null
const id = typeof field.id === 'string' ? field.id : null
if (name && id && !definitionMap.has(name)) {
definitionMap.set(name, id)
}
})
}
registerDefinitions(updatedComponent?.typeComposant?.customFields)
registerDefinitions(updatedComponent?.typeMachineComponentRequirement?.typeComposant?.customFields)
const resolveDefinitionId = (field: CustomFieldInput) => {
if (field.customFieldId) {
return field.customFieldId
}
if (field.id) {
return field.id
}
return definitionMap.get(field.name) ?? null
}
for (const field of customFieldInputs.value) {
if (!shouldPersistField(field)) {
continue
}
const definitionId = resolveDefinitionId(field)
const metadata = definitionId ? undefined : buildCustomFieldMetadata(field)
const value = formatValueForPersistence(field)
if (field.customFieldValueId) {
const result = await updateCustomFieldValue(field.customFieldValueId, { value })
if (!result.success) {
toast.showError(`Impossible de mettre à jour le champ personnalisé "${field.name}"`)
} else if (definitionId && !field.customFieldId) {
field.customFieldId = definitionId
}
continue
}
const result = await upsertCustomFieldValue(
definitionId,
'composant',
updatedComponent.id,
value,
metadata,
)
if (!result.success) {
toast.showError(`Impossible d'enregistrer le champ personnalisé "${field.name}"`)
} else {
const createdValue = result.data
if (createdValue?.id) {
field.customFieldValueId = createdValue.id
}
const resolvedId = createdValue?.customField?.id || definitionId
if (resolvedId) {
field.customFieldId = resolvedId
}
}
}
}
onMounted(async () => {
await Promise.allSettled([
loadComponentTypes(),

27
app/pages/component/create.vue
View File

@@ -360,6 +360,10 @@ import { useToast } from '~/composables/useToast'
import { useCustomFields } from '~/composables/useCustomFields'
import { useDocuments } from '~/composables/useDocuments'
import { formatStructurePreview, normalizeStructureForEditor } from '~/shared/modelUtils'
import {
toFieldString,
requiredCustomFieldsFilled as _requiredCustomFieldsFilled,
} from '~/shared/utils/customFieldFormUtils'
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import type {
ComponentModelPiece,
@@ -747,15 +751,7 @@ const serializeStructureAssignments = (
}
const requiredCustomFieldsFilled = computed(() =>
customFieldInputs.value.every((field) => {
if (!field.required) {
return true
}
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}),
_requiredCustomFieldsFilled(customFieldInputs.value),
)
const canSubmit = computed(() => Boolean(
@@ -766,19 +762,6 @@ const canSubmit = computed(() => Boolean(
!submitting.value,
))
const toFieldString = (value: unknown): string => {
if (value === null || value === undefined) {
return ''
}
if (typeof value === 'string') {
return value
}
if (typeof value === 'number' || typeof value === 'boolean') {
return String(value)
}
return ''
}
const getStructureCustomFields = (structure: ComponentModelStructure | null) => {
return Array.isArray(structure?.customFields) ? structure.customFields : []
}

467
app/pages/pieces/[id]/edit.vue
View File

@@ -479,31 +479,39 @@ import { useDocuments } from '~/composables/useDocuments'
import { useConstructeurs } from '~/composables/useConstructeurs'
import { usePieceHistory, type PieceHistoryEntry } from '~/composables/usePieceHistory'
import { extractRelationId } from '~/shared/apiRelations'
import { getFileIcon } from '~/utils/fileIcons'
import { canPreviewDocument, isImageDocument, isPdfDocument } from '~/utils/documentPreview'
import { canPreviewDocument } from '~/utils/documentPreview'
import { formatPieceStructurePreview } from '~/shared/modelUtils'
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import type { PieceModelProduct, PieceModelStructure } from '~/shared/types/inventory'
import type { ModelType } from '~/services/modelTypes'
import { getModelType } from '~/services/modelTypes'
import {
type CustomFieldInput,
fieldKey,
buildCustomFieldInputs,
requiredCustomFieldsFilled as _requiredCustomFieldsFilled,
saveCustomFieldValues as _saveCustomFieldValues,
} from '~/shared/utils/customFieldFormUtils'
import {
documentIcon,
formatSize,
shouldInlinePdf,
documentPreviewSrc,
documentThumbnailClass,
downloadDocument,
} from '~/shared/utils/documentDisplayUtils'
import {
historyActionLabel,
formatHistoryDate,
formatHistoryValue,
historyDiffEntries as _historyDiffEntries,
} from '~/shared/utils/historyDisplayUtils'
interface PieceCatalogType extends ModelType {
structure: PieceModelStructure | null
customFields?: Array<Record<string, any>>
}
interface CustomFieldInput {
id: string | null
name: string
type: string
required: boolean
options: string[]
value: string
customFieldId: string | null
customFieldValueId: string | null
orderIndex: number
}
const route = useRoute()
const router = useRouter()
const { get } = useApi()
@@ -542,75 +550,8 @@ const historyFieldLabels: Record<string, string> = {
constructeurIds: 'Fournisseurs',
}
const historyActionLabel = (action: string) => {
if (action === 'create') {
return 'Création'
}
if (action === 'delete') {
return 'Suppression'
}
return 'Modification'
}
const historyDateFormatter = new Intl.DateTimeFormat('fr-FR', {
dateStyle: 'medium',
timeStyle: 'short',
})
const formatHistoryDate = (value: string) => {
const date = new Date(value)
if (Number.isNaN(date.getTime())) {
return value
}
return historyDateFormatter.format(date)
}
const formatHistoryValue = (value: unknown): string => {
if (value === null || value === undefined || value === '') {
return '—'
}
if (Array.isArray(value)) {
if (value.length === 0) {
return '—'
}
return value.map((item) => formatHistoryValue(item)).join(', ')
}
if (typeof value === 'object') {
const maybeRecord = value as Record<string, unknown>
const name = typeof maybeRecord.name === 'string' ? maybeRecord.name : null
const id = typeof maybeRecord.id === 'string' ? maybeRecord.id : null
if (name && id) {
return `${name} (#${id})`
}
if (name) {
return name
}
if (id) {
return `#${id}`
}
try {
return JSON.stringify(value)
} catch (error) {
return String(value)
}
}
return String(value)
}
const historyDiffEntries = (entry: PieceHistoryEntry) => {
const diff = entry.diff ?? {}
return Object.entries(diff).map(([field, change]) => {
const label = historyFieldLabels[field] ?? field
const fromLabel = formatHistoryValue(change?.from)
const toLabel = formatHistoryValue(change?.to)
return {
field,
label,
fromLabel,
toLabel,
}
})
}
const historyDiffEntries = (entry: PieceHistoryEntry) =>
_historyDiffEntries(entry, historyFieldLabels)
const selectedTypeId = ref<string>('')
const pieceTypeDetails = ref<any | null>(null)
@@ -623,8 +564,6 @@ const editionForm = reactive({
const productSelections = ref<(string | null)[]>([])
const customFieldInputs = ref<CustomFieldInput[]>([])
const documentIcon = (doc: any) =>
getFileIcon({ name: doc?.filename || doc?.name, mime: doc?.mimeType })
const resolvedStructure = computed<PieceModelStructure | null>(() =>
pieceTypeDetails.value?.structure ?? selectedType.value?.structure ?? null,
)
@@ -637,52 +576,6 @@ const refreshCustomFieldInputs = (
const values = valuesOverride ?? piece.value?.customFieldValues ?? null
customFieldInputs.value = buildCustomFieldInputs(structure, values)
}
const formatSize = (size: number | null | undefined) => {
if (size === null || size === undefined) {
return '—'
}
if (size === 0) {
return '0 B'
}
const units = ['B', 'KB', 'MB', 'GB']
const index = Math.min(units.length - 1, Math.floor(Math.log(size) / Math.log(1024)))
const formatted = size / Math.pow(1024, index)
return `${formatted.toFixed(1)} ${units[index]}`
}
const PDF_PREVIEW_MAX_BYTES = 5 * 1024 * 1024
const shouldInlinePdf = (document: any) => {
if (!document || !isPdfDocument(document) || !document.path) {
return false
}
if (typeof document.size === 'number' && document.size > PDF_PREVIEW_MAX_BYTES) {
return false
}
return true
}
const appendPdfViewerParams = (src: string) => {
if (!src || src.startsWith('data:')) {
return src || ''
}
if (src.includes('#')) {
return `${src}&toolbar=0&navpanes=0`
}
return `${src}#toolbar=0&navpanes=0`
}
const documentPreviewSrc = (document: any) => {
if (!document?.path) {
return ''
}
if (isPdfDocument(document)) {
return appendPdfViewerParams(document.path)
}
return document.path
}
const documentThumbnailClass = (document: any) => {
if (shouldInlinePdf(document) || (isImageDocument(document) && document?.path)) {
return 'h-24 w-20'
}
return 'h-16 w-16'
}
const openPreview = (doc: any) => {
if (!doc || !canPreviewDocument(doc)) {
return
@@ -694,20 +587,6 @@ const closePreview = () => {
previewVisible.value = false
previewDocument.value = null
}
const downloadDocument = (doc: any) => {
if (!doc?.path) {
return
}
const target = String(doc.path)
if (target.startsWith('data:')) {
const link = document.createElement('a')
link.href = target
link.download = doc.filename || doc.name || 'document'
link.click()
return
}
window.open(target, '_blank')
}
const removeDocument = async (documentId: string | number | null | undefined) => {
if (!documentId) {
return
@@ -848,15 +727,7 @@ watch(structureProducts, (products) => {
})
const requiredCustomFieldsFilled = computed(() =>
customFieldInputs.value.every((field) => {
if (!field.required) {
return true
}
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}),
_requiredCustomFieldsFilled(customFieldInputs.value),
)
const canSubmit = computed(() =>
@@ -869,19 +740,6 @@ const canSubmit = computed(() =>
),
)
const toFieldString = (value: unknown): string => {
if (value === null || value === undefined) {
return ''
}
if (typeof value === 'string') {
return value
}
if (typeof value === 'number' || typeof value === 'boolean') {
return String(value)
}
return ''
}
const fetchPiece = async () => {
const id = route.params.id
if (!id || typeof id !== 'string') {
@@ -1042,7 +900,15 @@ const submitEdition = async () => {
const result = await updatePiece(piece.value.id, payload)
if (result.success) {
const updatedPiece = result.data
await saveCustomFieldValues(updatedPiece)
await _saveCustomFieldValues(
'piece',
updatedPiece.id,
[
updatedPiece?.typePiece?.pieceCustomFields,
updatedPiece?.typeMachinePieceRequirement?.typePiece?.pieceCustomFields,
],
{ customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
)
await router.push('/pieces-catalog')
}
} catch (error: any) {
@@ -1052,271 +918,6 @@ const submitEdition = async () => {
}
}
const buildCustomFieldInputs = (
structure: PieceModelStructure | null,
values: any[] | null,
): CustomFieldInput[] => {
const definitions = normalizeCustomFieldInputs(structure)
const valueList = Array.isArray(values) ? values : []
const mapById = new Map<string, any>()
const mapByName = new Map<string, any>()
valueList.forEach((entry) => {
if (!entry || typeof entry !== 'object') {
return
}
const fieldId = entry.customField?.id || entry.customFieldId || null
if (fieldId) {
mapById.set(fieldId, entry)
}
const fieldName = entry.customField?.name || entry.name || entry.key || null
if (fieldName) {
mapByName.set(fieldName, entry)
}
})
const resolved: CustomFieldInput[] = definitions.map((definition) => {
const definitionId = definition.customFieldId || definition.id || null
const matched = (definitionId ? mapById.get(definitionId) : null) || mapByName.get(definition.name)
if (!matched) {
return {
...definition,
customFieldId: definition.customFieldId || definition.id,
customFieldValueId: null,
orderIndex: definition.orderIndex,
}
}
const resolvedValue = matched.value ?? ''
return {
...definition,
customFieldId: matched.customField?.id || definition.customFieldId || definition.id,
customFieldValueId: matched.id ?? null,
value: formatDefaultValue(definition.type, resolvedValue),
orderIndex: Math.min(
definition.orderIndex ?? 0,
typeof matched.customField?.orderIndex === 'number'
? matched.customField.orderIndex
: definition.orderIndex ?? 0,
),
}
}).sort((a, b) => (a.orderIndex ?? 0) - (b.orderIndex ?? 0))
return resolved
}
const fieldKey = (field: CustomFieldInput, index: number) =>
field.customFieldValueId || field.id || `${field.name}-${index}`
const normalizeCustomFieldInputs = (structure: PieceModelStructure | null): CustomFieldInput[] => {
if (!structure || typeof structure !== 'object') {
return []
}
const fields = Array.isArray(structure.customFields) ? structure.customFields : []
return fields
.map((field, index) => normalizeCustomField(field, index))
.filter((field): field is CustomFieldInput => field !== null)
.sort((a, b) => a.orderIndex - b.orderIndex)
}
const normalizeCustomField = (rawField: any, fallbackIndex = 0): CustomFieldInput | null => {
if (!rawField || typeof rawField !== 'object') {
return null
}
const name = resolveFieldName(rawField)
if (!name) {
return null
}
const type = resolveFieldType(rawField)
const required = !!rawField.required
const options = Array.isArray(rawField.options)
? rawField.options.filter((option: unknown): option is string => typeof option === 'string')
: []
const defaultSource = resolveDefaultValue(rawField)
const value = formatDefaultValue(type, defaultSource)
const id = typeof rawField.id === 'string' ? rawField.id : null
const customFieldId = typeof rawField.customFieldId === 'string' ? rawField.customFieldId : id
const customFieldValueId = typeof rawField.customFieldValueId === 'string'
? rawField.customFieldValueId
: null
const orderIndex = typeof rawField.orderIndex === 'number' ? rawField.orderIndex : fallbackIndex
return { id, name, type, required, options, value, customFieldId, customFieldValueId, orderIndex }
}
const resolveFieldName = (field: any): string => {
if (typeof field?.name === 'string' && field.name.trim()) {
return field.name.trim()
}
if (typeof field?.key === 'string' && field.key.trim()) {
return field.key.trim()
}
if (typeof field?.label === 'string' && field.label.trim()) {
return field.label.trim()
}
return ''
}
const resolveFieldType = (field: any): string => {
const allowed = ['text', 'number', 'select', 'boolean', 'date']
const value = typeof field?.type === 'string' ? field.type.toLowerCase() : ''
return allowed.includes(value) ? value : 'text'
}
const resolveDefaultValue = (field: any): any => {
if (!field || typeof field !== 'object') {
return null
}
if (field.defaultValue !== undefined && field.defaultValue !== null) {
return field.defaultValue
}
if (field.value !== undefined && field.value !== null && typeof field.value !== 'object') {
return field.value
}
if (field.default !== undefined && field.default !== null) {
return field.default
}
if (field.value && typeof field.value === 'object') {
if ((field.value as any).defaultValue !== undefined && (field.value as any).defaultValue !== null) {
return (field.value as any).defaultValue
}
if ((field.value as any).value !== undefined && (field.value as any).value !== null && typeof (field.value as any).value !== 'object') {
return (field.value as any).value
}
}
return null
}
const formatDefaultValue = (type: string, defaultValue: any): string => {
if (defaultValue === null || defaultValue === undefined) {
return ''
}
if (typeof defaultValue === 'object') {
if (defaultValue === null) {
return ''
}
if ('defaultValue' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).defaultValue)
}
if ('value' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).value)
}
return ''
}
if (type === 'boolean') {
const normalized = String(defaultValue).toLowerCase()
if (normalized === 'true' || normalized === '1') {
return 'true'
}
if (normalized === 'false' || normalized === '0') {
return 'false'
}
return ''
}
return String(defaultValue)
}
const buildCustomFieldMetadata = (field: CustomFieldInput) => ({
customFieldName: field.name,
customFieldType: field.type,
customFieldRequired: field.required,
customFieldOptions: field.options,
})
const shouldPersistField = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}
const formatValueForPersistence = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' ? 'true' : 'false'
}
return toFieldString(field.value).trim()
}
const saveCustomFieldValues = async (updatedPiece: any) => {
if (!updatedPiece || !updatedPiece.id) {
return
}
const definitionMap = new Map<string, string>()
const registerDefinitions = (fields: any[]) => {
if (!Array.isArray(fields)) {
return
}
fields.forEach((field) => {
if (!field || typeof field !== 'object') {
return
}
const name = typeof field.name === 'string' ? field.name : null
const id = typeof field.id === 'string' ? field.id : null
if (name && id && !definitionMap.has(name)) {
definitionMap.set(name, id)
}
})
}
registerDefinitions(updatedPiece?.typePiece?.pieceCustomFields)
registerDefinitions(updatedPiece?.typeMachinePieceRequirement?.typePiece?.pieceCustomFields)
const resolveDefinitionId = (field: CustomFieldInput) => {
if (field.customFieldId) {
return field.customFieldId
}
if (field.id) {
return field.id
}
return definitionMap.get(field.name) ?? null
}
for (const field of customFieldInputs.value) {
if (!shouldPersistField(field)) {
continue
}
const definitionId = resolveDefinitionId(field)
const metadata = definitionId ? undefined : buildCustomFieldMetadata(field)
const value = formatValueForPersistence(field)
if (field.customFieldValueId) {
const result = await updateCustomFieldValue(field.customFieldValueId, { value })
if (!result.success) {
toast.showError(`Impossible de mettre à jour le champ personnalisé "${field.name}"`)
} else if (definitionId && !field.customFieldId) {
field.customFieldId = definitionId
}
continue
}
const result = await upsertCustomFieldValue(
definitionId,
'piece',
updatedPiece.id,
value,
metadata,
)
if (!result.success) {
toast.showError(`Impossible d'enregistrer le champ personnalisé "${field.name}"`)
} else {
const createdValue = result.data
if (createdValue?.id) {
field.customFieldValueId = createdValue.id
}
const resolvedId = createdValue?.customField?.id || definitionId
if (resolvedId) {
field.customFieldId = resolvedId
}
}
}
}
onMounted(async () => {
await Promise.allSettled([loadPieceTypes(), fetchPiece()])
loading.value = false

261
app/pages/pieces/create.vue
View File

@@ -308,6 +308,13 @@ import { formatPieceStructurePreview } from '~/shared/modelUtils'
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import type { PieceModelProduct, PieceModelStructure } from '~/shared/types/inventory'
import type { ModelType } from '~/services/modelTypes'
import {
type CustomFieldInput,
fieldKey,
normalizeCustomFieldInputs,
requiredCustomFieldsFilled as _requiredCustomFieldsFilled,
saveCustomFieldValues as _saveCustomFieldValues,
} from '~/shared/utils/customFieldFormUtils'
interface PieceCatalogType extends ModelType {
structure: PieceModelStructure | null
@@ -466,15 +473,7 @@ watch(selectedType, (type) => {
})
const requiredCustomFieldsFilled = computed(() =>
customFieldInputs.value.every((field) => {
if (!field.required) {
return true
}
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}),
_requiredCustomFieldsFilled(customFieldInputs.value),
)
const canSubmit = computed(() =>
@@ -487,19 +486,6 @@ const canSubmit = computed(() =>
),
)
const toFieldString = (value: unknown): string => {
if (value === null || value === undefined) {
return ''
}
if (typeof value === 'string') {
return value
}
if (typeof value === 'number' || typeof value === 'boolean') {
return String(value)
}
return ''
}
const clearCreationForm = () => {
creationForm.name = ''
creationForm.reference = ''
@@ -558,7 +544,15 @@ const submitCreation = async () => {
try {
const result = await createPiece(payload)
if (result.success) {
await saveCustomFieldValues(result.data)
await _saveCustomFieldValues(
'piece',
result.data.id,
[
result.data?.typePiece?.pieceCustomFields,
result.data?.typeMachinePieceRequirement?.typePiece?.pieceCustomFields,
],
{ customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
)
if (selectedDocuments.value.length && result.data?.id) {
uploadingDocuments.value = true
const uploadResult = await uploadDocuments(
@@ -593,225 +587,4 @@ onMounted(async () => {
await loadPieceTypes()
})
interface CustomFieldInput {
id: string | null
name: string
type: string
required: boolean
options: string[]
value: string
customFieldId: string | null
customFieldValueId: string | null
orderIndex: number
}
const fieldKey = (field: CustomFieldInput, index: number) =>
field.customFieldValueId || field.id || `${field.name}-${index}`
const normalizeCustomFieldInputs = (structure: PieceModelStructure | null): CustomFieldInput[] => {
if (!structure || typeof structure !== 'object') {
return []
}
const fields = Array.isArray(structure.customFields) ? structure.customFields : []
return fields
.map((field, index) => normalizeCustomField(field, index))
.filter((field): field is CustomFieldInput => field !== null)
.sort((a, b) => a.orderIndex - b.orderIndex)
}
const normalizeCustomField = (rawField: any, fallbackIndex = 0): CustomFieldInput | null => {
if (!rawField || typeof rawField !== 'object') {
return null
}
const name = resolveFieldName(rawField)
if (!name) {
return null
}
const type = resolveFieldType(rawField)
const required = !!rawField.required
const options = Array.isArray(rawField.options)
? rawField.options.filter((option: unknown): option is string => typeof option === 'string')
: []
const defaultSource = resolveDefaultValue(rawField)
const value = formatDefaultValue(type, defaultSource)
const id = typeof rawField.id === 'string' ? rawField.id : null
const customFieldId = typeof rawField.customFieldId === 'string' ? rawField.customFieldId : id
const customFieldValueId = typeof rawField.customFieldValueId === 'string'
? rawField.customFieldValueId
: null
const orderIndex = typeof rawField.orderIndex === 'number' ? rawField.orderIndex : fallbackIndex
return { id, name, type, required, options, value, customFieldId, customFieldValueId, orderIndex }
}
const resolveFieldName = (field: any): string => {
if (typeof field?.name === 'string' && field.name.trim()) {
return field.name.trim()
}
if (typeof field?.key === 'string' && field.key.trim()) {
return field.key.trim()
}
if (typeof field?.label === 'string' && field.label.trim()) {
return field.label.trim()
}
return ''
}
const resolveFieldType = (field: any): string => {
const allowed = ['text', 'number', 'select', 'boolean', 'date']
const value = typeof field?.type === 'string' ? field.type.toLowerCase() : ''
return allowed.includes(value) ? value : 'text'
}
const resolveDefaultValue = (field: any): any => {
if (!field || typeof field !== 'object') {
return null
}
if (field.defaultValue !== undefined && field.defaultValue !== null) {
return field.defaultValue
}
if (field.value !== undefined && field.value !== null && typeof field.value !== 'object') {
return field.value
}
if (field.default !== undefined && field.default !== null) {
return field.default
}
if (field.value && typeof field.value === 'object') {
if ((field.value as any).defaultValue !== undefined && (field.value as any).defaultValue !== null) {
return (field.value as any).defaultValue
}
if ((field.value as any).value !== undefined && (field.value as any).value !== null && typeof (field.value as any).value !== 'object') {
return (field.value as any).value
}
}
return null
}
const formatDefaultValue = (type: string, defaultValue: any): string => {
if (defaultValue === null || defaultValue === undefined) {
return ''
}
if (typeof defaultValue === 'object') {
if (defaultValue === null) {
return ''
}
if ('defaultValue' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).defaultValue)
}
if ('value' in (defaultValue as Record<string, any>)) {
return formatDefaultValue(type, (defaultValue as Record<string, any>).value)
}
return ''
}
if (type === 'boolean') {
const normalized = String(defaultValue).toLowerCase()
if (normalized === 'true' || normalized === '1') {
return 'true'
}
if (normalized === 'false' || normalized === '0') {
return 'false'
}
return ''
}
return String(defaultValue)
}
const buildCustomFieldMetadata = (field: CustomFieldInput) => ({
customFieldName: field.name,
customFieldType: field.type,
customFieldRequired: field.required,
customFieldOptions: field.options,
})
const saveCustomFieldValues = async (createdPiece: any) => {
if (!createdPiece || !createdPiece.id) {
return
}
const definitionMap = new Map<string, string>()
const registerDefinitions = (fields: any[]) => {
if (!Array.isArray(fields)) {
return
}
fields.forEach((field) => {
if (!field || typeof field !== 'object') {
return
}
const name = typeof field.name === 'string' ? field.name : null
const id = typeof field.id === 'string' ? field.id : null
if (name && id && !definitionMap.has(name)) {
definitionMap.set(name, id)
}
})
}
registerDefinitions(createdPiece?.typePiece?.pieceCustomFields)
registerDefinitions(createdPiece?.typeMachinePieceRequirement?.typePiece?.pieceCustomFields)
const customizeFieldId = (field: CustomFieldInput) => {
if (field.customFieldId) {
return field.customFieldId
}
if (field.id) {
return field.id
}
return definitionMap.get(field.name) ?? null
}
for (const field of customFieldInputs.value) {
if (!shouldPersistField(field)) {
continue
}
const definitionId = customizeFieldId(field)
const metadata = definitionId ? undefined : buildCustomFieldMetadata(field)
const value = formatValueForPersistence(field)
if (field.customFieldValueId) {
const result = await updateCustomFieldValue(field.customFieldValueId, { value })
if (!result.success) {
toast.showError(`Impossible de mettre à jour le champ personnalisé "${field.name}"`)
} else if (definitionId && !field.customFieldId) {
field.customFieldId = definitionId
}
continue
}
const result = await upsertCustomFieldValue(
definitionId,
'piece',
createdPiece.id,
value,
metadata,
)
if (!result.success) {
toast.showError(`Impossible d'enregistrer le champ personnalisé "${field.name}"`)
} else {
const createdValue = result.data
if (createdValue?.id) {
field.customFieldValueId = createdValue.id
}
const resolvedId = createdValue?.customField?.id || definitionId
if (resolvedId) {
field.customFieldId = resolvedId
}
}
}
}
const shouldPersistField = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return toFieldString(field.value).trim() !== ''
}
const formatValueForPersistence = (field: CustomFieldInput) => {
if (field.type === 'boolean') {
return field.value === 'true' ? 'true' : 'false'
}
return toFieldString(field.value).trim()
}
</script>

312
app/pages/product/[id]/edit.vue
View File

@@ -402,20 +402,28 @@ import { formatProductStructurePreview, normalizeProductStructureForSave } from
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import { getModelType } from '~/services/modelTypes'
import type { ProductModelStructure } from '~/shared/types/inventory'
import { getFileIcon } from '~/utils/fileIcons'
import { canPreviewDocument, isImageDocument, isPdfDocument } from '~/utils/documentPreview'
interface CustomFieldInput {
id: string | null
name: string
type: string
required: boolean
options: string[]
value: string
customFieldId: string | null
customFieldValueId: string | null
orderIndex: number
}
import { canPreviewDocument } from '~/utils/documentPreview'
import {
type CustomFieldInput,
fieldKey,
buildCustomFieldInputs,
requiredCustomFieldsFilled as _requiredCustomFieldsFilled,
saveCustomFieldValues as _saveCustomFieldValues,
} from '~/shared/utils/customFieldFormUtils'
import {
documentIcon,
formatSize,
shouldInlinePdf,
documentPreviewSrc,
documentThumbnailClass,
downloadDocument,
} from '~/shared/utils/documentDisplayUtils'
import {
historyActionLabel,
formatHistoryDate,
formatHistoryValue,
historyDiffEntries as _historyDiffEntries,
} from '~/shared/utils/historyDisplayUtils'
const route = useRoute()
const router = useRouter()
@@ -458,75 +466,8 @@ const historyFieldLabels: Record<string, string> = {
constructeurIds: 'Fournisseurs',
}
const historyActionLabel = (action: string) => {
if (action === 'create') {
return 'Création'
}
if (action === 'delete') {
return 'Suppression'
}
return 'Modification'
}
const historyDateFormatter = new Intl.DateTimeFormat('fr-FR', {
dateStyle: 'medium',
timeStyle: 'short',
})
const formatHistoryDate = (value: string) => {
const date = new Date(value)
if (Number.isNaN(date.getTime())) {
return value
}
return historyDateFormatter.format(date)
}
const formatHistoryValue = (value: unknown): string => {
if (value === null || value === undefined || value === '') {
return '—'
}
if (Array.isArray(value)) {
if (value.length === 0) {
return '—'
}
return value.map((item) => formatHistoryValue(item)).join(', ')
}
if (typeof value === 'object') {
const maybeRecord = value as Record<string, unknown>
const name = typeof maybeRecord.name === 'string' ? maybeRecord.name : null
const id = typeof maybeRecord.id === 'string' ? maybeRecord.id : null
if (name && id) {
return `${name} (#${id})`
}
if (name) {
return name
}
if (id) {
return `#${id}`
}
try {
return JSON.stringify(value)
} catch (error) {
return String(value)
}
}
return String(value)
}
const historyDiffEntries = (entry: ProductHistoryEntry) => {
const diff = entry.diff ?? {}
return Object.entries(diff).map(([field, change]) => {
const label = historyFieldLabels[field] ?? field
const fromLabel = formatHistoryValue(change?.from)
const toLabel = formatHistoryValue(change?.to)
return {
field,
label,
fromLabel,
toLabel,
}
})
}
const historyDiffEntries = (entry: ProductHistoryEntry) =>
_historyDiffEntries(entry, historyFieldLabels)
const refreshCustomFieldInputs = (
structureOverride?: ProductModelStructure | null,
@@ -545,15 +486,7 @@ const editionForm = reactive({
})
const requiredCustomFieldsFilled = computed(() =>
customFieldInputs.value.every((field) => {
if (!field.required) {
return true
}
if (field.type === 'boolean') {
return field.value === 'true' || field.value === 'false'
}
return field.value.trim().length > 0
}),
_requiredCustomFieldsFilled(customFieldInputs.value),
)
const canSubmit = computed(() =>
@@ -562,60 +495,6 @@ const canSubmit = computed(() =>
const structurePreview = computed(() => formatProductStructurePreview(structure.value))
const documentIcon = (doc: any) =>
getFileIcon({ name: doc?.filename || doc?.name, mime: doc?.mimeType })
const formatSize = (size: number | null | undefined) => {
if (size === null || size === undefined) {
return '—'
}
if (size === 0) {
return '0 B'
}
const units = ['B', 'KB', 'MB', 'GB']
const index = Math.min(units.length - 1, Math.floor(Math.log(size) / Math.log(1024)))
const formatted = size / Math.pow(1024, index)
return `${formatted.toFixed(1)} ${units[index]}`
}
const PDF_PREVIEW_MAX_BYTES = 5 * 1024 * 1024
const shouldInlinePdf = (document: any) => {
if (!document || !isPdfDocument(document) || !document.path) {
return false
}
if (typeof document.size === 'number' && document.size > PDF_PREVIEW_MAX_BYTES) {
return false
}
return true
}
const appendPdfViewerParams = (src: string) => {
if (!src || src.startsWith('data:')) {
return src || ''
}
if (src.includes('#')) {
return `${src}&toolbar=0&navpanes=0`
}
return `${src}#toolbar=0&navpanes=0`
}
const documentPreviewSrc = (document: any) => {
if (!document?.path) {
return ''
}
if (isPdfDocument(document)) {
return appendPdfViewerParams(document.path)
}
return document.path
}
const documentThumbnailClass = (document: any) => {
if (shouldInlinePdf(document) || (isImageDocument(document) && document?.path)) {
return 'h-24 w-20'
}
return 'h-16 w-16'
}
const openPreview = (doc: any) => {
if (!doc || !canPreviewDocument(doc)) {
@@ -630,20 +509,6 @@ const closePreview = () => {
previewDocument.value = null
}
const downloadDocument = (doc: any) => {
if (!doc?.path) {
return
}
const target = String(doc.path)
if (target.startsWith('data:')) {
const link = document.createElement('a')
link.href = target
link.download = doc.filename || doc.name || 'document'
link.click()
return
}
window.open(target, '_blank')
}
const loadProduct = async () => {
const id = route.params.id
@@ -768,86 +633,6 @@ watch(
{ immediate: true },
)
const fieldKey = (field: CustomFieldInput, index: number) =>
field.customFieldValueId || field.customFieldId || `${field.name}-${index}`
const buildCustomFieldInputs = (
productStructure: ProductModelStructure | null,
values: any[] | null | undefined,
): CustomFieldInput[] => {
if (!productStructure || typeof productStructure !== 'object') {
return []
}
const definitions = Array.isArray(productStructure.customFields) ? productStructure.customFields : []
const valueList = Array.isArray(values) ? values : []
const byId = new Map<string, any>()
const byName = new Map<string, any>()
valueList.forEach((entry) => {
if (!entry || typeof entry !== 'object') {
return
}
const fieldId = entry.customField?.id || entry.customFieldId || null
if (fieldId) {
byId.set(fieldId, entry)
}
const fieldName = entry.customField?.name || entry.name || entry.key || null
if (fieldName) {
byName.set(fieldName, entry)
}
})
return definitions
.map((definition, index) => {
const definitionId = definition.customFieldId || definition.id || null
const matched = (definitionId ? byId.get(definitionId) : null) || byName.get(definition.name)
const type = typeof definition.type === 'string' ? definition.type : 'text'
const options = Array.isArray(definition.options) ? definition.options : []
const required = !!definition.required
const orderIndex = typeof definition.orderIndex === 'number' ? definition.orderIndex : index
if (!matched) {
return {
id: definition.id ?? null,
name: definition.name,
type,
required,
options,
value: '',
customFieldId: definition.customFieldId || definition.id || null,
customFieldValueId: null,
orderIndex,
}
}
const resolvedValue = matched.value ?? ''
return {
id: definition.id ?? null,
name: definition.name,
type,
required,
options,
value: formatDefaultValue(type, resolvedValue),
customFieldId: matched.customField?.id || definition.customFieldId || definition.id || null,
customFieldValueId: matched.id ?? null,
orderIndex,
}
})
.filter((field): field is CustomFieldInput => !!field?.name)
.sort((a, b) => a.orderIndex - b.orderIndex)
}
const formatDefaultValue = (type: string, value: any): string => {
if (value === null || value === undefined) {
return ''
}
if (type === 'boolean') {
return String(value === true || String(value).toLowerCase() === 'true')
}
return String(value)
}
const submitEdition = async () => {
if (!product.value) {
return
@@ -875,7 +660,12 @@ const submitEdition = async () => {
const result = await updateProduct(product.value.id, payload)
if (result.success && result.data?.id) {
product.value = result.data
const failedFields = await saveCustomFieldValues(result.data.id)
const failedFields = await _saveCustomFieldValues(
'product',
result.data.id,
[],
{ customFieldInputs, upsertCustomFieldValue, updateCustomFieldValue, toast },
)
if (failedFields.length) {
toast.showError(`Impossible d'enregistrer ${failedFields.length} champ(s): ${failedFields.join(', ')}`)
return
@@ -890,46 +680,6 @@ const submitEdition = async () => {
}
}
const saveCustomFieldValues = async (productId: string) => {
const failed: string[] = []
for (const field of customFieldInputs.value) {
const value = field.value ?? ''
if (field.customFieldValueId) {
const result = await updateCustomFieldValue(field.customFieldValueId, { value })
if (!result.success) {
failed.push(field.name)
}
continue
}
const metadata = field.customFieldId
? undefined
: { customFieldName: field.name, customFieldType: field.type, customFieldRequired: field.required }
const result = await upsertCustomFieldValue(
field.customFieldId,
'product',
productId,
String(value ?? ''),
metadata,
)
if (!result.success) {
failed.push(field.name)
} else {
const createdValue = result.data
if (createdValue?.id) {
field.customFieldValueId = createdValue.id
}
const resolvedId = createdValue?.customField?.id || field.customFieldId
if (resolvedId) {
field.customFieldId = resolvedId
}
}
}
return failed
}
onMounted(async () => {
await loadProduct()
})

60
app/pages/product/create.vue
View File

@@ -249,6 +249,10 @@ import { formatProductStructurePreview, normalizeProductStructureForSave } from
import { uniqueConstructeurIds } from '~/shared/constructeurUtils'
import type { ProductModelStructure } from '~/shared/types/inventory'
import type { ModelType } from '~/services/modelTypes'
import {
type CustomFieldInput,
normalizeCustomFieldInputs as normalizeCustomFieldInputsFromUtils,
} from '~/shared/utils/customFieldFormUtils'
interface ProductCatalogType extends ModelType {
structure: ProductModelStructure | null
@@ -276,17 +280,6 @@ const creationForm = reactive({
const selectedDocuments = ref<File[]>([])
const uploadingDocuments = ref(false)
interface CustomFieldInput {
id: string | null
name: string
type: string
required: boolean
options: string[]
value: string
customFieldId: string | null
orderIndex: number
}
const customFieldInputs = ref<CustomFieldInput[]>([])
const loadingTypes = computed(() => loadingProductTypes.value)
@@ -337,7 +330,7 @@ watch(selectedType, (type) => {
if (!creationForm.name) {
creationForm.name = type.name
}
customFieldInputs.value = normalizeCustomFieldInputs(normalizeProductStructureForSave(type.structure))
customFieldInputs.value = normalizeCustomFieldInputsFromUtils(normalizeProductStructureForSave(type.structure))
})
const requiredCustomFieldsFilled = computed(() =>
@@ -362,49 +355,6 @@ const canSubmit = computed(() => Boolean(
const fieldKey = (field: CustomFieldInput, index: number) =>
field.customFieldId || field.id || `${field.name}-${index}`
const normalizeCustomFieldInputs = (structure: ProductModelStructure | null): CustomFieldInput[] => {
if (!structure || typeof structure !== 'object') {
return []
}
const fields = Array.isArray(structure.customFields) ? structure.customFields : []
return fields
.map((field, index) => normalizeCustomField(field, index))
.filter((field): field is CustomFieldInput => field !== null)
.sort((a, b) => a.orderIndex - b.orderIndex)
}
const normalizeCustomField = (rawField: any, fallbackIndex = 0): CustomFieldInput | null => {
if (!rawField || typeof rawField !== 'object') {
return null
}
const name = typeof rawField.name === 'string' ? rawField.name.trim() : ''
if (!name) {
return null
}
const type = typeof rawField.type === 'string' ? rawField.type : 'text'
const required = !!rawField.required
const options = Array.isArray(rawField.options)
? rawField.options.filter((option: unknown): option is string => typeof option === 'string')
: []
const defaultSource = rawField.defaultValue ?? rawField.value ?? rawField.default ?? null
const value = formatDefaultValue(type, defaultSource)
const id = typeof rawField.id === 'string' ? rawField.id : null
const customFieldId = typeof rawField.customFieldId === 'string' ? rawField.customFieldId : id
const orderIndex = typeof rawField.orderIndex === 'number' ? rawField.orderIndex : fallbackIndex
return { id, name, type, required, options, value, customFieldId, orderIndex }
}
const formatDefaultValue = (type: string, defaultValue: any): string => {
if (defaultValue === null || defaultValue === undefined) {
return ''
}
if (type === 'boolean') {
return String(defaultValue === true || String(defaultValue).toLowerCase() === 'true')
}
return String(defaultValue)
}
const clearForm = () => {
creationForm.name = ''
creationForm.reference = ''