tcjlj/OpenFlare
1
0
Fork 0
mirror of https://github.com/Rain-kl/OpenFlare.git synced 2026-10-13 02:26:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

prettier

Browse Source
This commit is contained in:
ryan
2026-07-13 15:08:40 +08:00
parent 08e8eea932
commit 1eff7878a1
441 changed files with 26491 additions and 18405 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/app/(main)/nodes/components/nodes-table.tsx
+57 -42
View File
@@ -1,14 +1,21 @@
'use client';
import Link from 'next/link';
import {Pencil, Trash2} from 'lucide-react';
import { Pencil, Trash2 } from 'lucide-react';
import {Button} from '@/components/ui/button';
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow,} from '@/components/ui/table';
import {formatDateTime} from '@/lib/utils';
import type {NodeItem} from '@/lib/services/openflare';
import { Button } from '@/components/ui/button';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from '@/components/ui/table';
import { formatDateTime } from '@/lib/utils';
import type { NodeItem } from '@/lib/services/openflare';
import {NodeStatusBadge} from './node-status-badge';
import { NodeStatusBadge } from './node-status-badge';
import {
formatRelativeTime,
getApplyLabel,
@@ -36,48 +43,51 @@ export function NodesTable({
onDelete: (node: NodeItem) => void;
}) {
return (
<div className="border border-dashed rounded-lg overflow-hidden">
<div className='border border-dashed rounded-lg overflow-hidden'>
<Table>
<TableHeader>
<TableRow className="border-dashed hover:bg-transparent">
<TableHead className="py-2 h-8">节点</TableHead>
<TableHead className="py-2 h-8">状态</TableHead>
<TableHead className="py-2 h-8">Version</TableHead>
<TableHead className="py-2 h-8">运行健康</TableHead>
<TableHead className="py-2 h-8">当前版本</TableHead>
<TableHead className="py-2 h-8">最近应用</TableHead>
<TableHead className="py-2 h-8">最近心跳</TableHead>
<TableHead className="py-2 h-8 text-right">操作</TableHead>
<TableRow className='border-dashed hover:bg-transparent'>
<TableHead className='py-2 h-8'>节点</TableHead>
<TableHead className='py-2 h-8'>状态</TableHead>
<TableHead className='py-2 h-8'>Version</TableHead>
<TableHead className='py-2 h-8'>运行健康</TableHead>
<TableHead className='py-2 h-8'>当前版本</TableHead>
<TableHead className='py-2 h-8'>最近应用</TableHead>
<TableHead className='py-2 h-8'>最近心跳</TableHead>
<TableHead className='py-2 h-8 text-right'>操作</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{nodes.map((node) => (
<TableRow key={node.id} className="border-dashed align-top">
<TableCell className="py-3">
<div className="space-y-1">
<div className="flex items-center gap-2">
<p className="font-medium">{node.name}</p>
<NodeStatusBadge label={getNodeTypeLabel(node.node_type)} tone="info" />
<TableRow key={node.id} className='border-dashed align-top'>
<TableCell className='py-3'>
<div className='space-y-1'>
<div className='flex items-center gap-2'>
<p className='font-medium'>{node.name}</p>
<NodeStatusBadge
label={getNodeTypeLabel(node.node_type)}
tone='info'
/>
</div>
<p className="text-xs text-muted-foreground">
<p className='text-xs text-muted-foreground'>
IP：{node.ip || '—'}
{node.ip_manual_override ? '（已锁定）' : ''}
</p>
<p className="text-xs text-muted-foreground">
<p className='text-xs text-muted-foreground'>
位置：{node.geo_name || '未配置地图点位'}
</p>
</div>
</TableCell>
<TableCell className="py-3">
<TableCell className='py-3'>
<NodeStatusBadge
label={getNodeStatusLabel(node.status)}
tone={getNodeStatusTone(node.status)}
/>
</TableCell>
<TableCell className="py-3 text-muted-foreground">
<TableCell className='py-3 text-muted-foreground'>
{node.version || 'unknown'}
</TableCell>
<TableCell className="py-3">
<TableCell className='py-3'>
{node.node_type === 'tunnel_relay' ? (
<NodeStatusBadge
label={getRelayStatusLabel(node.relay_status)}
@@ -95,13 +105,13 @@ export function NodesTable({
/>
)}
</TableCell>
<TableCell className="py-3 text-muted-foreground">
<TableCell className='py-3 text-muted-foreground'>
{node.current_version ||
(node.node_type === 'tunnel_relay' ? '实时配置' : '未应用')}
</TableCell>
<TableCell className="py-3">
<TableCell className='py-3'>
{node.node_type === 'tunnel_relay' ? (
<span className="text-sm text-muted-foreground">—</span>
<span className='text-sm text-muted-foreground'>—</span>
) : (
<NodeStatusBadge
label={getApplyLabel(node.latest_apply_result)}
@@ -109,35 +119,40 @@ export function NodesTable({
/>
)}
</TableCell>
<TableCell className="py-3 text-muted-foreground">
<TableCell className='py-3 text-muted-foreground'>
{isWSConnectedLastSeen(node.last_seen_at)
? 'WS 已连接'
: isMeaningfulTime(node.last_seen_at)
? `${formatRelativeTime(node.last_seen_at)} · ${formatDateTime(node.last_seen_at)}`
: '暂无'}
</TableCell>
<TableCell className="py-3">
<div className="flex flex-wrap justify-end gap-1">
<Button variant="outline" size="sm" className="h-7 text-xs" asChild>
<TableCell className='py-3'>
<div className='flex flex-wrap justify-end gap-1'>
<Button
variant='outline'
size='sm'
className='h-7 text-xs'
asChild
>
<Link href={`/nodes/detail?id=${node.id}`}>详情</Link>
</Button>
<Button
variant="outline"
size="sm"
className="h-7 text-xs"
variant='outline'
size='sm'
className='h-7 text-xs'
onClick={() => onEdit(node)}
>
<Pencil className="size-3 mr-1" />
<Pencil className='size-3 mr-1' />
编辑
</Button>
<Button
variant="outline"
size="sm"
className="h-7 text-xs text-destructive hover:text-destructive"
variant='outline'
size='sm'
className='h-7 text-xs text-destructive hover:text-destructive'
disabled={deletingId === node.id}
onClick={() => onDelete(node)}
>
<Trash2 className="size-3 mr-1" />
<Trash2 className='size-3 mr-1' />
删除
</Button>
</div>