nuevas correciones al formulario y esquema base de datos para osp
This commit is contained in:
@@ -1,7 +1,9 @@
|
||||
'use client';
|
||||
|
||||
import { COUNTRY_OPTIONS } from '@/constants/countries';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import { Button } from '@repo/shadcn/button';
|
||||
import { Separator } from '@repo/shadcn/components/ui/separator';
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
@@ -18,6 +20,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@repo/shadcn/select';
|
||||
import { Switch } from '@repo/shadcn/switch';
|
||||
import { Textarea } from '@repo/shadcn/textarea';
|
||||
import { useForm, useWatch } from 'react-hook-form';
|
||||
import {
|
||||
@@ -98,8 +101,7 @@ export function CreateTrainingForm({
|
||||
const form = useForm<TrainingSchema>({
|
||||
resolver: zodResolver(trainingSchema),
|
||||
defaultValues: {
|
||||
firstname: defaultValues?.firstname || '',
|
||||
lastname: defaultValues?.lastname || '',
|
||||
coorFullName: defaultValues?.coorFullName || '',
|
||||
coorState: defaultValues?.coorState || undefined,
|
||||
coorMunicipality: defaultValues?.coorMunicipality || undefined,
|
||||
coorParish: defaultValues?.coorParish || undefined,
|
||||
@@ -157,6 +159,17 @@ export function CreateTrainingForm({
|
||||
state: defaultValues?.state || undefined,
|
||||
municipality: defaultValues?.municipality || undefined,
|
||||
parish: defaultValues?.parish || undefined,
|
||||
|
||||
internalDistributionZone: defaultValues?.internalDistributionZone || '',
|
||||
isExporting: defaultValues?.isExporting || false,
|
||||
externalCountry: defaultValues?.externalCountry || '',
|
||||
externalCity: defaultValues?.externalCity || '',
|
||||
externalDescription: defaultValues?.externalDescription || '',
|
||||
externalQuantity: defaultValues?.externalQuantity || '',
|
||||
externalUnit: defaultValues?.externalUnit || '',
|
||||
|
||||
womenCount: defaultValues?.womenCount || 0,
|
||||
menCount: defaultValues?.menCount || 0,
|
||||
},
|
||||
mode: 'onChange',
|
||||
});
|
||||
@@ -213,23 +226,6 @@ export function CreateTrainingForm({
|
||||
mainProductiveActivity,
|
||||
]);
|
||||
|
||||
const { data: dataCoorState } = useStateQuery();
|
||||
const { data: dataCoorMunicipality } = useMunicipalityQuery(coorState);
|
||||
const { data: dataCoorParish } = useParishQuery(coorMunicipality);
|
||||
|
||||
const coorStateOptions = dataCoorState?.data || [
|
||||
{ id: 0, name: 'Sin estados' },
|
||||
];
|
||||
|
||||
const coorMunicipalityOptions = dataCoorMunicipality?.data?.length
|
||||
? dataCoorMunicipality.data
|
||||
: [{ id: 0, stateId: 0, name: 'Sin Municipios' }];
|
||||
|
||||
const coorParishOptions =
|
||||
Array.isArray(dataCoorParish?.data) && dataCoorParish?.data?.length
|
||||
? dataCoorParish.data
|
||||
: [{ id: 0, stateId: 0, name: 'Sin Parroquias' }];
|
||||
|
||||
const stateOptions = dataState?.data || [{ id: 0, name: 'Sin estados' }];
|
||||
|
||||
const municipalityOptions = dataMunicipality?.data?.length
|
||||
@@ -313,6 +309,7 @@ export function CreateTrainingForm({
|
||||
selectedFiles.forEach((file) => {
|
||||
data.append('files', file);
|
||||
});
|
||||
|
||||
const mutation = defaultValues?.id ? updateTraining : createTraining;
|
||||
|
||||
mutation(data as any, {
|
||||
@@ -359,26 +356,14 @@ export function CreateTrainingForm({
|
||||
<CardContent className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="firstname"
|
||||
name="coorFullName"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Nombre del Coordinador Estadal</FormLabel>
|
||||
<FormLabel>
|
||||
Nombre y Apellido del Coordinador Estadal
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Ej. Juan" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="lastname"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Apellido del Coordinador Estadal</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Ej. Pérez" />
|
||||
<Input {...field} placeholder="Ej. Juan Pérez" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
@@ -825,7 +810,7 @@ export function CreateTrainingForm({
|
||||
</FormLabel>
|
||||
<Select
|
||||
onValueChange={(val) => field.onChange(val === 'true')}
|
||||
defaultValue={field.value ? 'true' : 'false'}
|
||||
value={field.value ? 'true' : 'false'}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
@@ -881,7 +866,7 @@ export function CreateTrainingForm({
|
||||
</FormLabel>
|
||||
<Select
|
||||
onValueChange={(val) => field.onChange(val === 'true')}
|
||||
defaultValue={field.value ? 'true' : 'false'}
|
||||
value={field.value ? 'true' : 'false'}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
@@ -936,6 +921,212 @@ export function CreateTrainingForm({
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Distribución y Exportación */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Zona de Distribución y Exportación</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="internalDistributionZone"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
Breve Descripción de la Zona de Distribución
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
{...field}
|
||||
placeholder="Ej. Mercado local y regional"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<Separator />
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="isExporting"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex flex-row items-center justify-between rounded-lg border p-4">
|
||||
<div className="space-y-0.5">
|
||||
<FormLabel className="text-base">
|
||||
¿El producto es para exportación?
|
||||
</FormLabel>
|
||||
</div>
|
||||
<FormControl>
|
||||
<Switch
|
||||
checked={field.value}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
</FormControl>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{form.watch('isExporting') && (
|
||||
<div className="space-y-4 pt-4 border-t">
|
||||
<h4 className="font-semibold text-sm">
|
||||
Datos de Exportación
|
||||
</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="externalCountry"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>País</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value ?? undefined}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger className="w-full">
|
||||
<SelectValue placeholder="Seleccione País" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{COUNTRY_OPTIONS.map((country: string) => (
|
||||
<SelectItem key={country} value={country}>
|
||||
{country}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="externalCity"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Ciudad</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} value={field.value ?? ''} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="externalDescription"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Breve Descripción</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} value={field.value ?? ''} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="externalQuantity"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Cantidad</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="number"
|
||||
{...field}
|
||||
value={field.value ?? ''}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="externalUnit"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Unidad</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value ?? undefined}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger className="w-full">
|
||||
<SelectValue placeholder="Unidad" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{[
|
||||
'KG',
|
||||
'TON',
|
||||
'UNID',
|
||||
'LT',
|
||||
'MTS',
|
||||
'QQ',
|
||||
'HM2',
|
||||
'SACOS',
|
||||
].map((unit) => (
|
||||
<SelectItem key={unit} value={unit}>
|
||||
{unit}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Mano de Obra */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Mano de Obra</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="womenCount"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Mujeres (cantidad)</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="menCount"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Hombres (cantidad)</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* 3. Detalles de la ubicación */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
@@ -963,12 +1154,14 @@ export function CreateTrainingForm({
|
||||
name="ospGoogleMapsLink"
|
||||
render={({ field }) => (
|
||||
<FormItem className="col-span-1 lg:col-span-2 flex flex-col space-y-2">
|
||||
<FormLabel>Dirección Link Google Maps</FormLabel>
|
||||
<FormLabel>
|
||||
Coordenadas de la Ubicación (Google Maps)
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
{...field}
|
||||
value={field.value ?? ''}
|
||||
placeholder="https://maps.google.com/..."
|
||||
placeholder="10.123456, -66.123456"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
|
||||
Reference in New Issue
Block a user