Components
ImageUploader
Uploader multiplo di immagini collegate a una sessione di import.
Panoramica
ImageUploader è un componente utility per caricare immagini associate a una sessione di import esistente (per esempio: foto profilo collegate a record anagrafica importati massivamente). Le immagini vengono inviate al microservizio import via POST /api/import/images insieme al sessionId, che le deduplica e le associa ai record corrispondenti tramite la chiave naming convention concordata col backend.
Il componente è volutamente minimale: un FileUpload di @pzeta/vue-components in modalità advanced con accept: image/* e un pulsante "Carica immagini".
Props
| Prop | Tipo | Descrizione |
|---|---|---|
sessionId | string | ID sessione di import a cui associare le immagini |
Emits
| Evento | Payload | Descrizione |
|---|---|---|
uploadRequest | sessionId: string, files: File[] | Richiesta di upload — il parent deve invocare api.uploadImages(sessionId, files) |
Esempio
<script setup lang="ts">
import { useApi, ImageUploader } from '@pzeta/vue-importexport'
const api = useApi()
const sessionId = 'abc-123'
async function handleUpload(sid: string, files: File[]) {
const result = await api.uploadImages(sid, files)
console.log(`Caricate ${result.caricati} immagini, ${result.errori.length} errori`)
}
</script>
<template>
<ImageUploader :session-id="sessionId" @upload-request="handleUpload" />
</template>
Risposta API
api.uploadImages restituisce:
{
caricati: number // numero immagini caricate con successo
errori: string[] // lista messaggi di errore (un elemento per immagine fallita)
}
Note
- Non è incluso automaticamente in
ImportWizard— va aggiunto manualmente in un wizard custom o come step aggiuntivo dopo l'esecuzione dell'import. - L'accept è
image/*(qualsiasi formato immagine supportato dal browser). - L'uploader è multiplo: l'utente può selezionare più file in un singolo upload.
- Non c'è validazione lato client su dimensione o numero massimo — eventuali limiti vanno applicati dal backend o nel parent.