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

correciones visuales al formulario

Browse Source
This commit is contained in:
Sergio Ramirez
2026-01-29 09:31:00 -04:00
parent 8efe595f73
commit 2566e5e9a7
3 changed files with 133 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/web/app/dashboard/formulario/nuevo/page.tsx
View File

@@ -1,6 +1,4 @@
'use client';
import PageContainer from '@/components/layout/page-container';
import { CreateTrainingForm } from '@/feactures/training/components/form';
import { useRouter } from 'next/navigation';
@@ -9,7 +7,7 @@ export default function NewTrainingPage() {
return (
// <PageContainer scrollable>
<div className="px-6 pt-2 pb-6 flex-1 space-y-4">
<div className="p-6 space-y-6">
<CreateTrainingForm
onSuccess={() => router.push('/dashboard/formulario')}
onCancel={() => router.back()}

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

@@ -409,13 +409,17 @@ export function CreateTrainingForm({
2. Datos de la Organización Socioproductiva (OSP)
</CardTitle>
</CardHeader>
<CardContent className="grid grid-cols-1 md:grid-cols-2 gap-4">
{/* CAMBIO 1: lg:grid-cols-2 para evitar columnas estrechas en tablets */}
<CardContent className="grid grid-cols-1 lg:grid-cols-2 gap-6 items-start">
<FormField
control={form.control}
name="ospType"
render={({ field }) => (
<FormItem>
<FormLabel>Tipo de Organización</FormLabel>
/* CAMBIO 2: flex flex-col y space-y-3 para forzar separación vertical interna */
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Tipo de Organización
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
@@ -442,12 +446,13 @@ export function CreateTrainingForm({
control={form.control}
name="ecoSector"
render={({ field }) => (
<FormItem>
<FormLabel>Sector Económico</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Sector Económico
</FormLabel>
<Select
onValueChange={(val) => {
field.onChange(val);
// Reset downstream
form.setValue('productiveSector', '');
form.setValue('centralProductiveActivity', '');
form.setValue('mainProductiveActivity', '');
@@ -477,8 +482,10 @@ export function CreateTrainingForm({
control={form.control}
name="productiveSector"
render={({ field }) => (
<FormItem>
<FormLabel>SECTOR PRODUCTIVO</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Sector Productivo
</FormLabel>
<Select
onValueChange={(val) => {
field.onChange(val);
@@ -511,8 +518,10 @@ export function CreateTrainingForm({
control={form.control}
name="centralProductiveActivity"
render={({ field }) => (
<FormItem>
<FormLabel>ACTIVIDAD CENTRAL PRODUCTIVO</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Actividad Central Productiva
</FormLabel>
<Select
onValueChange={(val) => {
field.onChange(val);
@@ -544,8 +553,10 @@ export function CreateTrainingForm({
control={form.control}
name="mainProductiveActivity"
render={({ field }) => (
<FormItem>
<FormLabel>ACTIVIDAD PRODUCTIVA PRINCIPAL</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Actividad Productiva Principal
</FormLabel>
<Select
onValueChange={(val) => {
field.onChange(val);
@@ -576,8 +587,10 @@ export function CreateTrainingForm({
control={form.control}
name="productiveActivity"
render={({ field }) => (
<FormItem>
<FormLabel>ACTIVIDAD PRODUCTIVA</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Actividad Productiva
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
@@ -605,8 +618,10 @@ export function CreateTrainingForm({
control={form.control}
name="ospRif"
render={({ field }) => (
<FormItem>
<FormLabel>RIF de la organización (opcional)</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
RIF de la organización (opcional)
</FormLabel>
<FormControl>
<Input {...field} placeholder="J-12345678-9" />
</FormControl>
@@ -619,8 +634,10 @@ export function CreateTrainingForm({
control={form.control}
name="ospName"
render={({ field }) => (
<FormItem>
<FormLabel>Nombre de la organización</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Nombre de la organización
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -633,8 +650,10 @@ export function CreateTrainingForm({
control={form.control}
name="companyConstitutionYear"
render={({ field }) => (
<FormItem>
<FormLabel>Año de constitución</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Año de constitución
</FormLabel>
<FormControl>
<Input type="number" {...field} />
</FormControl>
@@ -647,8 +666,10 @@ export function CreateTrainingForm({
control={form.control}
name="currentStatus"
render={({ field }) => (
<FormItem>
<FormLabel>Estatus</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Estatus
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
@@ -675,8 +696,10 @@ export function CreateTrainingForm({
control={form.control}
name="infrastructureMt2"
render={({ field }) => (
<FormItem>
<FormLabel>INFRAESTRUCTURA (MT2)</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
infraestrutura (MT2)
</FormLabel>
<FormControl>
<Input {...field} placeholder="e.g. 500" />
</FormControl>
@@ -689,8 +712,10 @@ export function CreateTrainingForm({
control={form.control}
name="hasTransport"
render={({ field }) => (
<FormItem>
<FormLabel>POSEE TRANSPORTE</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
¿Posee Transporte?
</FormLabel>
<Select
onValueChange={(val) => field.onChange(val === 'true')}
defaultValue={field.value ? 'true' : 'false'}
@@ -714,8 +739,10 @@ export function CreateTrainingForm({
control={form.control}
name="structureType"
render={({ field }) => (
<FormItem>
<FormLabel>TIPO DE ESTRUCTURA</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Tipo Estructura
</FormLabel>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
@@ -739,8 +766,10 @@ export function CreateTrainingForm({
control={form.control}
name="isOpenSpace"
render={({ field }) => (
<FormItem>
<FormLabel>Es un ESPACIO ABIERTO</FormLabel>
<FormItem className="w-full flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
¿Es un Espacio Abierto?
</FormLabel>
<Select
onValueChange={(val) => field.onChange(val === 'true')}
defaultValue={field.value ? 'true' : 'false'}
@@ -764,8 +793,11 @@ export function CreateTrainingForm({
control={form.control}
name="paralysisReason"
render={({ field }) => (
<FormItem className="col-span-2">
<FormLabel>Razones de paralización (opcional)</FormLabel>
/* CAMBIO: Se mantiene col-span-2 para que ocupe todo el ancho si hay espacio */
<FormItem className="col-span-1 lg:col-span-2 flex flex-col space-y-3">
<FormLabel className="whitespace-normal leading-tight font-semibold">
Razones de paralización (opcional)
</FormLabel>
<FormControl>
<Textarea {...field} />
</FormControl>
@@ -800,12 +832,12 @@ export function CreateTrainingForm({
<CardHeader>
<CardTitle>3. Detalles de la ubicación</CardTitle>
</CardHeader>
<CardContent className="grid grid-cols-1 md:grid-cols-2 gap-4">
<CardContent className="grid grid-cols-1 lg:grid-cols-2 gap-6 items-start">
<FormField
control={form.control}
name="ospAddress"
render={({ field }) => (
<FormItem className="col-span-2">
<FormItem className="col-span-1 lg:col-span-2 flex flex-col space-y-2">
<FormLabel>
Dirección de la Organización Socio Productivo
</FormLabel>
@@ -821,7 +853,7 @@ export function CreateTrainingForm({
control={form.control}
name="ospGoogleMapsLink"
render={({ field }) => (
<FormItem className="col-span-2">
<FormItem className="col-span-1 lg:col-span-2 flex flex-col space-y-2">
<FormLabel>Dirección Link Google Maps</FormLabel>
<FormControl>
<Input
@@ -834,7 +866,7 @@ export function CreateTrainingForm({
)}
/>
<div className="col-span-2">
<div className="col-span-1 lg:col-span-2 border-b pb-2 mt-4 hidden md:inline">
<h4 className="font-semibold mb-2">Datos de la Comuna</h4>
</div>
@@ -842,8 +874,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeName"
render={({ field }) => (
<FormItem>
<FormLabel>Nombre de la Comuna</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Nombre de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -856,8 +890,10 @@ export function CreateTrainingForm({
control={form.control}
name="siturCodeCommune"
render={({ field }) => (
<FormItem>
<FormLabel>Código SITUR de la Comuna</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Código SITUR de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -870,8 +906,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeRif"
render={({ field }) => (
<FormItem>
<FormLabel>Rif de la Comuna</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Rif de la Comuna
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -884,8 +922,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeSpokespersonName"
render={({ field }) => (
<FormItem>
<FormLabel>Nombre del Vocero o Vocera</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Nombre del Vocero o Vocera
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -898,8 +938,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeSpokespersonCedula"
render={({ field }) => (
<FormItem>
<FormLabel>Cédula de Identidad del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Cédula de Identidad del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -912,8 +954,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeSpokespersonRif"
render={({ field }) => (
<FormItem>
<FormLabel>RIF del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
RIF del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -926,8 +970,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeSpokespersonPhone"
render={({ field }) => (
<FormItem>
<FormLabel>Número de Teléfono del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Número de Teléfono del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -940,8 +986,10 @@ export function CreateTrainingForm({
control={form.control}
name="communeEmail"
render={({ field }) => (
<FormItem>
<FormLabel>Correo Electrónico de la Comuna</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Correo Electrónico de la Comuna
</FormLabel>
<FormControl>
<Input type="email" {...field} />
</FormControl>
@@ -950,7 +998,7 @@ export function CreateTrainingForm({
)}
/>
<div className="col-span-2">
<div className="col-span-2 hidden md:inline">
<h4 className="font-semibold mb-2">
Datos del Consejo Comunal
</h4>
@@ -960,8 +1008,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncil"
render={({ field }) => (
<FormItem>
<FormLabel>Nombre del Consejo Comunal</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Nombre del Consejo Comunal
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -974,8 +1024,10 @@ export function CreateTrainingForm({
control={form.control}
name="siturCodeCommunalCouncil"
render={({ field }) => (
<FormItem>
<FormLabel>Código SITUR del Consejo Comunal</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Código SITUR del Consejo Comunal
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -988,8 +1040,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilRif"
render={({ field }) => (
<FormItem>
<FormLabel>Rif del Consejo Comunal</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Rif del Consejo Comunal
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -1002,8 +1056,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilSpokespersonName"
render={({ field }) => (
<FormItem>
<FormLabel>Nombre del Vocero o Vocera</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Nombre del Vocero o Vocera
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -1016,8 +1072,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilSpokespersonCedula"
render={({ field }) => (
<FormItem>
<FormLabel>Cédula de Identidad del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Cédula de Identidad del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -1030,8 +1088,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilSpokespersonRif"
render={({ field }) => (
<FormItem>
<FormLabel>RIF del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
RIF del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -1044,8 +1104,10 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilSpokespersonPhone"
render={({ field }) => (
<FormItem>
<FormLabel>Número de Teléfono del Vocero</FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Número de Teléfono del Vocero
</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@@ -1058,8 +1120,8 @@ export function CreateTrainingForm({
control={form.control}
name="communalCouncilEmail"
render={({ field }) => (
<FormItem>
<FormLabel>
<FormItem className="w-full flex flex-col space-y-2">
<FormLabel className="font-semibold">
Correo Electrónico del Consejo Comunal
</FormLabel>
<FormControl>

2
apps/web/feactures/training/components/training-tables/training-table-action.tsx
View File

@@ -24,7 +24,7 @@ export default function TrainingTableAction() {
size="sm"
>
<Plus className="h-4 w-4" />
Nuevo Registro
<span className="hidden md:inline">Nuevo Registro</span>
</Button>
</div>
);