rework violation table and violation actions
This commit is contained in:
@@ -11,7 +11,7 @@ import Link from 'next/link';
|
||||
import { getViolationFilesArray } from '@/app/actions/violationActions';
|
||||
import { IconEye } from '@/app/ui/icons/icons';
|
||||
|
||||
interface ViolationFile {
|
||||
interface FileViolation {
|
||||
createdAt: string;
|
||||
fileId: string;
|
||||
fileName: string;
|
||||
@@ -23,20 +23,26 @@ interface ViolationFile {
|
||||
violationCount: number;
|
||||
}
|
||||
|
||||
interface ViolationData {
|
||||
content: FileViolation[];
|
||||
}
|
||||
|
||||
export default function DashboardUserViolations() {
|
||||
const {
|
||||
data: violationData,
|
||||
isLoading,
|
||||
isError,
|
||||
error,
|
||||
} = useQuery<ViolationFile[]>({
|
||||
queryKey: ['violationData'],
|
||||
queryFn: () => getViolationFilesArray(),
|
||||
} = useQuery<ViolationData>({
|
||||
queryKey: ['violationData', { page: 0, size: 5 }],
|
||||
queryFn: () => getViolationFilesArray({
|
||||
page: 0,
|
||||
size: 5,
|
||||
}),
|
||||
|
||||
select: (data) => {
|
||||
return data?.slice(0, 5) || [];
|
||||
},
|
||||
/* refetchInterval: 30000 */
|
||||
return data;
|
||||
}
|
||||
});
|
||||
|
||||
const t = useTranslations('Global');
|
||||
@@ -76,8 +82,8 @@ export default function DashboardUserViolations() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{violationData?.length ? (
|
||||
violationData?.map((file) => {
|
||||
{violationData?.content.length ? (
|
||||
violationData?.content.map((file) => {
|
||||
return (
|
||||
<div
|
||||
key={file.fileId}
|
||||
|
||||
@@ -1,173 +0,0 @@
|
||||
'use client'
|
||||
|
||||
import { Swiper, SwiperSlide } from 'swiper/react';
|
||||
import { Pagination, Autoplay } from 'swiper/modules';
|
||||
import Image from 'next/image';
|
||||
import 'swiper/css';
|
||||
import 'swiper/css/pagination';
|
||||
import testImage from '@/app/src/image-preview.png'
|
||||
import { useEffect, useRef } from 'react';
|
||||
import { useTranslations } from 'next-intl';
|
||||
import Link from 'next/link';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { getViolationFilesArray } from '@/app/actions/violationActions';
|
||||
|
||||
interface ViolationFile {
|
||||
createdAt: string;
|
||||
fileId: string;
|
||||
fileName: string;
|
||||
fileSize: number;
|
||||
latestViolationDate: string;
|
||||
mimeType: string;
|
||||
status: string;
|
||||
supportId: number;
|
||||
violationCount: number;
|
||||
}
|
||||
|
||||
export default function ViolationsCarousel() {
|
||||
const {
|
||||
data: violationData,
|
||||
isLoading,
|
||||
isError,
|
||||
error,
|
||||
} = useQuery<ViolationFile[]>({
|
||||
queryKey: ['violationData'],
|
||||
queryFn: () => getViolationFilesArray(),
|
||||
|
||||
select: (data) => {
|
||||
return data;
|
||||
},
|
||||
/* refetchInterval: 30000 */
|
||||
});
|
||||
const paginationRef = useRef(null);
|
||||
const t = useTranslations('Global');
|
||||
|
||||
useEffect(() => {
|
||||
console.log(violationData);
|
||||
}, [violationData])
|
||||
|
||||
return (
|
||||
<div className="content-section">
|
||||
<div className="section-header">
|
||||
<h3 className="section-title">{t('violation')}</h3>
|
||||
<Link
|
||||
href="violations"
|
||||
className="view-all-link"
|
||||
>
|
||||
Смотреть все
|
||||
</Link>
|
||||
</div>
|
||||
<div>
|
||||
{t('are-no-violations')}
|
||||
</div>
|
||||
<div className="violations-carousel">
|
||||
<Swiper
|
||||
spaceBetween={50}
|
||||
slidesPerView={1}
|
||||
modules={[Pagination, Autoplay]}
|
||||
pagination={{
|
||||
clickable: true,
|
||||
el: '.custon-swiper-pagination'
|
||||
}}
|
||||
loop={true}
|
||||
autoplay={{
|
||||
delay: 3000,
|
||||
disableOnInteraction: false,
|
||||
}}
|
||||
>
|
||||
{/* {violationData?.map(item => {
|
||||
return (
|
||||
<SwiperSlide>
|
||||
<div
|
||||
className="violation-slide"
|
||||
>
|
||||
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
)
|
||||
})} */}
|
||||
{/* <SwiperSlide>
|
||||
<div className="violation-slide">
|
||||
<div className="violation-image-container">
|
||||
<Image src={testImage} alt="Preview" className="violation-image" />
|
||||
<div className="violation-badge">НАРУШЕНИЕ</div>
|
||||
<div className="violation-status-badge">ОБРАБОТАНО</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-content">
|
||||
<div className="violation-title-row">
|
||||
<div className="violation-filename">
|
||||
🖼️banner111.png</div>
|
||||
<div className="violation-type-badge photo">
|
||||
Фото
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-grid">
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">
|
||||
🌍 Регион
|
||||
</div>
|
||||
<div className="violation-info-value">
|
||||
<span className="region-flag">🇺🇸</span>
|
||||
<span>США</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">📅 Обнаружено</div>
|
||||
<div className="violation-info-value">
|
||||
17.10.2025</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">🌐 Домен</div>
|
||||
<div className="violation-info-value">
|
||||
m.apkpure.com </div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">📊 Категория</div>
|
||||
<div className="violation-info-value">
|
||||
Единичное
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">📁 Тип</div>
|
||||
<div className="violation-info-value">
|
||||
Изображение</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-info-item">
|
||||
<div className="violation-info-label">⚡ Статус</div>
|
||||
<div className="violation-info-value">
|
||||
✅ Обработано</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="violation-actions-row">
|
||||
<button className="btn-visit-site">
|
||||
🔗 Перейти на сайт
|
||||
</button>
|
||||
<button className="violation-action">
|
||||
🚨 Открыть дело
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide> */}
|
||||
</Swiper>
|
||||
<div
|
||||
className="flex justify-center mt-6"
|
||||
>
|
||||
<div
|
||||
ref={paginationRef}
|
||||
className="flex justify-center gap-2 custon-swiper-pagination"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user