mirror of
https://github.com/perfect-panel/ppanel-web.git
synced 2026-02-14 20:31:10 -05:00
2bcd4cf30c
- Added new keys for "server", "subscribe", "detail", "pending", "sending", "sent", and "unknown" in log.json files for various languages. - Introduced a "type" object with transaction types (Recharge, Withdraw, Purchase, Refund, Reward, Commission) in log.json files for multiple languages. - Updated "traffic_ratio" to "Ratio" and added "transport" in servers.json for English localization. - Ensured consistency and accuracy in translations for all affected languages including German, English, Spanish, French, Russian, Chinese, and more.
100 lines
3.4 KiB
TypeScript
100 lines
3.4 KiB
TypeScript
'use client';
|
|
|
|
import { UserDetail, UserSubscribeDetail } from '@/app/dashboard/user/user-detail';
|
|
import { ProTable } from '@/components/pro-table';
|
|
import { filterTrafficLogDetails } from '@/services/admin/log';
|
|
import { filterServerList } from '@/services/admin/server';
|
|
import { formatDate } from '@/utils/common';
|
|
import { useQuery } from '@tanstack/react-query';
|
|
import { formatBytes } from '@workspace/ui/utils';
|
|
import { useTranslations } from 'next-intl';
|
|
import { useSearchParams } from 'next/navigation';
|
|
|
|
export default function TrafficDetailsPage() {
|
|
const t = useTranslations('log');
|
|
const sp = useSearchParams();
|
|
|
|
const today = new Date().toISOString().split('T')[0];
|
|
|
|
const { data: servers = [] } = useQuery({
|
|
queryKey: ['filterServerListAll'],
|
|
queryFn: async () => {
|
|
const { data } = await filterServerList({ page: 1, size: 999999999 });
|
|
return data?.data?.list || [];
|
|
},
|
|
});
|
|
|
|
const getServerName = (id?: number) =>
|
|
id ? (servers.find((s) => s.id === id)?.name ?? `Server ${id}`) : 'Unknown';
|
|
|
|
const initialFilters = {
|
|
date: sp.get('date') || today,
|
|
server_id: sp.get('server_id') ? Number(sp.get('server_id')) : undefined,
|
|
user_id: sp.get('user_id') ? Number(sp.get('user_id')) : undefined,
|
|
subscribe_id: sp.get('subscribe_id') ? Number(sp.get('subscribe_id')) : undefined,
|
|
};
|
|
return (
|
|
<ProTable<API.TrafficLogDetails, { search?: string }>
|
|
header={{ title: t('title.trafficDetails') }}
|
|
initialFilters={initialFilters}
|
|
columns={[
|
|
{
|
|
accessorKey: 'server_id',
|
|
header: t('column.server'),
|
|
cell: ({ row }) => (
|
|
<span>
|
|
{getServerName(row.original.server_id)} ({row.original.server_id})
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: 'user_id',
|
|
header: t('column.user'),
|
|
cell: ({ row }) => <UserDetail id={Number(row.original.user_id)} />,
|
|
},
|
|
{
|
|
accessorKey: 'subscribe_id',
|
|
header: t('column.subscribe'),
|
|
cell: ({ row }) => (
|
|
<UserSubscribeDetail id={Number(row.original.subscribe_id)} enabled hoverCard />
|
|
),
|
|
},
|
|
{
|
|
accessorKey: 'upload',
|
|
header: t('column.upload'),
|
|
cell: ({ row }) => formatBytes(row.original.upload),
|
|
},
|
|
{
|
|
accessorKey: 'download',
|
|
header: t('column.download'),
|
|
cell: ({ row }) => formatBytes(row.original.download),
|
|
},
|
|
{
|
|
accessorKey: 'timestamp',
|
|
header: t('column.time'),
|
|
cell: ({ row }) => formatDate(row.original.timestamp),
|
|
},
|
|
]}
|
|
params={[
|
|
{ key: 'date', type: 'date' },
|
|
{ key: 'server_id', placeholder: t('column.serverId') },
|
|
{ key: 'user_id', placeholder: t('column.userId') },
|
|
{ key: 'subscribe_id', placeholder: t('column.subscribeId') },
|
|
]}
|
|
request={async (pagination, filter) => {
|
|
const { data } = await filterTrafficLogDetails({
|
|
page: pagination.page,
|
|
size: pagination.size,
|
|
date: (filter as any)?.date,
|
|
server_id: (filter as any)?.server_id,
|
|
user_id: (filter as any)?.user_id,
|
|
subscribe_id: (filter as any)?.subscribe_id,
|
|
});
|
|
const list = (data?.data?.list || []) as any[];
|
|
const total = Number(data?.data?.total || list.length);
|
|
return { list, total };
|
|
}}
|
|
/>
|
|
);
|
|
}
|