Version sin Vite.

2026-02-18 16:50:48 +01:00
commit cb312f680a
21 changed files with 2583 additions and 0 deletions
--- a/frontend/pages/login.js
+++ b/frontend/pages/login.js
@@ -0,0 +1,77 @@
+import { useState } from 'react';
+import { useRouter } from 'next/router';
+
+export default function Login() {
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const router = useRouter();
+
+  const handleLogin = async (e) => {
+    e.preventDefault();
+    try {
+      const res = await fetch('http://localhost:9002/posts/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ username, password })
+      });
+      const data = await res.json();
+
+      if (res.ok) {
+        localStorage.setItem('blog_token', data.token);
+        router.push('/admin');
+      } else {
+        alert('Credenciales incorrectas');
+      }
+    } catch (err) {
+      alert('Error de conexión');
+    }
+  };
+
+  return (
+    <div style={{
+      height: '100vh', display: 'flex', justifyContent: 'center', alignItems: 'center',
+      backgroundColor: '#f8fafc', fontFamily: 'sans-serif'
+    }}>
+      <form onSubmit={handleLogin} style={{
+        backgroundColor: 'white', padding: '50px', borderRadius: '20px',
+        border: '1px solid #e2e8f0', boxShadow: '0 10px 15px -3px rgba(0,0,0,0.1)',
+        width: '100%', maxWidth: '400px'
+      }}>
+        <h2 style={{ textAlign: 'center', marginBottom: '30px', color: '#0f172a', marginTop: 0 }}>
+          Admin Login 🔐
+        </h2>
+        
+        <input 
+          placeholder="Usuario" 
+          value={username} 
+          onChange={e => setUsername(e.target.value)} 
+          style={{
+            width: '100%', padding: '14px', border: '2px solid #e2e8f0',
+            borderRadius: '10px', marginBottom: '20px', fontSize: '1rem', 
+            boxSizing: 'border-box', outline: 'none'
+          }}
+        />
+        
+        <input 
+          type="password" 
+          placeholder="Contraseña" 
+          value={password} 
+          onChange={e => setPassword(e.target.value)} 
+          style={{
+            width: '100%', padding: '14px', border: '2px solid #e2e8f0',
+            borderRadius: '10px', marginBottom: '30px', fontSize: '1rem', 
+            boxSizing: 'border-box', outline: 'none'
+          }}
+        />
+        
+        <button style={{
+          width: '100%', padding: '16px', backgroundColor: '#2563eb', color: 'white',
+          border: 'none', borderRadius: '10px', fontWeight: '800', fontSize: '1rem',
+          cursor: 'pointer'
+        }}>
+          Entrar al Sistema
+        </button>
+      </form>
+    </div>
+  );
+}