Separación vista/lógica de wizard de creación de asignatura
This commit is contained in:
127
src/features/asignaturas/new/NuevaAsignaturaModalContainer.tsx
Normal file
127
src/features/asignaturas/new/NuevaAsignaturaModalContainer.tsx
Normal file
@@ -0,0 +1,127 @@
|
||||
import { useNavigate } from '@tanstack/react-router'
|
||||
|
||||
import { useNuevaAsignaturaWizard } from './hooks/useNuevaAsignaturaWizard'
|
||||
|
||||
import { PasoBasicosForm } from '@/components/asignaturas/wizard/PasoBasicosForm'
|
||||
import { PasoConfiguracionPanel } from '@/components/asignaturas/wizard/PasoConfiguracionPanel'
|
||||
import { PasoMetodoCardGroup } from '@/components/asignaturas/wizard/PasoMetodoCardGroup'
|
||||
import { PasoResumenCard } from '@/components/asignaturas/wizard/PasoResumenCard'
|
||||
import { VistaSinPermisos } from '@/components/asignaturas/wizard/VistaSinPermisos'
|
||||
import { WizardControls } from '@/components/asignaturas/wizard/WizardControls'
|
||||
import { WizardHeader } from '@/components/asignaturas/wizard/WizardHeader'
|
||||
import { defineStepper } from '@/components/stepper'
|
||||
import { Dialog, DialogContent } from '@/components/ui/dialog'
|
||||
|
||||
const Wizard = defineStepper(
|
||||
{
|
||||
id: 'metodo',
|
||||
title: 'Método',
|
||||
description: 'Manual, IA o Clonado',
|
||||
},
|
||||
{
|
||||
id: 'basicos',
|
||||
title: 'Datos básicos',
|
||||
description: 'Nombre y estructura',
|
||||
},
|
||||
{
|
||||
id: 'configuracion',
|
||||
title: 'Configuración',
|
||||
description: 'Detalles según modo',
|
||||
},
|
||||
{
|
||||
id: 'resumen',
|
||||
title: 'Resumen',
|
||||
description: 'Confirmar creación',
|
||||
},
|
||||
)
|
||||
|
||||
const auth_get_current_user_role = () => 'JEFE_CARRERA' as const
|
||||
|
||||
export function NuevaAsignaturaModalContainer({ planId }: { planId: string }) {
|
||||
const navigate = useNavigate()
|
||||
const role = auth_get_current_user_role()
|
||||
|
||||
const {
|
||||
wizard,
|
||||
setWizard,
|
||||
canContinueDesdeMetodo,
|
||||
canContinueDesdeBasicos,
|
||||
canContinueDesdeConfig,
|
||||
simularGeneracionIA,
|
||||
crearAsignatura,
|
||||
} = useNuevaAsignaturaWizard(planId)
|
||||
|
||||
const handleClose = () => {
|
||||
navigate({ to: `/planes/${planId}/asignaturas`, resetScroll: false })
|
||||
}
|
||||
|
||||
return (
|
||||
<Dialog open={true} onOpenChange={(open) => !open && handleClose()}>
|
||||
<DialogContent
|
||||
className="flex h-[90vh] w-[calc(100%-2rem)] flex-col gap-0 overflow-hidden p-0 sm:max-w-4xl"
|
||||
onInteractOutside={(e) => e.preventDefault()}
|
||||
>
|
||||
{role !== 'JEFE_CARRERA' ? (
|
||||
<VistaSinPermisos onClose={handleClose} />
|
||||
) : (
|
||||
<Wizard.Stepper.Provider
|
||||
initialStep={Wizard.utils.getFirst().id}
|
||||
className="flex h-full flex-col"
|
||||
>
|
||||
{({ methods }) => (
|
||||
<>
|
||||
<WizardHeader
|
||||
title="Nueva Asignatura"
|
||||
Wizard={Wizard}
|
||||
methods={{ ...methods, onClose: handleClose }}
|
||||
/>
|
||||
|
||||
<div className="flex-1 overflow-y-auto bg-gray-50/30 p-6">
|
||||
<div className="mx-auto max-w-3xl">
|
||||
{Wizard.utils.getIndex(methods.current.id) === 0 && (
|
||||
<Wizard.Stepper.Panel>
|
||||
<PasoMetodoCardGroup
|
||||
wizard={wizard}
|
||||
onChange={setWizard}
|
||||
/>
|
||||
</Wizard.Stepper.Panel>
|
||||
)}
|
||||
{Wizard.utils.getIndex(methods.current.id) === 1 && (
|
||||
<Wizard.Stepper.Panel>
|
||||
<PasoBasicosForm wizard={wizard} onChange={setWizard} />
|
||||
</Wizard.Stepper.Panel>
|
||||
)}
|
||||
{Wizard.utils.getIndex(methods.current.id) === 2 && (
|
||||
<Wizard.Stepper.Panel>
|
||||
<PasoConfiguracionPanel
|
||||
wizard={wizard}
|
||||
onChange={setWizard}
|
||||
onGenerarIA={simularGeneracionIA}
|
||||
/>
|
||||
</Wizard.Stepper.Panel>
|
||||
)}
|
||||
{Wizard.utils.getIndex(methods.current.id) === 3 && (
|
||||
<Wizard.Stepper.Panel>
|
||||
<PasoResumenCard wizard={wizard} />
|
||||
</Wizard.Stepper.Panel>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<WizardControls
|
||||
Wizard={Wizard}
|
||||
methods={methods}
|
||||
wizard={wizard}
|
||||
canContinueDesdeMetodo={canContinueDesdeMetodo}
|
||||
canContinueDesdeBasicos={canContinueDesdeBasicos}
|
||||
canContinueDesdeConfig={canContinueDesdeConfig}
|
||||
onCreate={() => crearAsignatura(handleClose)}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</Wizard.Stepper.Provider>
|
||||
)}
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
56
src/features/asignaturas/new/catalogs.ts
Normal file
56
src/features/asignaturas/new/catalogs.ts
Normal file
@@ -0,0 +1,56 @@
|
||||
import type { TipoAsignatura } from "./types";
|
||||
|
||||
export const ESTRUCTURAS_SEP = [
|
||||
{ id: "sep-lic-2025", label: "Licenciatura SEP v2025" },
|
||||
{ id: "sep-pos-2023", label: "Posgrado SEP v2023" },
|
||||
{ id: "ulsa-int-2024", label: "Estándar Interno ULSA 2024" },
|
||||
];
|
||||
|
||||
export const TIPOS_MATERIA: Array<{ value: TipoAsignatura; label: string }> = [
|
||||
{ value: "OBLIGATORIA", label: "Obligatoria" },
|
||||
{ value: "OPTATIVA", label: "Optativa" },
|
||||
{ value: "TRONCAL", label: "Troncal / Eje común" },
|
||||
{ value: "OTRO", label: "Otro" },
|
||||
];
|
||||
|
||||
export const FACULTADES = [
|
||||
{ id: "ing", nombre: "Facultad de Ingeniería" },
|
||||
{ id: "med", nombre: "Facultad de Medicina" },
|
||||
{ id: "neg", nombre: "Facultad de Negocios" },
|
||||
];
|
||||
|
||||
export const CARRERAS = [
|
||||
{ id: "sis", nombre: "Ing. en Sistemas", facultadId: "ing" },
|
||||
{ id: "ind", nombre: "Ing. Industrial", facultadId: "ing" },
|
||||
{ id: "medico", nombre: "Médico Cirujano", facultadId: "med" },
|
||||
{ id: "act", nombre: "Actuaría", facultadId: "neg" },
|
||||
];
|
||||
|
||||
export const PLANES_MOCK = [
|
||||
{ id: "p1", nombre: "Plan 2010 Sistemas", carreraId: "sis" },
|
||||
{ id: "p2", nombre: "Plan 2016 Sistemas", carreraId: "sis" },
|
||||
{ id: "p3", nombre: "Plan 2015 Industrial", carreraId: "ind" },
|
||||
];
|
||||
|
||||
export const MATERIAS_MOCK = [
|
||||
{
|
||||
id: "m1",
|
||||
nombre: "Programación Orientada a Objetos",
|
||||
creditos: 8,
|
||||
clave: "POO-101",
|
||||
},
|
||||
{ id: "m2", nombre: "Cálculo Diferencial", creditos: 6, clave: "MAT-101" },
|
||||
{ id: "m3", nombre: "Ética Profesional", creditos: 4, clave: "HUM-302" },
|
||||
{
|
||||
id: "m4",
|
||||
nombre: "Bases de Datos Avanzadas",
|
||||
creditos: 8,
|
||||
clave: "BD-201",
|
||||
},
|
||||
];
|
||||
|
||||
export const ARCHIVOS_SISTEMA_MOCK = [
|
||||
{ id: "doc1", name: "Sílabo_Base_Ingenieria.pdf" },
|
||||
{ id: "doc2", name: "Competencias_Egreso_2025.docx" },
|
||||
{ id: "doc3", name: "Reglamento_Academico.pdf" },
|
||||
];
|
||||
@@ -0,0 +1,90 @@
|
||||
import { useState } from "react";
|
||||
|
||||
import type { AsignaturaPreview, NewSubjectWizardState } from "../types";
|
||||
|
||||
export function useNuevaAsignaturaWizard(planId: string) {
|
||||
const [wizard, setWizard] = useState<NewSubjectWizardState>({
|
||||
step: 1,
|
||||
planId,
|
||||
modoCreacion: null,
|
||||
datosBasicos: {
|
||||
nombre: "",
|
||||
clave: "",
|
||||
tipo: "OBLIGATORIA",
|
||||
creditos: 0,
|
||||
horasSemana: 0,
|
||||
estructuraId: "",
|
||||
},
|
||||
clonInterno: {},
|
||||
clonTradicional: {
|
||||
archivoWordAsignaturaId: null,
|
||||
archivosAdicionalesIds: [],
|
||||
},
|
||||
iaConfig: {
|
||||
descripcionEnfoque: "",
|
||||
notasAdicionales: "",
|
||||
archivosExistentesIds: [],
|
||||
},
|
||||
resumen: {},
|
||||
isLoading: false,
|
||||
errorMessage: null,
|
||||
});
|
||||
|
||||
const canContinueDesdeMetodo = wizard.modoCreacion === "MANUAL" ||
|
||||
wizard.modoCreacion === "IA" ||
|
||||
(wizard.modoCreacion === "CLONADO" && !!wizard.subModoClonado);
|
||||
|
||||
const canContinueDesdeBasicos = !!wizard.datosBasicos.nombre &&
|
||||
wizard.datosBasicos.creditos > 0 &&
|
||||
!!wizard.datosBasicos.estructuraId;
|
||||
|
||||
const canContinueDesdeConfig = (() => {
|
||||
if (wizard.modoCreacion === "MANUAL") return true;
|
||||
if (wizard.modoCreacion === "IA") {
|
||||
return !!wizard.iaConfig?.descripcionEnfoque;
|
||||
}
|
||||
if (wizard.modoCreacion === "CLONADO") {
|
||||
if (wizard.subModoClonado === "INTERNO") {
|
||||
return !!wizard.clonInterno?.asignaturaOrigenId;
|
||||
}
|
||||
if (wizard.subModoClonado === "TRADICIONAL") {
|
||||
return !!wizard.clonTradicional?.archivoWordAsignaturaId;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
})();
|
||||
|
||||
const simularGeneracionIA = async () => {
|
||||
setWizard((w) => ({ ...w, isLoading: true }));
|
||||
await new Promise((r) => setTimeout(r, 1500));
|
||||
setWizard((w) => ({
|
||||
...w,
|
||||
isLoading: false,
|
||||
resumen: {
|
||||
previewAsignatura: {
|
||||
nombre: w.datosBasicos.nombre,
|
||||
objetivo:
|
||||
"Aplicar los fundamentos teóricos para la resolución de problemas...",
|
||||
unidades: 5,
|
||||
bibliografiaCount: 3,
|
||||
} as AsignaturaPreview,
|
||||
},
|
||||
}));
|
||||
};
|
||||
|
||||
const crearAsignatura = async (onCreated: () => void) => {
|
||||
setWizard((w) => ({ ...w, isLoading: true }));
|
||||
await new Promise((r) => setTimeout(r, 1000));
|
||||
onCreated();
|
||||
};
|
||||
|
||||
return {
|
||||
wizard,
|
||||
setWizard,
|
||||
canContinueDesdeMetodo,
|
||||
canContinueDesdeBasicos,
|
||||
canContinueDesdeConfig,
|
||||
simularGeneracionIA,
|
||||
crearAsignatura,
|
||||
};
|
||||
}
|
||||
45
src/features/asignaturas/new/types.ts
Normal file
45
src/features/asignaturas/new/types.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
export type ModoCreacion = "MANUAL" | "IA" | "CLONADO";
|
||||
export type SubModoClonado = "INTERNO" | "TRADICIONAL";
|
||||
export type TipoAsignatura = "OBLIGATORIA" | "OPTATIVA" | "TRONCAL" | "OTRO";
|
||||
|
||||
export type AsignaturaPreview = {
|
||||
nombre: string;
|
||||
objetivo: string;
|
||||
unidades: number;
|
||||
bibliografiaCount: number;
|
||||
};
|
||||
|
||||
export type NewSubjectWizardState = {
|
||||
step: 1 | 2 | 3 | 4;
|
||||
planId: string;
|
||||
modoCreacion: ModoCreacion | null;
|
||||
subModoClonado?: SubModoClonado;
|
||||
datosBasicos: {
|
||||
nombre: string;
|
||||
clave?: string;
|
||||
tipo: TipoAsignatura;
|
||||
creditos: number;
|
||||
horasSemana?: number;
|
||||
estructuraId: string;
|
||||
};
|
||||
clonInterno?: {
|
||||
facultadId?: string;
|
||||
carreraId?: string;
|
||||
planOrigenId?: string;
|
||||
asignaturaOrigenId?: string | null;
|
||||
};
|
||||
clonTradicional?: {
|
||||
archivoWordAsignaturaId: string | null;
|
||||
archivosAdicionalesIds: Array<string>;
|
||||
};
|
||||
iaConfig?: {
|
||||
descripcionEnfoque: string;
|
||||
notasAdicionales: string;
|
||||
archivosExistentesIds: Array<string>;
|
||||
};
|
||||
resumen: {
|
||||
previewAsignatura?: AsignaturaPreview;
|
||||
};
|
||||
isLoading: boolean;
|
||||
errorMessage: string | null;
|
||||
};
|
||||
Reference in New Issue
Block a user