Fondemi/sistema_base
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

anexado guardar en minio y cambios generales en la interfaz de osp

Browse Source
This commit is contained in:
Sergio Ramirez
2026-02-24 11:00:50 -04:00
parent fed90d9ff1
commit c70e146ce2
22 changed files with 5139 additions and 696 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
apps/web/feactures/training/components/equipment-list.tsx
View File

@@ -20,22 +20,33 @@ import { Label } from '@repo/shadcn/label';
import { Trash2 } from 'lucide-react';
import { useState } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import { TrainingSchema } from '../schemas/training';
interface EquipmentItem {
machine: string;
quantity: string | number;
}
export function EquipmentList() {
const { control, register } = useFormContext();
const { control, register } = useFormContext<TrainingSchema>();
const { fields, append, remove } = useFieldArray({
control,
name: 'equipmentList',
});
const [isOpen, setIsOpen] = useState(false);
const [newItem, setNewItem] = useState({
const [newItem, setNewItem] = useState<EquipmentItem>({
machine: '',
quantity: '',
});
const handleAdd = () => {
if (newItem.machine && newItem.quantity) {
append({ ...newItem, quantity: Number(newItem.quantity) });
const handleAdd = (e: React.MouseEvent) => {
e.preventDefault();
e.stopPropagation();
if (newItem.machine.trim()) {
append({
machine: newItem.machine,
quantity: newItem.quantity ? Number(newItem.quantity) : 0,
});
setNewItem({ machine: '', quantity: '' });
setIsOpen(false);
}
@@ -47,9 +58,11 @@ export function EquipmentList() {
<h3 className="text-lg font-medium">Datos del Equipamiento</h3>
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button variant="outline">Agregar Maquinaria</Button>
<Button variant="outline" type="button">
Agregar Maquinaria
</Button>
</DialogTrigger>
<DialogContent>
<DialogContent onPointerDownOutside={(e) => e.preventDefault()}>
<DialogHeader>
<DialogTitle>Agregar Maquinaria/Equipo</DialogTitle>
</DialogHeader>
@@ -58,8 +71,9 @@ export function EquipmentList() {
</DialogDescription>
<div className="space-y-4 py-4">
<div className="space-y-2">
<Label>Maquinaria</Label>
<Label htmlFor="modal-machine">Maquinaria</Label>
<Input
id="modal-machine"
value={newItem.machine}
onChange={(e) =>
setNewItem({ ...newItem, machine: e.target.value })
@@ -68,8 +82,9 @@ export function EquipmentList() {
/>
</div>
<div className="space-y-2">
<Label>Cantidad</Label>
<Label htmlFor="modal-quantity">Cantidad</Label>
<Input
id="modal-quantity"
type="number"
value={newItem.quantity}
onChange={(e) =>
@@ -82,12 +97,17 @@ export function EquipmentList() {
<Button
variant="outline"
type="button"
onClick={() => setIsOpen(false)}
onClick={(e) => {
e.preventDefault();
setIsOpen(false);
}}
>
Cancelar
</Button>
<Button onClick={handleAdd}>Guardar</Button>
<Button type="button" onClick={handleAdd}>
Guardar
</Button>
</div>
</div>
</DialogContent>
@@ -99,7 +119,6 @@ export function EquipmentList() {
<TableHeader>
<TableRow>
<TableHead>Maquinaria</TableHead>
<TableHead>Especificaciones</TableHead>
<TableHead>Cantidad</TableHead>
<TableHead className="w-[50px]"></TableHead>
</TableRow>
@@ -111,23 +130,27 @@ export function EquipmentList() {
<input
type="hidden"
{...register(`equipmentList.${index}.machine`)}
defaultValue={field.machine}
/>
{/* @ts-ignore */}
{field.machine}
</TableCell>
<TableCell>
<input
type="hidden"
{...register(`equipmentList.${index}.quantity`)}
defaultValue={field.quantity}
/>
{/* @ts-ignore */}
{field.quantity}
</TableCell>
<TableCell>
<Button
variant="ghost"
size="icon"
onClick={() => remove(index)}
type="button"
onClick={(e) => {
e.preventDefault();
remove(index);
}}
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
@@ -137,7 +160,7 @@ export function EquipmentList() {
{fields.length === 0 && (
<TableRow>
<TableCell
colSpan={4}
colSpan={3}
className="text-center text-muted-foreground"
>
No hay equipamiento registrado

179
apps/web/feactures/training/components/form.tsx
View File

@@ -162,14 +162,16 @@ export function CreateTrainingForm({
});
// 1. Extrae errors de formState
const { formState: { errors } } = form;
const {
formState: { errors },
} = form;
// 2. Crea un efecto para monitorearlos
useEffect(() => {
if (Object.keys(errors).length > 0) {
console.log("Campos con errores:", errors);
}
}, [errors]);
// 2. Crea un efecto para monitorearlos
useEffect(() => {
if (Object.keys(errors).length > 0) {
console.log('Campos con errores:', errors);
}
}, [errors]);
// Cascading Select Logic
const ecoSector = useWatch({ control: form.control, name: 'ecoSector' });
@@ -219,13 +221,12 @@ useEffect(() => {
{ id: 0, name: 'Sin estados' },
];
const coorMunicipalityOptions =
dataCoorMunicipality?.data?.length
? dataCoorMunicipality.data
: [{ id: 0, stateId: 0, name: 'Sin Municipios' }];
const coorMunicipalityOptions = dataCoorMunicipality?.data?.length
? dataCoorMunicipality.data
: [{ id: 0, stateId: 0, name: 'Sin Municipios' }];
const coorParishOptions =
Array.isArray(dataCoorParish?.data) && dataCoorParish?.data?.length
Array.isArray(dataCoorParish?.data) && dataCoorParish?.data?.length
? dataCoorParish.data
: [{ id: 0, stateId: 0, name: 'Sin Parroquias' }];
@@ -264,8 +265,6 @@ useEffect(() => {
}, [defaultValues]);
const onSubmit = async (formData: TrainingSchema) => {
const data = new FormData();
// 1. Definimos las claves que NO queremos enviar en el bucle general
@@ -279,12 +278,13 @@ useEffect(() => {
];
Object.entries(formData).forEach(([key, value]) => {
// 2. Condición actualizada: Si la key está en la lista de excluidos, la saltamos
// 2. Condición actualizada: Si la key está en la lista de excluidos, o es un valor vacío (null/undefined), lo saltamos.
// Permitimos cadenas vacías ('') para indicar al backend que se debe limpiar el campo (ej: borrar foto).
if (excludedKeys.includes(key) || value === undefined || value === null) {
return;
}
// 3. Lógica de conversión (Igual que tenías)
// 3. Lógica de conversión
if (
Array.isArray(value) ||
(typeof value === 'object' && !(value instanceof Date))
@@ -393,10 +393,13 @@ useEffect(() => {
<FormLabel>Teléfono</FormLabel>
<FormControl>
<Input
type="number"
{...field}
placeholder="Ej. 04121234567"
value={field.value ?? ''}
onChange={(e) => {
const val = e.target.value.replace(/\D/g, '');
field.onChange(val.slice(0, 11));
}}
/>
</FormControl>
<FormMessage />
@@ -514,7 +517,7 @@ useEffect(() => {
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
>
<FormControl>
<SelectTrigger className="w-full">
@@ -550,7 +553,7 @@ useEffect(() => {
form.setValue('mainProductiveActivity', '');
form.setValue('productiveActivity', '');
}}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
>
<FormControl>
<SelectTrigger className="w-full">
@@ -585,7 +588,7 @@ useEffect(() => {
form.setValue('mainProductiveActivity', '');
form.setValue('productiveActivity', '');
}}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
disabled={!ecoSector}
>
<FormControl>
@@ -620,7 +623,7 @@ useEffect(() => {
form.setValue('mainProductiveActivity', '');
form.setValue('productiveActivity', '');
}}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
disabled={!productiveSector}
>
<FormControl>
@@ -654,7 +657,7 @@ useEffect(() => {
field.onChange(val);
form.setValue('productiveActivity', '');
}}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
disabled={!centralProductiveActivity}
>
<FormControl>
@@ -685,7 +688,7 @@ useEffect(() => {
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
disabled={!mainProductiveActivity}
>
<FormControl>
@@ -715,7 +718,11 @@ useEffect(() => {
RIF de la organización (opcional)
</FormLabel>
<FormControl>
<Input {...field} placeholder="J-12345678-9" />
<Input
{...field}
value={field.value ?? ''}
placeholder="J-12345678-9"
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -731,7 +738,7 @@ useEffect(() => {
Nombre de la organización (opcional)
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -747,7 +754,11 @@ useEffect(() => {
Año de constitución
</FormLabel>
<FormControl>
<Input type="number" {...field} />
<Input
type="number"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -764,7 +775,7 @@ useEffect(() => {
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
>
<FormControl>
<SelectTrigger>
@@ -793,7 +804,11 @@ useEffect(() => {
infraestrutura (MT2)
</FormLabel>
<FormControl>
<Input {...field} placeholder="e.g. 500" />
<Input
{...field}
value={field.value ?? ''}
placeholder="e.g. 500"
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -837,7 +852,7 @@ useEffect(() => {
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
>
<FormControl>
<SelectTrigger>
@@ -846,9 +861,9 @@ useEffect(() => {
</FormControl>
<SelectContent>
<SelectItem value="CASA">CASA</SelectItem>
<SelectItem value="GALPON">GALPON</SelectItem>
<SelectItem value="GALPÓN">GALPÓN</SelectItem>
<SelectItem value="LOCAL">LOCAL</SelectItem>
<SelectItem value="ALMACEN">ALMACEN</SelectItem>
<SelectItem value="ALMACÉN">ALMACÉN</SelectItem>
</SelectContent>
</Select>
<FormMessage />
@@ -893,7 +908,7 @@ useEffect(() => {
Razones de paralización (opcional)
</FormLabel>
<FormControl>
<Textarea {...field} />
<Textarea {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -952,6 +967,7 @@ useEffect(() => {
<FormControl>
<Input
{...field}
value={field.value ?? ''}
placeholder="https://maps.google.com/..."
/>
</FormControl>
@@ -973,7 +989,7 @@ useEffect(() => {
Nombre de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -989,7 +1005,7 @@ useEffect(() => {
Código SITUR de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1005,7 +1021,7 @@ useEffect(() => {
Rif de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1021,14 +1037,13 @@ useEffect(() => {
Nombre del Vocero o Vocera
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="communeSpokespersonPhone"
@@ -1038,7 +1053,15 @@ useEffect(() => {
Número de Teléfono del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
<Input
{...field}
value={field.value ?? ''}
placeholder="Ej. 04121234567"
onChange={(e) => {
const val = e.target.value.replace(/\D/g, '');
field.onChange(val.slice(0, 11));
}}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1054,7 +1077,11 @@ useEffect(() => {
Correo Electrónico de la Comuna (Opcional)
</FormLabel>
<FormControl>
<Input type="email" {...field} />
<Input
type="email"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1092,7 +1119,7 @@ useEffect(() => {
Código SITUR del Consejo Comunal
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1108,7 +1135,7 @@ useEffect(() => {
Rif del Consejo Comunal
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1124,13 +1151,13 @@ useEffect(() => {
Nombre del Vocero o Vocera
</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="communalCouncilSpokespersonPhone"
@@ -1140,7 +1167,15 @@ useEffect(() => {
Número de Teléfono del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
<Input
{...field}
value={field.value ?? ''}
placeholder="Ej. 04121234567"
onChange={(e) => {
const val = e.target.value.replace(/\D/g, '');
field.onChange(val.slice(0, 11));
}}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1156,7 +1191,11 @@ useEffect(() => {
Correo Electrónico del Consejo Comunal (Opcional)
</FormLabel>
<FormControl>
<Input type="email" {...field} />
<Input
type="email"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1204,9 +1243,9 @@ useEffect(() => {
name="ospResponsibleRif"
render={({ field }) => (
<FormItem>
<FormLabel>RIF</FormLabel>
<FormLabel>RIF (Opcional)</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1218,10 +1257,10 @@ useEffect(() => {
name="civilState"
render={({ field }) => (
<FormItem>
<FormLabel>Estado Civil</FormLabel>
<FormLabel>Estado Civil (Opcional)</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
defaultValue={field.value ?? undefined}
>
<FormControl>
<SelectTrigger className="w-full">
@@ -1248,7 +1287,15 @@ useEffect(() => {
<FormItem>
<FormLabel>Teléfono</FormLabel>
<FormControl>
<Input {...field} />
<Input
{...field}
value={field.value ?? ''}
placeholder="Ej. 04121234567"
onChange={(e) => {
const val = e.target.value.replace(/\D/g, '');
field.onChange(val.slice(0, 11));
}}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1260,9 +1307,13 @@ useEffect(() => {
name="ospResponsibleEmail"
render={({ field }) => (
<FormItem>
<FormLabel>Correo Electrónico</FormLabel>
<FormLabel>Correo Electrónico (Opcional)</FormLabel>
<FormControl>
<Input type="email" {...field} />
<Input
type="email"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1274,9 +1325,13 @@ useEffect(() => {
name="familyBurden"
render={({ field }) => (
<FormItem>
<FormLabel>Carga Familiar</FormLabel>
<FormLabel>Carga Familiar (Opcional)</FormLabel>
<FormControl>
<Input type="number" {...field} />
<Input
type="number"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1288,9 +1343,13 @@ useEffect(() => {
name="numberOfChildren"
render={({ field }) => (
<FormItem>
<FormLabel>Número de Hijos</FormLabel>
<FormLabel>Número de Hijos (Opcional)</FormLabel>
<FormControl>
<Input type="number" {...field} />
<Input
type="number"
{...field}
value={field.value ?? ''}
/>
</FormControl>
<FormMessage />
</FormItem>
@@ -1312,7 +1371,7 @@ useEffect(() => {
<FormItem>
<FormLabel>Observaciones Generales (Opcional)</FormLabel>
<FormControl>
<Textarea {...field} />
<Textarea {...field} value={field.value ?? ''} />
</FormControl>
<FormMessage />
</FormItem>
@@ -1344,7 +1403,7 @@ useEffect(() => {
className="relative aspect-square rounded-md overflow-hidden bg-muted group"
>
<img
src={`${process.env.NEXT_PUBLIC_API_URL}${photoUrl}`}
src={`${photoUrl}`}
alt={`Existing ${idx + 1}`}
className="object-cover w-full h-full"
/>
@@ -1397,7 +1456,9 @@ useEffect(() => {
newFiles.length + selectedFiles.length + existingCount >
3
) {
toast.error(`Máximo 3 imágenes en total. Ya tienes ${existingCount} subidas y ${selectedFiles.length} seleccionadas para subir.`)
toast.error(
`Máximo 3 imágenes en total. Ya tienes ${existingCount} subidas y ${selectedFiles.length} seleccionadas para subir.`,
);
e.target.value = '';
return;
}

343
apps/web/feactures/training/components/product-activity-list.tsx
View File

@@ -31,39 +31,19 @@ import {
SelectValue,
} from '@repo/shadcn/select';
import { SelectSearchable } from '@repo/shadcn/select-searchable';
import { Switch } from '@repo/shadcn/switch';
import { Trash2 } from 'lucide-react';
import { useState } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import { TrainingSchema } from '../schemas/training';
const UNIT_OPTIONS = [
'KG',
'TON',
'UNID',
'LT',
'MTS',
'QQ',
'HM2',
'SACOS',
];
const UNIT_OPTIONS = ['KG', 'TON', 'UNID', 'LT', 'MTS', 'QQ', 'HM2', 'SACOS'];
// 1. Definimos la estructura de los datos para que TypeScript no se queje
interface ProductItem {
productName: string;
description: string;
dailyCount: string;
weeklyCount: string;
monthlyCount: string;
// ... resto de propiedades opcionales si las necesitas tipar estrictamente
[key: string]: any;
}
interface ProductFormValues {
productList: ProductItem[];
}
// ProductItem y ProductFormValues locales eliminados en favor de TrainingSchema
export function ProductActivityList() {
// 2. Pasamos el tipo genérico a useFormContext
const { control, register } = useFormContext<ProductFormValues>();
const { control, register } = useFormContext<TrainingSchema>();
const { fields, append, remove } = useFieldArray({
control,
@@ -74,7 +54,6 @@ export function ProductActivityList() {
// Modal Form State
const [newItem, setNewItem] = useState<any>({
productName: '',
description: '',
dailyCount: '',
weeklyCount: '',
@@ -102,6 +81,7 @@ export function ProductActivityList() {
// Workforce
womenCount: '',
menCount: '',
isExporting: false,
});
// Location logic for Internal Validation
@@ -121,10 +101,9 @@ export function ProductActivityList() {
const isVenezuela = newItem.externalCountry === 'Venezuela';
const handleAdd = () => {
if (newItem.productName) {
if (newItem.description) {
append(newItem);
setNewItem({
productName: '',
description: '',
dailyCount: '',
weeklyCount: '',
@@ -146,6 +125,7 @@ export function ProductActivityList() {
externalUnit: '',
womenCount: '',
menCount: '',
isExporting: false,
});
setInternalStateId(0);
setInternalMuniId(0);
@@ -171,7 +151,7 @@ export function ProductActivityList() {
</DialogTrigger>
<DialogContent className="sm:max-w-[800px] max-h-[80vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>Detalles de Actividad Productiva</DialogTitle>
<DialogTitle>Producto Terminado</DialogTitle>
</DialogHeader>
<DialogDescription className="sr-only">
Datos de actividad productiva
@@ -179,15 +159,6 @@ export function ProductActivityList() {
<div className="space-y-6 py-4">
{/* Basic Info */}
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Producto Terminado</Label>
<Input
value={newItem.productName}
onChange={(e) =>
setNewItem({ ...newItem, productName: e.target.value })
}
/>
</div>
<div className="space-y-2">
<Label>Descripción</Label>
<Input
@@ -250,140 +221,167 @@ export function ProductActivityList() {
</div>
<hr />
<h4 className="font-semibold">Exportación</h4>
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>País</Label>
<Select
value={newItem.externalCountry}
onValueChange={(val) =>
setNewItem({ ...newItem, externalCountry: val })
}
>
<SelectTrigger className="w-full">
<SelectValue placeholder="Seleccione País" />
</SelectTrigger>
<SelectContent>
{/* 3. CORRECCIÓN DEL MAPEO DE PAÍSES Y KEYS */}
{COUNTRY_OPTIONS.map((country: string) => (
<SelectItem key={country} value={country}>
{country}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
{!isVenezuela && (
<div className="space-y-2">
<Label>Ciudad</Label>
<Input
value={newItem.externalCity}
onChange={(e) =>
setNewItem({ ...newItem, externalCity: e.target.value })
}
/>
</div>
)}
<div className="flex items-center space-x-2">
<Switch
id="export-toggle"
checked={newItem.isExporting}
onCheckedChange={(val: boolean) =>
setNewItem({ ...newItem, isExporting: val })
}
/>
<Label htmlFor="export-toggle">
¿El producto es para exportación?
</Label>
</div>
{isVenezuela && (
<div className="grid grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Estado</Label>
<SelectSearchable
options={stateOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) => {
const id = Number(val);
setExternalStateId(id);
setNewItem({ ...newItem, externalState: id });
}}
placeholder="Estado"
/>
{newItem.isExporting && (
<>
<h4 className="font-semibold text-sm">
Datos de Exportación
</h4>
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>País</Label>
<Select
value={newItem.externalCountry}
onValueChange={(val) =>
setNewItem({ ...newItem, externalCountry: val })
}
>
<SelectTrigger className="w-full">
<SelectValue placeholder="Seleccione País" />
</SelectTrigger>
<SelectContent>
{COUNTRY_OPTIONS.map((country: string) => (
<SelectItem key={country} value={country}>
{country}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
{!isVenezuela && (
<div className="space-y-2">
<Label>Ciudad</Label>
<Input
value={newItem.externalCity}
onChange={(e) =>
setNewItem({
...newItem,
externalCity: e.target.value,
})
}
/>
</div>
)}
</div>
<div className="space-y-2">
<Label>Municipio</Label>
<SelectSearchable
options={externalMuniOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) => {
const id = Number(val);
setExternalMuniId(id);
setNewItem({ ...newItem, externalMunicipality: id });
}}
placeholder="Municipio"
disabled={!externalStateId}
/>
{isVenezuela && (
<div className="grid grid-cols-3 gap-4">
<div className="space-y-2">
<Label>Estado</Label>
<SelectSearchable
options={stateOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) => {
const id = Number(val);
setExternalStateId(id);
setNewItem({ ...newItem, externalState: id });
}}
placeholder="Estado"
/>
</div>
<div className="space-y-2">
<Label>Municipio</Label>
<SelectSearchable
options={externalMuniOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) => {
const id = Number(val);
setExternalMuniId(id);
setNewItem({
...newItem,
externalMunicipality: id,
});
}}
placeholder="Municipio"
disabled={!externalStateId}
/>
</div>
<div className="space-y-2">
<Label>Parroquia</Label>
<SelectSearchable
options={externalParishOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) =>
setNewItem({
...newItem,
externalParish: Number(val),
})
}
placeholder="Parroquia"
disabled={!externalMuniId}
/>
</div>
</div>
)}
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Breve Descripción</Label>
<Input
value={newItem.externalDescription}
onChange={(e) =>
setNewItem({
...newItem,
externalDescription: e.target.value,
})
}
/>
</div>
<div className="space-y-2">
<Label>Cantidad Numérica</Label>
<div className="flex gap-2">
<Input
type="number"
className="flex-1"
value={newItem.externalQuantity}
onChange={(e) =>
setNewItem({
...newItem,
externalQuantity: e.target.value,
})
}
/>
<Select
value={newItem.externalUnit}
onValueChange={(val) =>
setNewItem({ ...newItem, externalUnit: val })
}
>
<SelectTrigger className="w-[120px]">
<SelectValue placeholder="Unidad" />
</SelectTrigger>
<SelectContent>
{UNIT_OPTIONS.map((unit) => (
<SelectItem key={unit} value={unit}>
{unit}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
</div>
<div className="space-y-2">
<Label>Parroquia</Label>
<SelectSearchable
options={externalParishOptions.map((s) => ({
value: String(s.id),
label: s.name,
}))}
onValueChange={(val) =>
setNewItem({ ...newItem, externalParish: Number(val) })
}
placeholder="Parroquia"
disabled={!externalMuniId}
/>
</div>
</div>
</>
)}
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label>Breve Descripción</Label>
<Input
value={newItem.externalDescription}
onChange={(e) =>
setNewItem({
...newItem,
externalDescription: e.target.value,
})
}
/>
</div>
<div className="space-y-2">
<Label>Cantidad Numérica</Label>
<div className="flex gap-2">
<Input
type="number"
className="flex-1"
value={newItem.externalQuantity}
onChange={(e) =>
setNewItem({
...newItem,
externalQuantity: e.target.value,
})
}
/>
<Select
value={newItem.externalUnit}
onValueChange={(val) =>
setNewItem({ ...newItem, externalUnit: val })
}
>
<SelectTrigger className="w-[120px]">
<SelectValue placeholder="Unidad" />
</SelectTrigger>
<SelectContent>
{UNIT_OPTIONS.map((unit) => (
<SelectItem key={unit} value={unit}>
{unit}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
</div>
<hr />
<h4 className="font-semibold">Mano de Obra</h4>
<div className="grid grid-cols-2 gap-4">
@@ -428,9 +426,8 @@ export function ProductActivityList() {
<Table>
<TableHeader>
<TableRow>
<TableHead>Producto</TableHead>
<TableHead>Descripción</TableHead>
<TableHead>Mensual</TableHead>
<TableHead>Producto/Descripción</TableHead>
<TableHead>Producción Mensual</TableHead>
<TableHead className="w-[50px]"></TableHead>
</TableRow>
</TableHeader>
@@ -440,13 +437,11 @@ export function ProductActivityList() {
<TableCell>
<input
type="hidden"
{...register(`productList.${index}.productName`)}
// field.productName ahora es válido gracias a la interface
value={field.productName}
{...register(`productList.${index}.description`)}
value={field.description}
/>
{field.productName}
{field.description}
</TableCell>
<TableCell>{field.description}</TableCell>
<TableCell>{field.monthlyCount}</TableCell>
<TableCell>
<Button

76
apps/web/feactures/training/components/production-list.tsx
View File

@@ -27,36 +27,29 @@ import {
import { Trash2 } from 'lucide-react';
import { useState } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import { TrainingSchema } from '../schemas/training';
const UNIT_OPTIONS = [
'KG',
'TON',
'UNID',
'LT',
'MTS',
'QQ',
'HM2',
'SACOS',
];
const UNIT_OPTIONS = ['KG', 'TON', 'UNID', 'LT', 'MTS', 'QQ', 'HM2', 'SACOS'];
export function ProductionList() {
const { control, register } = useFormContext();
const { control, register } = useFormContext<TrainingSchema>();
const { fields, append, remove } = useFieldArray({
control,
name: 'productionList',
});
const [isOpen, setIsOpen] = useState(false);
const [newItem, setNewItem] = useState({
rawMaterial: '',
supplyType: '',
quantity: '',
unit: '',
});
const handleAdd = () => {
if (newItem.rawMaterial && newItem.quantity) {
const handleAdd = (e: React.MouseEvent) => {
e.preventDefault();
e.stopPropagation();
if (newItem.supplyType && newItem.quantity && newItem.unit) {
append({ ...newItem, quantity: Number(newItem.quantity) });
setNewItem({ rawMaterial: '', supplyType: '', quantity: '', unit: '' });
setNewItem({ supplyType: '', quantity: '', unit: '' });
setIsOpen(false);
}
};
@@ -69,24 +62,14 @@ export function ProductionList() {
<DialogTrigger asChild>
<Button variant="outline">Agregar Producción</Button>
</DialogTrigger>
<DialogContent>
<DialogContent onPointerDownOutside={(e) => e.preventDefault()}>
<DialogHeader>
<DialogTitle>Agregar Datos de Producción</DialogTitle>
<DialogTitle>Materia prima requerida (mensual)</DialogTitle>
</DialogHeader>
<DialogDescription className="sr-only">
Datos de producción
</DialogDescription>
<div className="space-y-4 py-4">
<div className="space-y-2">
<Label>Materia prima requerida (mensual)</Label>
<Input
value={newItem.rawMaterial}
onChange={(e) =>
setNewItem({ ...newItem, rawMaterial: e.target.value })
}
placeholder="Descripción de materia prima"
/>
</div>
<div className="space-y-2">
<Label>Tipo de Insumo/Rubro</Label>
<Input
@@ -132,12 +115,23 @@ export function ProductionList() {
<Button
variant="outline"
type="button"
onClick={() => setIsOpen(false)}
onClick={(e) => {
e.preventDefault();
setIsOpen(false);
}}
>
Cancelar
</Button>
<Button onClick={handleAdd}>Guardar</Button>
<Button
type="button"
onClick={handleAdd}
disabled={
!newItem.supplyType || !newItem.quantity || !newItem.unit
}
>
Guardar
</Button>
</div>
</div>
</DialogContent>
@@ -148,7 +142,6 @@ export function ProductionList() {
<Table>
<TableHeader>
<TableRow>
<TableHead>Materia Prima</TableHead>
<TableHead>Tipo Insumo</TableHead>
<TableHead>Cantidad (Mensual)</TableHead>
<TableHead className="w-[50px]"></TableHead>
@@ -160,36 +153,33 @@ export function ProductionList() {
<TableCell>
<input
type="hidden"
{...register(`productionList.${index}.rawMaterial`)}
{...register(`productionList.${index}.supplyType`)}
defaultValue={field.supplyType}
/>
{/* @ts-ignore */}
{field.rawMaterial}
{field.supplyType}
</TableCell>
<TableCell>
<input
type="hidden"
{...register(`productionList.${index}.supplyType`)}
/>
{/* @ts-ignore */}
{field.supplyType}
</TableCell>
<TableCell>
<input
type="hidden"
{...register(`productionList.${index}.quantity`)}
defaultValue={field.quantity}
/>
<input
type="hidden"
{...register(`productionList.${index}.unit`)}
defaultValue={field.unit}
/>
{/* @ts-ignore */}
{field.quantity} {field.unit}
</TableCell>
<TableCell>
<Button
variant="ghost"
size="icon"
onClick={() => remove(index)}
type="button"
onClick={(e) => {
e.preventDefault();
remove(index);
}}
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>

52
apps/web/feactures/training/components/training-view-modal.tsx
View File

@@ -1,5 +1,10 @@
'use client';
import {
useMunicipalityQuery,
useParishQuery,
useStateQuery,
} from '@/feactures/location/hooks/use-query-location';
import { Badge } from '@repo/shadcn/badge';
import { Button } from '@repo/shadcn/button';
import {
@@ -28,11 +33,6 @@ import {
} from 'lucide-react';
import React, { useState } from 'react';
import { TrainingSchema } from '../schemas/training';
import {
useMunicipalityQuery,
useParishQuery,
useStateQuery,
} from '@/feactures/location/hooks/use-query-location';
interface TrainingViewModalProps {
data: TrainingSchema | null;
@@ -46,14 +46,16 @@ export function TrainingViewModal({
onClose,
}: TrainingViewModalProps) {
const [selectedImage, setSelectedImage] = useState<string | null>(null);
const { data: statesData } = useStateQuery();
const { data: municipalitiesData } = useMunicipalityQuery(data?.state || 0);
const { data: parishesData } = useParishQuery(data?.municipality || 0);
if (!data) return null;
const stateName = statesData?.data?.find((s: any) => s.id === data.state)?.name;
const stateName = statesData?.data?.find(
(s: any) => s.id === data.state,
)?.name;
const municipalityName = municipalitiesData?.data?.find(
(m: any) => m.id === data.municipality,
)?.name;
@@ -94,7 +96,7 @@ export function TrainingViewModal({
</Card>
);
const BooleanBadge = ({ value }: { value?: boolean }) => (
const BooleanBadge = ({ value }: { value?: boolean | null }) => (
<Badge variant={value ? 'default' : 'secondary'}>
{value ? 'Sí' : 'No'}
</Badge>
@@ -273,7 +275,10 @@ export function TrainingViewModal({
<span className="text-xs font-bold text-muted-foreground block mb-1">
DISTRIBUCIÓN INTERNA
</span>
<p>Cant: {prod.internalQuantity} {prod.internalUnit}</p>
<p>
Cant: {prod.internalQuantity}{' '}
{prod.internalUnit}
</p>
<p className="text-xs text-muted-foreground">
{prod.internalDescription}
</p>
@@ -284,7 +289,10 @@ export function TrainingViewModal({
<span className="text-xs font-bold text-muted-foreground block mb-1">
EXPORTACIÓN ({prod.externalCountry})
</span>
<p>Cant: {prod.externalQuantity} {prod.externalUnit}</p>
<p>
Cant: {prod.externalQuantity}{' '}
{prod.externalUnit}
</p>
<p className="text-xs text-muted-foreground">
{prod.externalDescription}
</p>
@@ -334,10 +342,10 @@ export function TrainingViewModal({
))}
{(!data.equipmentList ||
data.equipmentList.length === 0) && (
<p className="text-sm text-muted-foreground italic">
No hay equipamiento registrado.
</p>
)}
<p className="text-sm text-muted-foreground italic">
No hay equipamiento registrado.
</p>
)}
</CardContent>
</Card>
@@ -360,15 +368,17 @@ export function TrainingViewModal({
{mat.supplyType}
</p>
</div>
<Badge variant="secondary">Cant: {mat.quantity} {mat.unit}</Badge>
<Badge variant="secondary">
Cant: {mat.quantity} {mat.unit}
</Badge>
</div>
))}
{(!data.productionList ||
data.productionList.length === 0) && (
<p className="text-sm text-muted-foreground italic">
No hay materia prima registrada.
</p>
)}
<p className="text-sm text-muted-foreground italic">
No hay materia prima registrada.
</p>
)}
</CardContent>
</Card>
</div>
@@ -463,7 +473,7 @@ export function TrainingViewModal({
onClick={() => setSelectedImage(photo)}
>
<img
src={`${process.env.NEXT_PUBLIC_API_URL}${photo}`}
src={`${photo}`}
alt={`Evidencia ${idx + 1}`}
className="object-cover w-full h-full"
/>
@@ -513,7 +523,7 @@ export function TrainingViewModal({
</Button>
{selectedImage && (
<img
src={`${process.env.NEXT_PUBLIC_API_URL}${selectedImage}`}
src={`${selectedImage}`}
alt="Vista ampliada"
className="max-w-full max-h-[90vh] object-contain rounded-md"
/>

147
apps/web/feactures/training/schemas/training.ts
View File

@@ -3,42 +3,40 @@ import { z } from 'zod';
// 1. Definimos el esquema de un item individual de la lista de productos
// Basado en los campos que usaste en ProductActivityList
const productItemSchema = z.object({
productName: z.string(),
description: z.string().optional(),
dailyCount: z.coerce.string().or(z.number()).optional(), // Aceptamos string o number por los inputs
weeklyCount: z.coerce.string().or(z.number()).optional(),
monthlyCount: z.coerce.string().or(z.number()).optional(),
description: z.string().optional().nullable(),
dailyCount: z.coerce.string().or(z.number()).optional().nullable(),
weeklyCount: z.coerce.string().or(z.number()).optional().nullable(),
monthlyCount: z.coerce.string().or(z.number()).optional().nullable(),
// Distribución Interna
internalDistributionZone: z.string().optional(),
internalQuantity: z.coerce.string().or(z.number()).optional(),
internalUnit: z.string().optional(),
internalDistributionZone: z.string().optional().nullable(),
internalQuantity: z.coerce.string().or(z.number()).optional().nullable(),
internalUnit: z.string().optional().nullable(),
// Distribución Externa
externalCountry: z.string().optional(),
externalCountry: z.string().optional().nullable(),
externalState: z.number().optional().nullable(),
externalMunicipality: z.number().optional().nullable(),
externalParish: z.number().optional().nullable(),
externalCity: z.string().optional(),
externalDescription: z.string().optional(),
externalQuantity: z.coerce.string().or(z.number()).optional(),
externalUnit: z.string().optional(),
externalCity: z.string().optional().nullable(),
externalDescription: z.string().optional().nullable(),
externalQuantity: z.coerce.string().or(z.number()).optional().nullable(),
externalUnit: z.string().optional().nullable(),
// Mano de obra
womenCount: z.coerce.string().or(z.number()).optional(),
menCount: z.coerce.string().or(z.number()).optional(),
womenCount: z.coerce.string().or(z.number()).optional().nullable(),
menCount: z.coerce.string().or(z.number()).optional().nullable(),
});
const productionItemSchema = z.object({
rawMaterial: z.string(),
supplyType: z.string().optional(),
quantity: z.coerce.string().or(z.number()).optional(), // Aceptamos string o number por los inputs
unit: z.string().optional(),
supplyType: z.string().optional().nullable(),
quantity: z.coerce.string().or(z.number()).optional().nullable(),
unit: z.string().min(1, { message: 'Unidad es requerida' }).nullable(),
});
const equipmentItemSchema = z.object({
machine: z.string(),
quantity: z.coerce.string().or(z.number()).optional(), // Aceptamos string o number por los inputs
machine: z.string().nullable(),
quantity: z.coerce.string().or(z.number()).optional().nullable(),
});
export const trainingSchema = z.object({
@@ -46,38 +44,47 @@ export const trainingSchema = z.object({
id: z.number().optional(),
firstname: z.string().min(1, { message: 'Nombre es requerido' }),
lastname: z.string().min(1, { message: 'Apellido es requerido' }),
coorPhone: z.string().optional().nullable(),
coorPhone: z
.string()
.optional()
.nullable()
.refine((val) => !val || /^(04|02)\d{9}$/.test(val), {
message: 'El teléfono debe tener 11 dígitos y comenzar con 04 o 02',
}),
visitDate: z
.string()
.min(1, { message: 'Fecha y hora de visita es requerida' }),
//Datos de la organización socioproductiva (OSP)
ospType: z.string().min(1, { message: 'Tipo de OSP es requerido' }),
ecoSector: z.string().optional().or(z.literal('')),
productiveSector: z.string().optional().or(z.literal('')),
centralProductiveActivity: z.string().optional().or(z.literal('')),
mainProductiveActivity: z.string().optional().or(z.literal('')),
ecoSector: z.string().optional().or(z.literal('')).nullable(),
productiveSector: z.string().optional().or(z.literal('')).nullable(),
centralProductiveActivity: z.string().optional().or(z.literal('')).nullable(),
mainProductiveActivity: z.string().optional().or(z.literal('')).nullable(),
productiveActivity: z
.string()
.min(1, { message: 'Actividad productiva es requerida' }),
ospRif: z.string().optional().or(z.literal('')),
ospName: z.string().optional().or(z.literal('')),
ospRif: z.string().optional().or(z.literal('')).nullable(),
ospName: z.string().optional().or(z.literal('')).nullable(),
companyConstitutionYear: z.coerce
.number()
.min(1900, { message: 'Año inválido' }),
.min(1900, { message: 'Año inválido' })
.nullable(),
currentStatus: z
.string()
.min(1, { message: 'Estatus actual es requerido' })
.default('ACTIVA'),
infrastructureMt2: z.string().optional().or(z.literal('')),
infrastructureMt2: z.string().optional().or(z.literal('')).nullable(),
hasTransport: z
.preprocess((val) => val === 'true' || val === true, z.boolean())
.optional(),
structureType: z.string().optional().or(z.literal('')),
.optional()
.nullable(),
structureType: z.string().optional().or(z.literal('')).nullable(),
isOpenSpace: z
.preprocess((val) => val === 'true' || val === true, z.boolean())
.optional(),
paralysisReason: z.string().optional().default(''),
.optional()
.nullable(),
paralysisReason: z.string().optional().nullable(),
//Datos del Equipamiento
equipmentList: z.array(equipmentItemSchema).optional().default([]),
@@ -92,29 +99,47 @@ export const trainingSchema = z.object({
ospAddress: z
.string()
.min(1, { message: 'Dirección de la OSP es requerida' }),
ospGoogleMapsLink: z.string().optional().or(z.literal('')),
communeName: z.string().optional().or(z.literal('')),
siturCodeCommune: z.string().optional().or(z.literal('')),
communeRif: z.string().optional().or(z.literal('')),
communeSpokespersonName: z.string().optional().or(z.literal('')),
communeSpokespersonPhone: z.string().optional().or(z.literal('')),
ospGoogleMapsLink: z.string().optional().or(z.literal('')).nullable(),
communeName: z.string().optional().or(z.literal('')).nullable(),
siturCodeCommune: z.string().optional().or(z.literal('')).nullable(),
communeRif: z.string().optional().or(z.literal('')).nullable(),
communeSpokespersonName: z.string().optional().or(z.literal('')).nullable(),
communeSpokespersonPhone: z
.string()
.optional()
.or(z.literal(''))
.refine((val) => !val || /^(04|02)\d{9}$/.test(val), {
message: 'El teléfono debe tener 11 dígitos y comenzar con 04 o 02',
}),
communeEmail: z
.string()
.email({ message: 'Correo electrónico de la Comuna inválido' })
.optional()
.or(z.literal('')),
.or(z.literal(''))
.nullable(),
communalCouncil: z
.string()
.min(1, { message: 'Consejo Comunal es requerido' }),
siturCodeCommunalCouncil: z.string().optional().or(z.literal('')),
communalCouncilRif: z.string().optional().or(z.literal('')),
communalCouncilSpokespersonName: z.string().optional().or(z.literal('')),
communalCouncilSpokespersonPhone: z.string().optional().or(z.literal('')),
siturCodeCommunalCouncil: z.string().optional().or(z.literal('')).nullable(),
communalCouncilRif: z.string().optional().or(z.literal('')).nullable(),
communalCouncilSpokespersonName: z
.string()
.optional()
.or(z.literal(''))
.nullable(),
communalCouncilSpokespersonPhone: z
.string()
.optional()
.or(z.literal(''))
.refine((val) => !val || /^(04|02)\d{9}$/.test(val), {
message: 'El teléfono debe tener 11 dígitos y comenzar con 04 o 02',
}),
communalCouncilEmail: z
.string()
.email({ message: 'Correo electrónico del Consejo Comunal inválido' })
.optional()
.or(z.literal('')),
.or(z.literal(''))
.nullable(),
//Datos del Responsable OSP
ospResponsibleCedula: z
@@ -123,25 +148,26 @@ export const trainingSchema = z.object({
ospResponsibleFullname: z
.string()
.min(1, { message: 'Nombre del responsable es requerido' }),
ospResponsibleRif: z
.string()
.min(1, { message: 'RIF del responsable es requerido' }),
civilState: z.string().min(1, { message: 'Estado civil es requerido' }),
ospResponsibleRif: z.string().optional().nullable(),
civilState: z.string().optional().nullable(),
ospResponsiblePhone: z
.string()
.min(1, { message: 'Teléfono del responsable es requerido' }),
.min(1, { message: 'Teléfono del responsable es requerido' })
.regex(/^(04|02)\d{9}$/, {
message: 'El teléfono debe tener 11 dígitos y comenzar con 04 o 02',
}),
ospResponsibleEmail: z
.string()
.email({ message: 'Correo electrónico inválido' }),
familyBurden: z.coerce
.number()
.min(0, { message: 'Carga familiar requerida' }),
numberOfChildren: z.coerce
.number()
.min(0, { message: 'Número de hijos requerido' }),
.email({ message: 'Correo electrónico inválido' })
.optional()
.or(z.literal(''))
.nullable(),
familyBurden: z.coerce.number().optional(),
numberOfChildren: z.coerce.number().optional(),
//Datos adicionales
generalObservations: z.string().optional().default(''),
generalObservations: z.string().optional().nullable(),
//IMAGENES
files: z.any().optional(),
@@ -157,6 +183,9 @@ export const trainingSchema = z.object({
photo2: z.string().optional().nullable(),
photo3: z.string().optional().nullable(),
createdBy: z.number().optional().nullable(),
updatedBy: z.number().optional().nullable(),
createdAt: z.string().optional().nullable(),
updatedAt: z.string().optional().nullable(),
});
export type TrainingSchema = z.infer<typeof trainingSchema>;