Intento de Creador

2025-12-28 18:41:58 -03:00
parent d598e61985
commit 690c4d6ad7
10 changed files with 700 additions and 348 deletions
--- a/frontend/src/pages/Login.jsx
+++ b/frontend/src/pages/Login.jsx
@@ -0,0 +1,70 @@
+import { useState } from 'react';
+import axios from 'axios';
+import { useNavigate } from 'react-router-dom';
+
+const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:3000';
+
+function Login({ setToken, setUserRole }) {
+    const [username, setUsername] = useState('');
+    const [password, setPassword] = useState('');
+    const navigate = useNavigate();
+
+    const handleLogin = async (e) => {
+        e.preventDefault();
+        try {
+            const res = await axios.post(`${API_URL}/api/auth/login`, { username, password });
+            const { token, role, username: user } = res.data;
+
+            localStorage.setItem('token', token);
+            localStorage.setItem('role', role);
+            localStorage.setItem('username', user);
+
+            setToken(token);
+            setUserRole(role);
+
+            if (role === 'ADMIN') {
+                navigate('/admin');
+            } else {
+                navigate('/user');
+            }
+        } catch (err) {
+            alert('Login failed: ' + (err.response?.data?.error || err.message));
+        }
+    };
+
+    return (
+        <div className="min-h-screen bg-slate-900 flex items-center justify-center p-4">
+            <div className="bg-slate-800 p-8 rounded-2xl w-full max-w-md border border-slate-700 shadow-2xl">
+                <h2 className="text-3xl font-bold text-white mb-6 text-center">Control Patente AI</h2>
+                <form onSubmit={handleLogin} className="space-y-6">
+                    <div>
+                        <label className="block text-slate-400 mb-2">Username</label>
+                        <input
+                            type="text"
+                            value={username}
+                            onChange={(e) => setUsername(e.target.value)}
+                            className="w-full bg-slate-900 border border-slate-700 rounded-lg p-3 text-white focus:ring-2 focus:ring-blue-500 outline-none"
+                        />
+                    </div>
+                    <div>
+                        <label className="block text-slate-400 mb-2">Password</label>
+                        <input
+                            type="password"
+                            value={password}
+                            onChange={(e) => setPassword(e.target.value)}
+                            className="w-full bg-slate-900 border border-slate-700 rounded-lg p-3 text-white focus:ring-2 focus:ring-blue-500 outline-none"
+                        />
+                    </div>
+                    <button
+                        type="submit"
+                        className="w-full py-3 bg-blue-600 hover:bg-blue-500 rounded-lg font-bold text-white transition-colors"
+                    >
+                        Login
+                    </button>
+                </form>
+            </div>
+        </div>
+    );
+}
+
+export default Login;