danak/dmenu-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix some bug

Browse Source
This commit is contained in:
hamid zarghami
2025-11-01 11:18:06 +03:30
parent 8c99e7dedf
commit e2b6f5845e
19 changed files with 979 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Pagination.tsx
+52 -42
View File
@@ -11,33 +11,41 @@ const Pagination: React.FC<PaginationProps> = ({
totalPages,
onPageChange,
}) => {
// اگر فقط یک صفحه داریم، pagination نمایش داده نمی‌شود
if (totalPages <= 1) return null;
const getPageNumbers = () => {
const pageNumbers: (number | string)[] = [];
const maxVisiblePages = 5; // تعداد حداکثری صفحات قابل مشاهده
const maxVisiblePages = window.innerWidth < 768 ? 3 : 5; // تعداد کمتر برای موبایل
if (totalPages <= maxVisiblePages) {
for (let i = 1; i <= totalPages; i++) {
pageNumbers.push(i);
}
} else {
// نمایش صفحه اول
pageNumbers.push(1);
if (currentPage > 3) {
pageNumbers.push(1);
if (currentPage > 4) {
pageNumbers.push("...");
}
pageNumbers.push("...");
}
const start = Math.max(2, currentPage - 1);
const end = Math.min(totalPages - 1, currentPage + 1);
// صفحات میانی
const start = Math.max(2, Math.min(currentPage - 1, totalPages - 3));
const end = Math.min(totalPages - 1, Math.max(currentPage + 1, 4));
for (let i = start; i <= end; i++) {
pageNumbers.push(i);
if (!pageNumbers.includes(i)) {
pageNumbers.push(i);
}
}
if (currentPage < totalPages - 2) {
if (currentPage < totalPages - 3) {
pageNumbers.push("...");
}
pageNumbers.push("...");
}
// نمایش صفحه آخر
if (!pageNumbers.includes(totalPages)) {
pageNumbers.push(totalPages);
}
}
@@ -48,50 +56,52 @@ const Pagination: React.FC<PaginationProps> = ({
const pageNumbers = getPageNumbers();
return (
<div className="flex gap-2 text-xs justify-center items-center space-x-2 mt-4">
{/* دکمه قبلی */}
{/* <button
className={`px-3 py-1 rounded-md ${currentPage === 1
? "text-gray-400 cursor-not-allowed"
: "text-blue-600 hover:bg-gray-100"
<div className="flex justify-center items-center gap-1 md:gap-2 py-4 md:py-6 mt-3 md:mt-4 border-t border-gray-100">
{/* دکمه صفحه قبل */}
<button
className={`px-2 md:px-3 py-2 text-xs md:text-sm rounded-lg transition-colors ${currentPage === 1
? "text-gray-400 cursor-not-allowed"
: "text-gray-600 hover:bg-gray-100 hover:text-gray-800"
}`}
onClick={() => currentPage > 1 && onPageChange(currentPage - 1)}
disabled={currentPage === 1}
>
قبلی
</button> */}
</button>
{/* شماره صفحات */}
{pageNumbers.map((page, index) =>
typeof page === "number" ? (
<button
key={index}
className={`size-8 rounded-md ${currentPage === page
? "bg-primary text-white"
: "text-primary bg-[#EAECF5] hover:bg-gray-100"
}`}
onClick={() => onPageChange(page)}
>
{page}
</button>
) : (
<span key={index} className="px-3 py-1 text-gray-500">
{page}
</span>
)
)}
<div className="flex gap-1">
{pageNumbers.map((page, index) =>
typeof page === "number" ? (
<button
key={index}
className={`w-8 h-8 md:w-10 md:h-10 text-xs md:text-sm rounded-lg transition-colors ${currentPage === page
? "bg-primary text-white shadow-sm"
: "text-gray-600 hover:bg-gray-100 hover:text-gray-800"
}`}
onClick={() => onPageChange(page)}
>
{page}
</button>
) : (
<span key={index} className="flex items-center px-1 md:px-2 text-gray-400 text-xs md:text-sm">
{page}
</span>
)
)}
</div>
{/* دکمه بعدی */}
{/* <button
className={`px-3 py-1 rounded-md ${currentPage === totalPages
? "text-gray-400 cursor-not-allowed"
: "text-blue-600 hover:bg-gray-100"
{/* دکمه صفحه بعد */}
<button
className={`px-2 md:px-3 py-2 text-xs md:text-sm rounded-lg transition-colors ${currentPage === totalPages
? "text-gray-400 cursor-not-allowed"
: "text-gray-600 hover:bg-gray-100 hover:text-gray-800"
}`}
onClick={() => currentPage < totalPages && onPageChange(currentPage + 1)}
disabled={currentPage === totalPages}
>
بعدی
</button> */}
</button>
</div>
);
};