add pagination for last cases lists
This commit is contained in:
@@ -2579,7 +2579,7 @@
|
||||
.violations-my-cases-section {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
padding: 32px;
|
||||
padding: 32px 32px 16px;
|
||||
margin-bottom: 24px;
|
||||
box-shadow: 0 10px 40px rgba(99, 102, 241, 0.1);
|
||||
max-width: calc(100vw - var(--side-bar-width) - 60px);
|
||||
|
||||
@@ -4,7 +4,7 @@ import { useLastComplaints } from '@/app/hooks/react-query/useLastComplaints';
|
||||
import { useLastCases } from '@/app/hooks/react-query/useLastCases';
|
||||
import { formatDate, formatDateTime } from '@/app/lib/formatDate';
|
||||
import { useTranslations } from 'next-intl';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useEffect, useState, useRef } from 'react';
|
||||
|
||||
import { Swiper, SwiperSlide } from 'swiper/react';
|
||||
import { Navigation, Pagination } from 'swiper/modules';
|
||||
@@ -17,6 +17,7 @@ type FilterState = {
|
||||
};
|
||||
|
||||
export default function ViolationsLastCombinedCases() {
|
||||
const swiperRef = useRef(null);
|
||||
const t = useTranslations('Global');
|
||||
const [filters, setFilters] = useState<FilterState>({
|
||||
complaints: true,
|
||||
@@ -123,6 +124,13 @@ export default function ViolationsLastCombinedCases() {
|
||||
}
|
||||
},
|
||||
loop: filteredItems.length > 3,
|
||||
pagination: {
|
||||
el: '.custom-pagination-container', // Кастомный контейнер для пагинации
|
||||
clickable: true,
|
||||
},
|
||||
onSwiper: (swiper: any) => {
|
||||
swiperRef.current = swiper;
|
||||
}
|
||||
};
|
||||
|
||||
const isLoading = (!dataComplaint || !dataCases);
|
||||
@@ -226,6 +234,9 @@ export default function ViolationsLastCombinedCases() {
|
||||
</Swiper>
|
||||
)}
|
||||
</div>
|
||||
{!isNothingSelected && filteredItems.length > 0 && (
|
||||
<div className="custom-pagination-container text-center"></div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user