fix:memperbaiki pagination pada tabel history
This commit is contained in:
parent
357611bd50
commit
bb70f00aae
|
@ -55,7 +55,7 @@ const TabelHistory = () => {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Filter data berdasarkan pencarian
|
// Filter data berdasarkan pencarian
|
||||||
const filteredData = data.filter(
|
const filteredData = data.filter(
|
||||||
|
@ -73,7 +73,7 @@ const TabelHistory = () => {
|
||||||
const currentData = filteredData.slice(startIndex, endIndex);
|
const currentData = filteredData.slice(startIndex, endIndex);
|
||||||
|
|
||||||
|
|
||||||
const handleDelete = async(id) => {
|
const handleDelete = async (id) => {
|
||||||
// setDataHarga((prevData) => prevData.filter((item) => item.id !== id));
|
// setDataHarga((prevData) => prevData.filter((item) => item.id !== id));
|
||||||
const token = localStorage.getItem("token");
|
const token = localStorage.getItem("token");
|
||||||
try {
|
try {
|
||||||
|
@ -86,7 +86,7 @@ const TabelHistory = () => {
|
||||||
toast({
|
toast({
|
||||||
description: `${response.data.message}`,
|
description: `${response.data.message}`,
|
||||||
});
|
});
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
toast({
|
toast({
|
||||||
description: `${error.response.data.detail}`,
|
description: `${error.response.data.detail}`,
|
||||||
|
@ -141,7 +141,7 @@ const TabelHistory = () => {
|
||||||
<TableCell className="text-center">{item.MAPE}%</TableCell>
|
<TableCell className="text-center">{item.MAPE}%</TableCell>
|
||||||
<TableCell className="text-center">
|
<TableCell className="text-center">
|
||||||
<Button variant="destructive" size="sm" onClick={() => handleDelete(item.id)}>
|
<Button variant="destructive" size="sm" onClick={() => handleDelete(item.id)}>
|
||||||
<Trash size={16}/>
|
<Trash size={16} />
|
||||||
</Button>
|
</Button>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
|
@ -162,6 +162,7 @@ const TabelHistory = () => {
|
||||||
<h3 className="w-full">Menampilkan {filteredData.length} data</h3>
|
<h3 className="w-full">Menampilkan {filteredData.length} data</h3>
|
||||||
<Pagination className="flex justify-end">
|
<Pagination className="flex justify-end">
|
||||||
<PaginationContent>
|
<PaginationContent>
|
||||||
|
|
||||||
<PaginationItem>
|
<PaginationItem>
|
||||||
<PaginationPrevious
|
<PaginationPrevious
|
||||||
href="#"
|
href="#"
|
||||||
|
@ -170,17 +171,36 @@ const TabelHistory = () => {
|
||||||
/>
|
/>
|
||||||
</PaginationItem>
|
</PaginationItem>
|
||||||
|
|
||||||
{Array.from({ length: totalPages }, (_, index) => (
|
|
||||||
<PaginationItem key={index}>
|
{(() => {
|
||||||
<PaginationLink
|
let startPage = Math.max(1, currentPage - 1);
|
||||||
href="#"
|
let endPage = Math.min(totalPages, currentPage + 1);
|
||||||
isActive={currentPage === index + 1}
|
|
||||||
onClick={() => setCurrentPage(index + 1)}
|
|
||||||
>
|
if (currentPage === 1) {
|
||||||
{index + 1}
|
endPage = Math.min(3, totalPages);
|
||||||
</PaginationLink>
|
}
|
||||||
</PaginationItem>
|
|
||||||
))}
|
|
||||||
|
if (currentPage === totalPages) {
|
||||||
|
startPage = Math.max(1, totalPages - 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i).map(
|
||||||
|
(page) => (
|
||||||
|
<PaginationItem key={page}>
|
||||||
|
<PaginationLink
|
||||||
|
href="#"
|
||||||
|
isActive={currentPage === page}
|
||||||
|
onClick={() => setCurrentPage(page)}
|
||||||
|
>
|
||||||
|
{page}
|
||||||
|
</PaginationLink>
|
||||||
|
</PaginationItem>
|
||||||
|
)
|
||||||
|
);
|
||||||
|
})()}
|
||||||
|
|
||||||
|
|
||||||
<PaginationItem>
|
<PaginationItem>
|
||||||
<PaginationNext
|
<PaginationNext
|
||||||
|
|
Loading…
Reference in New Issue