86 lines
2.0 KiB
TypeScript
86 lines
2.0 KiB
TypeScript
"use client";
|
|
import React, { useState } from "react";
|
|
import Button from "./button";
|
|
const apiUrl = process.env.NEXT_PUBLIC_API_URL;
|
|
|
|
type FuenteCardProps = {
|
|
nombre: string;
|
|
fecha: string;
|
|
activa: boolean;
|
|
id_mov: number;
|
|
onValidated?: () => void;
|
|
};
|
|
|
|
const FuenteCard: React.FC<FuenteCardProps> = ({
|
|
nombre,
|
|
fecha,
|
|
activa,
|
|
id_mov,
|
|
onValidated,
|
|
}) => {
|
|
const [loading, setLoading] = useState(false); // ← nuevo estado
|
|
|
|
const handleActivar = async () => {
|
|
const token = localStorage.getItem("token");
|
|
if (!token) {
|
|
alert("Token no encontrado.");
|
|
return;
|
|
}
|
|
|
|
try {
|
|
setLoading(true); // ← activa estado de carga
|
|
const res = await fetch(
|
|
`${apiUrl}/excel/activar-servicios/${id_mov}`,
|
|
{
|
|
method: "POST",
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
}
|
|
);
|
|
|
|
const data = await res.json();
|
|
|
|
if (res.ok) {
|
|
alert("Usuarios validados correctamente");
|
|
onValidated?.();
|
|
} else {
|
|
alert(`Error: ${data.message || "No se pudo validar"}`);
|
|
}
|
|
} catch (error: any) {
|
|
alert(`Error en la solicitud: ${error.message}`);
|
|
} finally {
|
|
setLoading(false); // ← desactiva estado de carga
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="border rounded shadow-sm p-4 bg-white w-44">
|
|
<div className="flex items-center justify-between mb-2">
|
|
<span className="font-semibold text-sm">{nombre}</span>
|
|
<span
|
|
className={`w-3 h-3 rounded-full ${activa ? "bg-green-500" : "bg-red-500"}`}
|
|
/>
|
|
</div>
|
|
<p className="text-xs text-gray-700 leading-tight">
|
|
Fecha de carga:
|
|
<br />
|
|
{fecha}
|
|
</p>
|
|
|
|
{activa && (
|
|
<Button
|
|
onClick={handleActivar}
|
|
className="mb-3 px-3 py-1 mt-3"
|
|
variant="success"
|
|
disabled={loading} // ← deshabilita mientras valida
|
|
>
|
|
{loading ? "Validando..." : "Validar"}
|
|
</Button>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default FuenteCard;
|