add fixes

This commit is contained in:
smanylov
2025-12-19 13:05:50 +07:00
parent 35659a2878
commit c26c2ebc7f
5 changed files with 54 additions and 27 deletions
+26 -22
View File
@@ -11,7 +11,7 @@ import {
SortingState,
ColumnFiltersState,
} from '@tanstack/react-table';
import { IconImageFile, IconVideoFile, IconAudioFile, IconEye, IconDownload, IconShield, IconDoubleArrowRight, IconArrowRight, IconDoubleArrowLeft, IconArrowLeft, IconArrowUp, IconArrowDown, IconFilter } from '@/app/ui/icons/icons';
import {IconImageFile, IconVideoFile, IconAudioFile, IconEye, IconDoubleArrowRight, IconArrowRight, IconDoubleArrowLeft, IconArrowLeft, IconArrowUp, IconArrowDown, IconFilter, IconFileOpen, IconShieldExclamation} from '@/app/ui/icons/icons';
import { useTranslations } from 'next-intl';
import DropDownList from '@/app/components/dropDownList';
@@ -60,7 +60,7 @@ export default function TanstakFilesTable() {
// Данные с timestamp вместо Date объектов
const [data] = useState<FileItem[]>([
{ id: 1, fileName: 'image1.jpg', fileType: 'image', violations: 5, checks: 12, lastCheck: 1705267200000 }, // 15.01.2024
{ id: 2, fileName: 'presentation.mp4', fileType: 'video', violations: 2, checks: 8, lastCheck: 1705180800000 }, // 14.01.2024
{ id: 2, fileName: 'prespresentationpresentationprpresentationpresentationesentationentation.mp4', fileType: 'video', violations: 2, checks: 8, lastCheck: 1705180800000 }, // 14.01.2024
{ id: 3, fileName: 'song.mp3', fileType: 'audio', violations: 0, checks: 5, lastCheck: 1705094400000 }, // 13.01.2024
{ id: 4, fileName: 'photo1.jpg', fileType: 'image', violations: 3, checks: 10, lastCheck: 1705008000000 }, // 12.01.2024
{ id: 5, fileName: 'movie.mp4', fileType: 'video', violations: 1, checks: 7, lastCheck: 1704921600000 }, // 11.01.2024
@@ -115,10 +115,10 @@ export default function TanstakFilesTable() {
</div>
),
cell: ({ row }) => (
<div className="flex items-center space-x-2">
<div className="flex items-center space-x-2 w-[250px]">
<FileTypeIcon type={row.original.fileType} />
<div>
<div className="font-medium">{row.original.fileName}</div>
<div className="font-medium w-full max-w-[300px] truncate" title={row.original.fileName}>{row.original.fileName}</div>
</div>
</div>
),
@@ -245,13 +245,13 @@ export default function TanstakFilesTable() {
onClick={() => handleDownload(row.original)}
className="px-3 py-1 bg-green-500 text-white rounded hover:bg-green-600 text-sm"
>
<IconDownload />
<IconFileOpen />
</button>
<button
onClick={() => handleProtect(row.original)}
className="px-3 py-1 bg-violet-500 text-white rounded hover:bg-violet-600 text-sm"
>
<IconShield />
<IconShieldExclamation />
</button>
</div>
),
@@ -336,14 +336,15 @@ export default function TanstakFilesTable() {
});
return (
<div className="p-6 mx-auto">
<div className="p-6 mx-auto tanstak-table">
{/* Фильтры */}
<div className="flex flex-col md:flex-row justify-between items-start md:items-center gap-4 py-4 px-0">
<div className="flex flex-col md:flex-row justify-between items-start md:items-center gap-4 pb-4 pt-0 px-0">
<div className="flex flex-col md:flex-row gap-4 w-full md:w-auto">
<div className="flex flex-col w-50">
<div className="text-sm font-medium mb-1">{t('date-filter')}:</div>
<DropDownList
value={(() => {
value={dateFilter}
translatedValue={(() => {
switch (dateFilter) {
case 'all':
return t('all-dates')
@@ -380,18 +381,21 @@ export default function TanstakFilesTable() {
<div className="flex flex-col w-50">
<div className="text-sm font-medium mb-1">{t('type-filter')}:</div>
<DropDownList
value={(() => {
switch (typeFilter) {
case 'image':
return t('images')
case 'video':
return t('videos')
case 'audio':
return t('audios')
default:
return t('all-types')
}
})()}
value={typeFilter}
translatedValue={
(() => {
switch (typeFilter) {
case 'image':
return t('images')
case 'video':
return t('videos')
case 'audio':
return t('audios')
default:
return t('all-types')
}
})()
}
callBack={setTypeFilter}
>
<li value="all">
@@ -479,7 +483,7 @@ export default function TanstakFilesTable() {
<span className="text-sm text-gray-700">
{t('page')}{' '}
<strong>
{table.getState().pagination.pageIndex + 1} {t('out-of')} {table.getPageCount()}
{table.getState().pagination.pageIndex + 1} {t('out-of')} {table.getPageCount() ? table.getPageCount() : 1}
</strong>
</span>
<span className="text-sm text-gray-500">