ae31019477
Add node group management interface with automatic user assignment and traffic-based grouping. Features: - Node group CRUD with traffic range configuration - Three grouping modes: average, subscription-based, and traffic-based - Group recalculation with preview and history tracking - Subscribe-to-group mapping management - User subscription group locking - Group calculation history with detailed reports - Multi-language support (en-US, zh-CN) - Enhanced node and subscription forms with group selection
106 lines
3.5 KiB
TypeScript
106 lines
3.5 KiB
TypeScript
"use client";
|
|
|
|
import { useSearch } from "@tanstack/react-router";
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
} from "@workspace/ui/components/tooltip";
|
|
import { ProTable } from "@workspace/ui/composed/pro-table/pro-table";
|
|
import { filterSubscribeLog } from "@workspace/ui/services/admin/log";
|
|
import { useTranslation } from "react-i18next";
|
|
import { IpLink } from "@/components/ip-link";
|
|
import { UserDetail, UserSubscribeDetail } from "@/sections/user/user-detail";
|
|
import { formatDate } from "@/utils/common";
|
|
|
|
export default function SubscribeLogPage() {
|
|
const { t } = useTranslation("log");
|
|
const sp = useSearch({ strict: false }) as Record<string, string | undefined>;
|
|
|
|
const today = new Date().toISOString().split("T")[0];
|
|
|
|
const initialFilters = {
|
|
date: sp.date || today,
|
|
user_id: sp.user_id ? Number(sp.user_id) : undefined,
|
|
user_subscribe_id: sp.user_subscribe_id || undefined,
|
|
};
|
|
return (
|
|
<ProTable<API.SubscribeLog, { date?: string; user_id?: number; user_subscribe_id?: string }>
|
|
columns={[
|
|
{
|
|
accessorKey: "user",
|
|
header: t("column.user", "User"),
|
|
cell: ({ row }) => <UserDetail id={Number(row.original.user_id)} />,
|
|
},
|
|
{
|
|
accessorKey: "user_subscribe_id",
|
|
header: t("column.subscribe", "Subscribe"),
|
|
cell: ({ row }) => (
|
|
<UserSubscribeDetail
|
|
enabled
|
|
hoverCard
|
|
id={Number(row.original.user_subscribe_id)}
|
|
/>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "client_ip",
|
|
header: t("column.ip", "IP"),
|
|
cell: ({ row }) => (
|
|
<IpLink ip={String((row.original as any).client_ip || "")} />
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "user_agent",
|
|
header: t("column.userAgent", "User Agent"),
|
|
cell: ({ row }) => {
|
|
const userAgent = String(row.original.user_agent || "");
|
|
return (
|
|
<TooltipProvider>
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<div className="max-w-48 cursor-help truncate">
|
|
{userAgent}
|
|
</div>
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
<p className="wrap-break-word max-w-md">{userAgent}</p>
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
);
|
|
},
|
|
},
|
|
{
|
|
accessorKey: "timestamp",
|
|
header: t("column.time", "Time"),
|
|
cell: ({ row }) => formatDate(row.original.timestamp),
|
|
},
|
|
]}
|
|
header={{ title: t("title.subscribe", "Subscribe Log") }}
|
|
initialFilters={initialFilters}
|
|
params={[
|
|
{ key: "date", type: "date" },
|
|
{ key: "user_id", placeholder: t("column.userId", "User ID") },
|
|
{
|
|
key: "user_subscribe_id",
|
|
placeholder: t("column.subscribeId", "Subscribe ID"),
|
|
},
|
|
]}
|
|
request={async (pagination, filter) => {
|
|
const { data } = await filterSubscribeLog({
|
|
page: pagination.page,
|
|
size: pagination.size,
|
|
date: (filter as any)?.date,
|
|
user_id: (filter as any)?.user_id,
|
|
user_subscribe_id: (filter as any)?.user_subscribe_id ? Number((filter as any)?.user_subscribe_id) : undefined,
|
|
});
|
|
const list = (data?.data?.list || []) as any[];
|
|
const total = Number(data?.data?.total || list.length);
|
|
return { list, total };
|
|
}}
|
|
/>
|
|
);
|
|
}
|