Se fucionan rutas

2026-01-06 14:44:39 -06:00
parent fa53ddfb0b
commit a87bcdc1b9
15 changed files with 523 additions and 347 deletions
--- a/src/routes/planes/$planId/_detalle/MateriaCard.tsx
+++ b/src/routes/planes/$planId/_detalle/MateriaCard.tsx
--- a/src/routes/planes/$planId/_detalle/datos.tsx
+++ b/src/routes/planes/$planId/_detalle/datos.tsx
@@ -1,6 +1,6 @@
 import { createFileRoute } from '@tanstack/react-router'

-export const Route = createFileRoute('/planes2/$planId/')({
+export const Route = createFileRoute('/planes/$planId/_detalle/datos')({
  component: DatosGenerales,
 })

--- a/src/routes/planes/$planId/_detalle/documento.tsx
+++ b/src/routes/planes/$planId/_detalle/documento.tsx
@@ -11,7 +11,7 @@ import {
 import { Button } from "@/components/ui/button"
 import { Card, CardContent } from "@/components/ui/card"

-export const Route = createFileRoute('/planes2/$planId/documento')({
+export const Route = createFileRoute('/planes/$planId/_detalle/documento')({
  component: RouteComponent,
 })

--- a/src/routes/planes/$planId/_detalle/flujo.tsx
+++ b/src/routes/planes/$planId/_detalle/flujo.tsx
@@ -5,7 +5,7 @@ import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import { Textarea } from "@/components/ui/textarea"

-export const Route = createFileRoute('/planes2/$planId/flujo')({
+export const Route = createFileRoute('/planes/$planId/_detalle/flujo')({
  component: RouteComponent,
 })

--- a/src/routes/planes/$planId/_detalle/historial.tsx
+++ b/src/routes/planes/$planId/_detalle/historial.tsx
@@ -11,7 +11,7 @@ import { Badge } from "@/components/ui/badge"
 import { Card, CardContent } from "@/components/ui/card"
 import { Avatar, AvatarFallback } from "@/components/ui/avatar"

-export const Route = createFileRoute('/planes2/$planId/historial')({
+export const Route = createFileRoute('/planes/$planId/_detalle/historial')({
  component: RouteComponent,
 })

--- a/src/routes/planes/$planId/_detalle/iaplan.tsx
+++ b/src/routes/planes/$planId/_detalle/iaplan.tsx
@@ -7,7 +7,7 @@ import { ScrollArea } from "@/components/ui/scroll-area"
 import { Avatar, AvatarFallback } from "@/components/ui/avatar"


-export const Route = createFileRoute('/planes2/$planId/iaplan')({
+export const Route = createFileRoute('/planes/$planId/_detalle/iaplan')({
  component: RouteComponent,
 })

--- a/src/routes/planes/$planId/_detalle/mapa.tsx
+++ b/src/routes/planes/$planId/_detalle/mapa.tsx
@@ -2,7 +2,7 @@ import { createFileRoute } from '@tanstack/react-router'
 import { MateriaCard } from './MateriaCard';
 import type { Materia } from './MateriaCard'; // Agregamos 'type' aquí

-export const Route = createFileRoute('/planes2/$planId/mapa')({
+export const Route = createFileRoute('/planes/$planId/_detalle/mapa')({
  component: MapaCurricular,
 })

--- a/src/routes/planes/$planId/_detalle/materias.tsx
+++ b/src/routes/planes/$planId/_detalle/materias.tsx
@@ -13,7 +13,7 @@ import {
  TableRow,
 } from '@/components/ui/table'

-export const Route = createFileRoute('/planes2/$planId/materias')({
+export const Route = createFileRoute('/planes/$planId/_detalle/materias')({
  component: Materias,
 })

--- a/src/routes/planes/$planId/_detalle/route.tsx
+++ b/src/routes/planes/$planId/_detalle/route.tsx
@@ -2,11 +2,11 @@ import { createFileRoute, Outlet, Link } from '@tanstack/react-router'
 import { ChevronLeft, GraduationCap, Clock, Hash, CalendarDays, Rocket, BookOpen, CheckCircle2 } from "lucide-react"
 import { Badge } from "@/components/ui/badge"

-export const Route = createFileRoute('/planes2/$planId')({
-  component: PlanLayout,
+export const Route = createFileRoute('/planes/$planId/_detalle')({
+  component: RouteComponent,
 })

-function PlanLayout() {
+function RouteComponent() {
  const { planId } = Route.useParams()

  return (
@@ -15,7 +15,7 @@ function PlanLayout() {
      <div className="border-b bg-white/50 backdrop-blur-sm sticky top-0 z-20 shadow-sm">
        <div className="px-6 py-2">
          <Link 
-            to="/planes2" 
+            to="/planes" 
            className="flex items-center gap-1 text-xs text-gray-500 hover:text-gray-800 transition-colors w-fit"
          >
            <ChevronLeft size={14} /> Volver a planes
@@ -60,13 +60,13 @@ function PlanLayout() {
        {/* 4. Navegación de Tabs */}
        <div className="border-b overflow-x-auto scrollbar-hide">
          <nav className="flex gap-8 min-w-max">
-            <Tab to="/planes2/$planId" params={{ planId }}>Datos Generales</Tab>
-            <Tab to="/planes2/$planId/mapa" params={{ planId }}>Mapa Curricular</Tab>
-            <Tab to="/planes2/$planId/materias" params={{ planId }}>Materias</Tab>
-            <Tab to="/planes2/$planId/flujo" params={{ planId }}>Flujo y Estados</Tab>
-            <Tab to="/planes2/$planId/iaplan" params={{ planId }}>IA del Plan</Tab>
-            <Tab to="/planes2/$planId/documento" params={{ planId }}>Documento</Tab>
-            <Tab to="/planes2/$planId/historial" params={{ planId }}>Historial</Tab>
+            <Tab to="/planes/$planId/datos" params={{ planId }}>Datos Generales</Tab>
+            <Tab to="/planes/$planId/mapa" params={{ planId }}>Mapa Curricular</Tab>
+            <Tab to="/planes/$planId/materias" params={{ planId }}>Materias</Tab>
+            <Tab to="/planes/$planId/flujo" params={{ planId }}>Flujo y Estados</Tab>
+            <Tab to="/planes/$planId/iaplan" params={{ planId }}>IA del Plan</Tab>
+            <Tab to="/planes/$planId/documento" params={{ planId }}>Documento</Tab>
+            <Tab to="/planes/$planId/historial" params={{ planId }}>Historial</Tab>
          </nav>
        </div>

@@ -79,6 +79,7 @@ function PlanLayout() {
  )
 }

+
 // Sub-componente para las tarjetas de información
 function InfoCard({ icon, label, value }: { icon: React.ReactNode, label: string, value: string }) {
  return (
--- a/src/routes/planes/$planId/asignaturas/$asignaturaId/route.tsx
+++ b/src/routes/planes/$planId/asignaturas/$asignaturaId/route.tsx
@@ -1,9 +1,18 @@
 import { createFileRoute } from '@tanstack/react-router'

-export const Route = createFileRoute('/planes/$planId/asignaturas/$asignaturaId')({
+export const Route = createFileRoute(
+  '/planes/$planId/asignaturas/$asignaturaId'
+)({
  component: RouteComponent,
 })

 function RouteComponent() {
-  return <div>Hello "/asignaturas/$asignaturaId"!</div>
+  const { planId, asignaturaId } = Route.useParams()
+
+  return (
+    <div>
+      Plan: {planId} <br />
+      Asignatura: {asignaturaId}
+    </div>
+  )
 }
--- a/src/routes/planes/$planId/asignaturas/index.tsx
+++ b/src/routes/planes/$planId/asignaturas/index.tsx
@@ -0,0 +1,146 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent } from '@/components/ui/card'
+import {
+  BookOpen,
+  Sparkles,
+  FileText,
+  Library,
+  LayoutTemplate,
+  History,
+  ArrowRight,
+  GraduationCap,
+} from 'lucide-react'
+
+export const Route = createFileRoute(
+  '/planes/$planId/asignaturas/'
+)({
+  component: MateriasLandingPage,
+})
+
+export default function MateriasLandingPage() {
+  return (
+    <div className="w-full">
+      {/* ================= HERO ================= */}
+      <section className="bg-gradient-to-b from-[#0b1d3a] to-[#0e2a5c] text-white">
+        <div className="max-w-7xl mx-auto px-6 py-28">
+          <div className="flex items-center gap-2 mb-6 text-sm text-blue-200">
+            <GraduationCap className="w-5 h-5 text-yellow-400" />
+            <span>SISTEMA DE GESTIÓN CURRICULAR</span>
+          </div>
+
+          <h1 className="text-5xl font-bold mb-6">
+            Universidad La Salle
+          </h1>
+
+          <p className="max-w-xl text-lg text-blue-100 mb-10">
+            Diseña, documenta y mejora programas de estudio con herramientas
+            de inteligencia artificial integradas y cumplimiento normativo SEP.
+          </p>
+
+          <Button
+            size="lg"
+            className="bg-yellow-400 text-black hover:bg-yellow-300 font-semibold"
+          >
+            Ver materia de ejemplo
+            <ArrowRight className="ml-2 h-4 w-4" />
+          </Button>
+        </div>
+      </section>
+
+      {/* ================= FEATURES ================= */}
+      <section className="bg-white py-24">
+        <div className="max-w-7xl mx-auto px-6">
+          <h2 className="text-center text-2xl font-semibold mb-14">
+            Características principales
+          </h2>
+
+          <div className="grid gap-8 md:grid-cols-3">
+            <FeatureCard
+              icon={<BookOpen />}
+              title="Gestión de Materias"
+              description="Edita datos generales, contenido temático y bibliografía con una interfaz intuitiva."
+            />
+
+            <FeatureCard
+              icon={<Sparkles />}
+              title="IA Integrada"
+              description="Usa inteligencia artificial para mejorar objetivos, competencias y alinear con perfiles de egreso."
+            />
+
+            <FeatureCard
+              icon={<FileText />}
+              title="Documentos SEP"
+              description="Genera automáticamente documentos oficiales para la Secretaría de Educación Pública."
+            />
+
+            <FeatureCard
+              icon={<Library />}
+              title="Biblioteca Digital"
+              description="Busca y vincula recursos del repositorio de Biblioteca La Salle directamente."
+            />
+
+            <FeatureCard
+              icon={<LayoutTemplate />}
+              title="Plantillas Flexibles"
+              description="Adapta la estructura de materias según plantillas SEP o institucionales."
+            />
+
+            <FeatureCard
+              icon={<History />}
+              title="Historial Completo"
+              description="Rastrea todos los cambios con historial detallado por usuario y fecha."
+            />
+          </div>
+        </div>
+      </section>
+
+      {/* ================= CTA ================= */}
+      <section className="bg-gray-50 py-20">
+        <div className="max-w-3xl mx-auto text-center px-6">
+          <h3 className="text-xl font-semibold mb-4">
+            Explora la vista de detalle de materia
+          </h3>
+
+          <p className="text-muted-foreground mb-8">
+            Navega por las diferentes pestañas para ver cómo funciona el sistema
+            de gestión curricular.
+          </p>
+
+          <Button size="lg" className="bg-[#0e2a5c] hover:bg-[#0b1d3a]">
+            Ir a Inteligencia Artificial Aplicada
+            <ArrowRight className="ml-2 h-4 w-4" />
+          </Button>
+        </div>
+      </section>
+    </div>
+  )
+}
+
+/* ================= FEATURE CARD ================= */
+
+function FeatureCard({
+  icon,
+  title,
+  description,
+}: {
+  icon: React.ReactNode
+  title: string
+  description: string
+}) {
+  return (
+    <Card className="border border-gray-200 shadow-sm">
+      <CardContent className="p-6 space-y-4">
+        <div className="w-10 h-10 rounded-md bg-yellow-100 text-yellow-600 flex items-center justify-center">
+          {icon}
+        </div>
+
+        <h4 className="font-semibold">{title}</h4>
+
+        <p className="text-sm text-muted-foreground">
+          {description}
+        </p>
+      </CardContent>
+    </Card>
+  )
+}
--- a/src/routes/planes/$planId/asignaturas/route.tsx
+++ b/src/routes/planes/$planId/asignaturas/route.tsx
@@ -0,0 +1,9 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/planes/$planId/asignaturas')({
+  component: AsignaturasLayout,
+})
+
+function AsignaturasLayout() {
+  return <Outlet />
+}
--- a/src/routes/planes/$planId/index.tsx
+++ b/src/routes/planes/$planId/index.tsx
@@ -1,10 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/planes/$planId/')({
-  component: RouteComponent,
-})
-
-function RouteComponent() {
-  const { planId } = Route.useParams()
-  return <div>Hello "/planes/{planId}"!</div>
-}