Validacion y restriccion de archivos + almacenamiento en carpeta
This commit is contained in:
@@ -33,12 +33,12 @@ import { z } from 'zod'; // Asegúrate de importar Zod
|
||||
// Si tu EditInventory original no contempla FileList, crea un esquema para el formulario.
|
||||
|
||||
// Ejemplo de cómo podrías adaptar tu esquema para el formulario
|
||||
const formSchemaWithFiles = editInventory.extend({
|
||||
urlImg: z.custom<FileList | undefined | null>().optional(), // Ahora permite FileList para el input file
|
||||
});
|
||||
// const formSchemaWithFiles = editInventory.extend({
|
||||
// urlImg: z.custom<FileList | undefined | null>().optional(), // Ahora permite FileList para el input file
|
||||
// });
|
||||
|
||||
// Define un tipo para los datos del formulario que incluye el FileList
|
||||
type FormDataWithFiles = z.infer<typeof formSchemaWithFiles>;
|
||||
// type FormDataWithFiles = z.infer<typeof formSchemaWithFiles>;
|
||||
|
||||
interface UpdateFormProps {
|
||||
onSuccess?: () => void;
|
||||
@@ -59,7 +59,7 @@ export function UpdateForm({
|
||||
|
||||
const [sizeFile, setSizeFile] = useState('0 bytes');
|
||||
|
||||
const defaultformValues: FormDataWithFiles = { // Usamos el nuevo tipo aquí
|
||||
const defaultformValues: EditInventory = { // Usamos el nuevo tipo aquí
|
||||
id: defaultValues?.id,
|
||||
title: defaultValues?.title || '',
|
||||
description: defaultValues?.description || '',
|
||||
@@ -68,21 +68,19 @@ export function UpdateForm({
|
||||
status: defaultValues?.status || 'BORRADOR',
|
||||
stock: defaultValues?.stock ?? 0,
|
||||
urlImg: undefined, // Inicializamos como undefined o null para el FileList
|
||||
userId: defaultValues?.userId
|
||||
};
|
||||
|
||||
const form = useForm<FormDataWithFiles>({ // Usamos el nuevo tipo aquí
|
||||
resolver: zodResolver(formSchemaWithFiles), // Usamos el esquema extendido
|
||||
const form = useForm<EditInventory>({ // Usamos el nuevo tipo aquí
|
||||
resolver: zodResolver(editInventory), // Usamos el esquema extendido
|
||||
defaultValues: defaultformValues,
|
||||
mode: 'onChange',
|
||||
});
|
||||
|
||||
const onSubmit = async (data: FormDataWithFiles) => {
|
||||
const onSubmit = async (data: EditInventory) => {
|
||||
// --- MODIFICACIÓN CLAVE: Crear FormData ---
|
||||
const formData = new FormData();
|
||||
|
||||
// Añadir otros campos de texto al FormData
|
||||
// Asegúrate de que los nombres coincidan con lo que tu backend espera
|
||||
formData.append('id', data.id ? String(data.id) : ''); // Los IDs a menudo son numéricos, conviértelos a string
|
||||
formData.append('title', data.title);
|
||||
formData.append('description', data.description);
|
||||
@@ -90,7 +88,6 @@ export function UpdateForm({
|
||||
formData.append('address', data.address);
|
||||
formData.append('status', data.status);
|
||||
formData.append('stock', String(data.stock)); // Convertir a string
|
||||
formData.append('userId', data.userId ? String(data.userId) : '');
|
||||
|
||||
// --- MODIFICACIÓN AQUÍ: Asegurar que cada archivo sea un 'File' ---
|
||||
if (data.urlImg) { // Primero, verifica que FileList no sea null/undefined
|
||||
@@ -229,7 +226,7 @@ export function UpdateForm({
|
||||
render={({ field: { onChange, onBlur, name, ref } }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Imagen</FormLabel>
|
||||
<p>Peso máximo: 2MB / {sizeFile}</p>
|
||||
<p>Peso máximo: 5MB / {sizeFile}</p>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="file"
|
||||
|
||||
Reference in New Issue
Block a user