From 9a3c40e30e993c84e1682ca5360096432d8c45f9 Mon Sep 17 00:00:00 2001 From: Alexis Date: Tue, 24 Mar 2026 13:19:37 +0100 Subject: [PATCH] =?UTF-8?q?add:=20a=C3=B1adir=20enrutado=20para=20separar?= =?UTF-8?q?=20la=20secci=C3=B3n=20"basico"=20y=20"avanzado"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/package-lock.json | 58 ++++++++++++++++ frontend/package.json | 1 + frontend/src/App.jsx | 6 +- .../src/components/ValueFunctionChart.jsx | 66 +++++++++---------- frontend/src/components/layout/MainLayout.jsx | 49 ++++++++++++++ frontend/src/pages/AdvancedMode.jsx | 7 ++ frontend/src/routers/AppRouter.jsx | 21 ++++++ 7 files changed, 171 insertions(+), 37 deletions(-) create mode 100644 frontend/src/components/layout/MainLayout.jsx create mode 100644 frontend/src/routers/AppRouter.jsx diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 0f2633d..c0cf46f 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -12,6 +12,7 @@ "axios": "^1.13.6", "react": "^19.2.4", "react-dom": "^19.2.4", + "react-router-dom": "^7.13.2", "recharts": "^3.8.0", "tailwindcss": "^4.2.2" }, @@ -1529,6 +1530,19 @@ "dev": true, "license": "MIT" }, + "node_modules/cookie": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz", + "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==", + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/express" + } + }, "node_modules/cross-spawn": { "version": "7.0.6", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", @@ -3093,6 +3107,44 @@ } } }, + "node_modules/react-router": { + "version": "7.13.2", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.13.2.tgz", + "integrity": "sha512-tX1Aee+ArlKQP+NIUd7SE6Li+CiGKwQtbS+FfRxPX6Pe4vHOo6nr9d++u5cwg+Z8K/x8tP+7qLmujDtfrAoUJA==", + "license": "MIT", + "dependencies": { + "cookie": "^1.0.1", + "set-cookie-parser": "^2.6.0" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + } + }, + "node_modules/react-router-dom": { + "version": "7.13.2", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.13.2.tgz", + "integrity": "sha512-aR7SUORwTqAW0JDeiWF07e9SBE9qGpByR9I8kJT5h/FrBKxPMS6TiC7rmVO+gC0q52Bx7JnjWe8Z1sR9faN4YA==", + "license": "MIT", + "dependencies": { + "react-router": "7.13.2" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + } + }, "node_modules/recharts": { "version": "3.8.0", "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.8.0.tgz", @@ -3209,6 +3261,12 @@ "semver": "bin/semver.js" } }, + "node_modules/set-cookie-parser": { + "version": "2.7.2", + "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz", + "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==", + "license": "MIT" + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 278c666..debc10c 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -14,6 +14,7 @@ "axios": "^1.13.6", "react": "^19.2.4", "react-dom": "^19.2.4", + "react-router-dom": "^7.13.2", "recharts": "^3.8.0", "tailwindcss": "^4.2.2" }, diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index 0545d76..df64ca3 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -1,10 +1,8 @@ -import BasicMode from './pages/BasicMode'; +import { AppRouter } from './routers/AppRouter'; function App() { return ( -
- -
+ ); } diff --git a/frontend/src/components/ValueFunctionChart.jsx b/frontend/src/components/ValueFunctionChart.jsx index e496d46..dad2e8e 100644 --- a/frontend/src/components/ValueFunctionChart.jsx +++ b/frontend/src/components/ValueFunctionChart.jsx @@ -1,43 +1,43 @@ import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer } from 'recharts'; export default function ValueFunctionChart({ result }) { - if (!result) return null; + if (!result) return null; return (
-

- Función de Valor: {result.criterion_name} -

+

+ Función de Valor: {result.criterion_name} +

-
- - ({ - nombre: label, - valor: value - }))} - margin={{ top: 20, right: 30, left: 20, bottom: 20 }} - > - - - - [value.toFixed(4), 'Valor DoC']} - labelStyle={{ fontWeight: 'bold', color: '#1e293b', marginBottom: '4px' }} - /> - - - -
+
+ + ({ + nombre: label, + valor: value + }))} + margin={{ top: 20, right: 30, left: 20, bottom: 20 }} + > + + + + [value.toFixed(4), 'Valor DoC']} + labelStyle={{ fontWeight: 'bold', color: '#1e293b', marginBottom: '4px' }} + /> + + + +
); } \ No newline at end of file diff --git a/frontend/src/components/layout/MainLayout.jsx b/frontend/src/components/layout/MainLayout.jsx new file mode 100644 index 0000000..bd75055 --- /dev/null +++ b/frontend/src/components/layout/MainLayout.jsx @@ -0,0 +1,49 @@ +import { Outlet, NavLink } from 'react-router-dom'; + +export const MainLayout = () => { + return ( +
+ +
+

+ Método Deck of Cards +

+
+ +
+
+ + `px-8 py-3 rounded-xl font-bold transition-all duration-300 ${ + isActive + ? 'bg-white text-blue-600 shadow-md transform scale-105' + : 'text-slate-500 hover:text-slate-700 hover:bg-slate-300/50' + }` + } + > + DoC Clásico + + + + `px-8 py-3 rounded-xl font-bold transition-all duration-300 ${ + isActive + ? 'bg-white text-blue-600 shadow-md transform scale-105' + : 'text-slate-500 hover:text-slate-700 hover:bg-slate-300/50' + }` + } + > + DoC-MF Avanzado + +
+
+ +
+ +
+ +
+ ); +}; \ No newline at end of file diff --git a/frontend/src/pages/AdvancedMode.jsx b/frontend/src/pages/AdvancedMode.jsx index e69de29..3a96f2d 100644 --- a/frontend/src/pages/AdvancedMode.jsx +++ b/frontend/src/pages/AdvancedMode.jsx @@ -0,0 +1,7 @@ +export default function AdvancedMode() { + return ( +

+ En construcción +

+ ); +} \ No newline at end of file diff --git a/frontend/src/routers/AppRouter.jsx b/frontend/src/routers/AppRouter.jsx new file mode 100644 index 0000000..b59dc41 --- /dev/null +++ b/frontend/src/routers/AppRouter.jsx @@ -0,0 +1,21 @@ +import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom'; +import BasicMode from '../pages/BasicMode'; +import AdvancedMode from '../pages/AdvancedMode'; +import { MainLayout } from '../components/layout/MainLayout'; + +export const AppRouter = () => { + return ( + + + + }> + } /> + } /> + + + } /> + + + + ); +}; \ No newline at end of file