85 lines
2.2 KiB
TypeScript
85 lines
2.2 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import Cookies from "js-cookie";
|
|
import axios from "axios";
|
|
import toast from "react-hot-toast";
|
|
|
|
import "../app/styles/layout/history.scss";
|
|
|
|
export default function History() {
|
|
const [historial, setHistorial] = useState<any[]>([]);
|
|
const api_url = process.env.NEXT_PUBLIC_API_URL;
|
|
const router = useRouter();
|
|
|
|
|
|
useEffect(() => {
|
|
const fetchHistorial = async () => {
|
|
try {
|
|
const token = Cookies.get("token");
|
|
const headers = { Authorization: `Bearer ${token}` };
|
|
|
|
const response = await axios.get(`${api_url}/movimientos/historial`, {
|
|
headers,
|
|
});
|
|
|
|
setHistorial(response.data);
|
|
} catch (error) {
|
|
toast.error("No se pudo cargar el historial");
|
|
}
|
|
};
|
|
|
|
fetchHistorial();
|
|
}, []);
|
|
|
|
const handleClick = (item: any) => {
|
|
const inventario = item.inventario;
|
|
router.push(`/editar?equipoId=${inventario}`);
|
|
};
|
|
|
|
return (
|
|
<div className="history-table-container">
|
|
<table className="history-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Inventario</th>
|
|
<th>Tipo de Equipo</th>
|
|
<th>Fecha de Censo</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
{historial.length > 0 ? (
|
|
historial.map((item: any, index: number) => (
|
|
<tr
|
|
key={item.id || index}
|
|
onClick={() => handleClick(item)}
|
|
className="clickable-row"
|
|
>
|
|
<td>{item.inventario}</td>
|
|
<td>
|
|
{item.tipo_equipo === "PERIFÉRICO"
|
|
? item.periferico
|
|
: item.tipo_equipo}
|
|
</td>
|
|
<td>
|
|
{item.fechaMovimiento
|
|
? new Date(item.fechaMovimiento).toLocaleDateString("es-MX")
|
|
: "—"}
|
|
</td>
|
|
</tr>
|
|
))
|
|
) : (
|
|
<tr>
|
|
<td colSpan={3} className="empty-row">
|
|
No hay registros de historial
|
|
</td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
}
|