From 449a83d43d431169f1207f483a14d232157b028a Mon Sep 17 00:00:00 2001 From: Robert Date: Fri, 26 Dec 2025 18:22:11 -0600 Subject: [PATCH] Se agrega avance sobre detalle de plan de estudios --- src/routeTree.gen.ts | 122 ++++++++++++++++++----- src/routes/planes2/$planId/index.tsx | 36 +++++++ src/routes/planes2/$planId/mapa.tsx | 86 ++++++++++++++++ src/routes/planes2/$planId/route.tsx | 58 +++++++++++ src/routes/{planes => planes2}/index.tsx | 2 +- 5 files changed, 276 insertions(+), 28 deletions(-) create mode 100644 src/routes/planes2/$planId/index.tsx create mode 100644 src/routes/planes2/$planId/mapa.tsx create mode 100644 src/routes/planes2/$planId/route.tsx rename src/routes/{planes => planes2}/index.tsx (84%) diff --git a/src/routeTree.gen.ts b/src/routeTree.gen.ts index c315158..3b4ce1d 100644 --- a/src/routeTree.gen.ts +++ b/src/routeTree.gen.ts @@ -13,8 +13,11 @@ import { Route as PlanesRouteImport } from './routes/planes' import { Route as LoginRouteImport } from './routes/login' import { Route as DashboardRouteImport } from './routes/dashboard' import { Route as IndexRouteImport } from './routes/index' -import { Route as PlanesIndexRouteImport } from './routes/planes/index' +import { Route as Planes2IndexRouteImport } from './routes/planes2/index' import { Route as DemoTanstackQueryRouteImport } from './routes/demo/tanstack-query' +import { Route as Planes2PlanIdRouteRouteImport } from './routes/planes2/$planId/route' +import { Route as Planes2PlanIdIndexRouteImport } from './routes/planes2/$planId/index' +import { Route as Planes2PlanIdMapaRouteImport } from './routes/planes2/$planId/mapa' const PlanesRoute = PlanesRouteImport.update({ id: '/planes', @@ -36,40 +39,64 @@ const IndexRoute = IndexRouteImport.update({ path: '/', getParentRoute: () => rootRouteImport, } as any) -const PlanesIndexRoute = PlanesIndexRouteImport.update({ - id: '/', - path: '/', - getParentRoute: () => PlanesRoute, +const Planes2IndexRoute = Planes2IndexRouteImport.update({ + id: '/planes2/', + path: '/planes2/', + getParentRoute: () => rootRouteImport, } as any) const DemoTanstackQueryRoute = DemoTanstackQueryRouteImport.update({ id: '/demo/tanstack-query', path: '/demo/tanstack-query', getParentRoute: () => rootRouteImport, } as any) +const Planes2PlanIdRouteRoute = Planes2PlanIdRouteRouteImport.update({ + id: '/planes2/$planId', + path: '/planes2/$planId', + getParentRoute: () => rootRouteImport, +} as any) +const Planes2PlanIdIndexRoute = Planes2PlanIdIndexRouteImport.update({ + id: '/', + path: '/', + getParentRoute: () => Planes2PlanIdRouteRoute, +} as any) +const Planes2PlanIdMapaRoute = Planes2PlanIdMapaRouteImport.update({ + id: '/mapa', + path: '/mapa', + getParentRoute: () => Planes2PlanIdRouteRoute, +} as any) export interface FileRoutesByFullPath { '/': typeof IndexRoute '/dashboard': typeof DashboardRoute '/login': typeof LoginRoute - '/planes': typeof PlanesRouteWithChildren + '/planes': typeof PlanesRoute + '/planes2/$planId': typeof Planes2PlanIdRouteRouteWithChildren '/demo/tanstack-query': typeof DemoTanstackQueryRoute - '/planes/': typeof PlanesIndexRoute + '/planes2': typeof Planes2IndexRoute + '/planes2/$planId/mapa': typeof Planes2PlanIdMapaRoute + '/planes2/$planId/': typeof Planes2PlanIdIndexRoute } export interface FileRoutesByTo { '/': typeof IndexRoute '/dashboard': typeof DashboardRoute '/login': typeof LoginRoute + '/planes': typeof PlanesRoute '/demo/tanstack-query': typeof DemoTanstackQueryRoute - '/planes': typeof PlanesIndexRoute + '/planes2': typeof Planes2IndexRoute + '/planes2/$planId/mapa': typeof Planes2PlanIdMapaRoute + '/planes2/$planId': typeof Planes2PlanIdIndexRoute } export interface FileRoutesById { __root__: typeof rootRouteImport '/': typeof IndexRoute '/dashboard': typeof DashboardRoute '/login': typeof LoginRoute - '/planes': typeof PlanesRouteWithChildren + '/planes': typeof PlanesRoute + '/planes2/$planId': typeof Planes2PlanIdRouteRouteWithChildren '/demo/tanstack-query': typeof DemoTanstackQueryRoute - '/planes/': typeof PlanesIndexRoute + '/planes2/': typeof Planes2IndexRoute + '/planes2/$planId/mapa': typeof Planes2PlanIdMapaRoute + '/planes2/$planId/': typeof Planes2PlanIdIndexRoute } export interface FileRouteTypes { fileRoutesByFullPath: FileRoutesByFullPath @@ -78,26 +105,42 @@ export interface FileRouteTypes { | '/dashboard' | '/login' | '/planes' + | '/planes2/$planId' | '/demo/tanstack-query' - | '/planes/' + | '/planes2' + | '/planes2/$planId/mapa' + | '/planes2/$planId/' fileRoutesByTo: FileRoutesByTo - to: '/' | '/dashboard' | '/login' | '/demo/tanstack-query' | '/planes' + to: + | '/' + | '/dashboard' + | '/login' + | '/planes' + | '/demo/tanstack-query' + | '/planes2' + | '/planes2/$planId/mapa' + | '/planes2/$planId' id: | '__root__' | '/' | '/dashboard' | '/login' | '/planes' + | '/planes2/$planId' | '/demo/tanstack-query' - | '/planes/' + | '/planes2/' + | '/planes2/$planId/mapa' + | '/planes2/$planId/' fileRoutesById: FileRoutesById } export interface RootRouteChildren { IndexRoute: typeof IndexRoute DashboardRoute: typeof DashboardRoute LoginRoute: typeof LoginRoute - PlanesRoute: typeof PlanesRouteWithChildren + PlanesRoute: typeof PlanesRoute + Planes2PlanIdRouteRoute: typeof Planes2PlanIdRouteRouteWithChildren DemoTanstackQueryRoute: typeof DemoTanstackQueryRoute + Planes2IndexRoute: typeof Planes2IndexRoute } declare module '@tanstack/react-router' { @@ -130,12 +173,12 @@ declare module '@tanstack/react-router' { preLoaderRoute: typeof IndexRouteImport parentRoute: typeof rootRouteImport } - '/planes/': { - id: '/planes/' - path: '/' - fullPath: '/planes/' - preLoaderRoute: typeof PlanesIndexRouteImport - parentRoute: typeof PlanesRoute + '/planes2/': { + id: '/planes2/' + path: '/planes2' + fullPath: '/planes2' + preLoaderRoute: typeof Planes2IndexRouteImport + parentRoute: typeof rootRouteImport } '/demo/tanstack-query': { id: '/demo/tanstack-query' @@ -144,26 +187,51 @@ declare module '@tanstack/react-router' { preLoaderRoute: typeof DemoTanstackQueryRouteImport parentRoute: typeof rootRouteImport } + '/planes2/$planId': { + id: '/planes2/$planId' + path: '/planes2/$planId' + fullPath: '/planes2/$planId' + preLoaderRoute: typeof Planes2PlanIdRouteRouteImport + parentRoute: typeof rootRouteImport + } + '/planes2/$planId/': { + id: '/planes2/$planId/' + path: '/' + fullPath: '/planes2/$planId/' + preLoaderRoute: typeof Planes2PlanIdIndexRouteImport + parentRoute: typeof Planes2PlanIdRouteRoute + } + '/planes2/$planId/mapa': { + id: '/planes2/$planId/mapa' + path: '/mapa' + fullPath: '/planes2/$planId/mapa' + preLoaderRoute: typeof Planes2PlanIdMapaRouteImport + parentRoute: typeof Planes2PlanIdRouteRoute + } } } -interface PlanesRouteChildren { - PlanesIndexRoute: typeof PlanesIndexRoute +interface Planes2PlanIdRouteRouteChildren { + Planes2PlanIdMapaRoute: typeof Planes2PlanIdMapaRoute + Planes2PlanIdIndexRoute: typeof Planes2PlanIdIndexRoute } -const PlanesRouteChildren: PlanesRouteChildren = { - PlanesIndexRoute: PlanesIndexRoute, +const Planes2PlanIdRouteRouteChildren: Planes2PlanIdRouteRouteChildren = { + Planes2PlanIdMapaRoute: Planes2PlanIdMapaRoute, + Planes2PlanIdIndexRoute: Planes2PlanIdIndexRoute, } -const PlanesRouteWithChildren = - PlanesRoute._addFileChildren(PlanesRouteChildren) +const Planes2PlanIdRouteRouteWithChildren = + Planes2PlanIdRouteRoute._addFileChildren(Planes2PlanIdRouteRouteChildren) const rootRouteChildren: RootRouteChildren = { IndexRoute: IndexRoute, DashboardRoute: DashboardRoute, LoginRoute: LoginRoute, - PlanesRoute: PlanesRouteWithChildren, + PlanesRoute: PlanesRoute, + Planes2PlanIdRouteRoute: Planes2PlanIdRouteRouteWithChildren, DemoTanstackQueryRoute: DemoTanstackQueryRoute, + Planes2IndexRoute: Planes2IndexRoute, } export const routeTree = rootRouteImport ._addFileChildren(rootRouteChildren) diff --git a/src/routes/planes2/$planId/index.tsx b/src/routes/planes2/$planId/index.tsx new file mode 100644 index 0000000..be190f6 --- /dev/null +++ b/src/routes/planes2/$planId/index.tsx @@ -0,0 +1,36 @@ +import { createFileRoute } from '@tanstack/react-router' + +export const Route = createFileRoute('/planes2/$planId/')({ + component: DatosGenerales, +}) + +function DatosGenerales() { + return ( +
+ + Formar profesionales altamente capacitados... + + + + Egresados de educación media superior... + + + + Profesional capaz de diseñar... + + + + Pensamiento crítico, comunicación efectiva... + +
+ ) +} + +function Card({ title, children }) { + return ( +
+

{title}

+

{children}

+
+ ) +} diff --git a/src/routes/planes2/$planId/mapa.tsx b/src/routes/planes2/$planId/mapa.tsx new file mode 100644 index 0000000..81aac05 --- /dev/null +++ b/src/routes/planes2/$planId/mapa.tsx @@ -0,0 +1,86 @@ +import { createFileRoute } from '@tanstack/react-router' + +export const Route = createFileRoute('/planes2/$planId/mapa')({ + component: MapaCurricular, +}) + +const CICLOS = ["Ciclo 1", "Ciclo 2", "Ciclo 3", "Ciclo 4", "Ciclo 5", "Ciclo 6", "Ciclo 7", "Ciclo 8", "Ciclo 9"]; +const LINEAS = ["Formación Básica", "Ciencias de la Computación", "Desarrollo de Software", "Redes y Seguridad", "Gestión y Profesionalización"]; + +// Ejemplo de materia +const MATERIAS = [ + { nombre: "Cálculo Diferencial", linea: "Formación Básica", ciclo: 1, creditos: 8 }, + { nombre: "Fundamentos de Programación", linea: "Ciencias de la Computación", ciclo: 1, creditos: 8 }, + { nombre: "Fundamentos de Programación 2", linea: "Ciencias de la Computación", ciclo: 1, creditos: 8 }, + // ... más materias +]; + +function MapaCurricular() { + return ( +
+

Mapa Curricular

+ + {/* Contenedor de la Grid */} +
+ {/* Header: Espacio vacío + Ciclos */} +
+ Línea Curricular +
+ {CICLOS.map((ciclo) => ( +
+ {ciclo} +
+ ))} + + {/* Filas por cada Línea Curricular */} + {LINEAS.map((linea) => ( + <> + {/* Nombre de la línea (Primera columna) */} +
+ {linea} +
+ + {/* Celdas para cada ciclo en esta línea */} + {[1, 2, 3, 4, 5, 6, 7, 8, 9].map((numCiclo) => ( +
+ {/* Filtrar materias que pertenecen a esta posición */} + {MATERIAS.filter(m => m.linea === linea && m.ciclo === numCiclo).map((materia, i) => ( +
+
{materia.nombre}
+
+ {materia.creditos} CR + ID: {i + 100} +
+
+ ))} +
+ ))} + + ))} +
+ + {/* Sección de materias sin asignar (como en tu imagen) */} +
+

Materias sin asignar

+
+
+
Inglés Técnico
+
4 cr • HD: 2 • HI: 2
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/routes/planes2/$planId/route.tsx b/src/routes/planes2/$planId/route.tsx new file mode 100644 index 0000000..4ba6669 --- /dev/null +++ b/src/routes/planes2/$planId/route.tsx @@ -0,0 +1,58 @@ +import { createFileRoute, Outlet, Link } from '@tanstack/react-router' + +export const Route = createFileRoute('/planes2/$planId')({ + component: PlanLayout, +}) + +function PlanLayout() { + const { planId } = Route.useParams() + + return ( +
+ {/* Header del plan */} +
+ + ← Volver a planes + + +

Plan de Estudios 2024

+

+ Ingeniería en Sistemas Computacionales +

+
+ + {/* Tabs */} + + + {/* Aquí se renderiza cada tab */} + +
+ ) +} + +function Tab({ to, params, children }) { + return ( + + {children} + + ) +} diff --git a/src/routes/planes/index.tsx b/src/routes/planes2/index.tsx similarity index 84% rename from src/routes/planes/index.tsx rename to src/routes/planes2/index.tsx index 096e925..7ccc508 100644 --- a/src/routes/planes/index.tsx +++ b/src/routes/planes2/index.tsx @@ -2,7 +2,7 @@ import { createFileRoute } from '@tanstack/react-router' import { AppLayout } from '@/components/layout/AppLayout' import { PlanGrid } from '@/components/plans/PlanGrid' -export const Route = createFileRoute('/planes/')({ +export const Route = createFileRoute('/planes2/')({ component: PlanesPage, })