Se agregó funciones de carga y descarga
This commit is contained in:
+63
-27
@@ -14,34 +14,68 @@ const fuentes = [
|
||||
];
|
||||
|
||||
export default function Dashboard() {
|
||||
// const loading = useAuthRedirect();
|
||||
const loading = useAuthRedirect();
|
||||
|
||||
// if (loading) {
|
||||
// return <p></p>;
|
||||
// }
|
||||
if (loading) {
|
||||
return <p></p>;
|
||||
}
|
||||
|
||||
const handleDownload = async () => {
|
||||
const token = localStorage.getItem("token");
|
||||
|
||||
if (!token) {
|
||||
alert("Token no encontrado. Inicia sesión.");
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch("http://localhost:4000/excel/download", {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error("Error al descargar la base de datos");
|
||||
}
|
||||
|
||||
const blob = await response.blob();
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
|
||||
const a = document.createElement("a");
|
||||
a.href = url;
|
||||
a.download = "usuarios.tsv";
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
a.remove();
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (error: any) {
|
||||
alert(`Error al descargar: ${error.message}`);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<main className="roboto" style={{
|
||||
minHeight: "100vh",
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
background: "#063970"
|
||||
}}>
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="flex gap-4 flex-wrap mb-6" style={{
|
||||
background: "#f3f4f6",
|
||||
padding: "2rem",
|
||||
borderRadius: "8px",
|
||||
boxShadow: "0 4px 6px rgba(253, 253, 253, 0.1)",
|
||||
width: "100%",
|
||||
|
||||
}}>
|
||||
|
||||
<main
|
||||
className="roboto"
|
||||
style={{
|
||||
minHeight: "100vh",
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
background: "#063970",
|
||||
}}
|
||||
>
|
||||
<div
|
||||
className="flex gap-4 flex-wrap mb-6"
|
||||
style={{
|
||||
background: "#f3f4f6",
|
||||
padding: "2rem",
|
||||
borderRadius: "8px",
|
||||
boxShadow: "0 4px 6px rgba(253, 253, 253, 0.1)",
|
||||
width: "100%",
|
||||
}}
|
||||
>
|
||||
<h2 className="text-xl font-semibold mb-4">Fuentes</h2>
|
||||
<div
|
||||
style={{
|
||||
@@ -49,7 +83,8 @@ export default function Dashboard() {
|
||||
flexDirection: "row",
|
||||
justifyContent: "center",
|
||||
gap: "16px",
|
||||
}}>
|
||||
}}
|
||||
>
|
||||
{fuentes.map((f, idx) => (
|
||||
<FuenteCard
|
||||
key={idx}
|
||||
@@ -64,8 +99,9 @@ export default function Dashboard() {
|
||||
<div>
|
||||
<CargaArchivo />
|
||||
</div>
|
||||
<h2 className="text-xl font-semibold mb-4"> Descarga de Datos</h2>
|
||||
<Button onClick={() => alert('¡Hola mundo!')} className='mb-3'>
|
||||
|
||||
<h2 className="text-xl font-semibold mb-4">Descarga de Datos</h2>
|
||||
<Button onClick={handleDownload} className="mb-3">
|
||||
Descarga Base de Datos
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
+7
-5
@@ -15,12 +15,14 @@ export default function Login() {
|
||||
|
||||
const handleLogin = async () => {
|
||||
try {
|
||||
const response = await axios.post('/api/auth/login', {
|
||||
cuenta: value,
|
||||
const response = await axios.post('http://localhost:4000/login', {
|
||||
email: value,
|
||||
password: password,
|
||||
});
|
||||
|
||||
const token = response.data.token;
|
||||
|
||||
|
||||
const token = response.data.access_token;
|
||||
localStorage.setItem('token', token);
|
||||
|
||||
// Redirige al usuario
|
||||
@@ -64,8 +66,8 @@ export default function Login() {
|
||||
<h1 style={{ color: "#1e3a8a", textAlign: "center", fontWeight: "bold", marginBottom: "2rem" }}>Sistema de --------</h1>
|
||||
|
||||
<Input
|
||||
label="Número de cuenta"
|
||||
placeholder="9 dígitos sin guión"
|
||||
label="Correo"
|
||||
placeholder="escribe tu correo"
|
||||
value={value}
|
||||
onChange={(e) => setValue(e.target.value)}
|
||||
/>
|
||||
|
||||
@@ -12,19 +12,37 @@ const CargaArchivo: React.FC = () => {
|
||||
const handleUpload = async () => {
|
||||
if (!archivo) return;
|
||||
|
||||
const token = localStorage.getItem("token"); // 👈 Token JWT guardado en login
|
||||
|
||||
|
||||
if (!token) {
|
||||
alert("No hay token disponible. Inicia sesión.");
|
||||
return;
|
||||
}
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append("archivo", archivo);
|
||||
formData.append("file", archivo); // 👈 ¡Debe coincidir con FileInterceptor('file')
|
||||
|
||||
const res = await fetch("/api/cargar-archivo", {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
});
|
||||
try {
|
||||
const res = await fetch("http://localhost:4000/excel/load", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`, // 👈 Incluye el token en el header
|
||||
},
|
||||
body: formData,
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
alert("Archivo subido correctamente");
|
||||
setArchivo(null);
|
||||
} else {
|
||||
alert("Error al subir archivo");
|
||||
const data = await res.json();
|
||||
|
||||
if (res.ok) {
|
||||
alert("Archivo subido correctamente");
|
||||
setArchivo(null);
|
||||
} else {
|
||||
console.error(data);
|
||||
alert(`Error al subir archivo: ${JSON.stringify(data)}`);
|
||||
}
|
||||
} catch (err) {
|
||||
alert(`Error en la solicitud: ${err}`);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -41,10 +59,8 @@ const CargaArchivo: React.FC = () => {
|
||||
disabled={!archivo}
|
||||
className="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700"
|
||||
style={{
|
||||
|
||||
backgroundColor: "#2563eb",
|
||||
color: "#fff",
|
||||
|
||||
}}
|
||||
>
|
||||
Subir archivo
|
||||
|
||||
Reference in New Issue
Block a user