mirror of
https://github.com/fawney19/Aether.git
synced 2026-09-12 06:00:20 +08:00
refactor(frontend): improve dialog and mobile overflow handling
This commit is contained in:
@@ -1,16 +1,16 @@
|
||||
<template>
|
||||
<div class="hidden xl:block overflow-x-auto">
|
||||
<Table>
|
||||
<Table class="min-w-[1040px] table-fixed">
|
||||
<TableHeader>
|
||||
<TableRow class="border-b border-border/60 hover:bg-transparent">
|
||||
<TableHead class="w-[28px] min-w-[28px] max-w-[28px] h-12 p-0 pl-2" />
|
||||
<TableHead class="w-[160px] h-12 font-semibold">
|
||||
<TableHead class="w-[150px] h-12 font-semibold">
|
||||
{{ legacyT('名称') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[180px] h-12 font-semibold">
|
||||
<TableHead class="w-[190px] h-12 font-semibold">
|
||||
{{ legacyT('地址') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[100px] h-12 font-semibold">
|
||||
<TableHead class="w-[90px] h-12 font-semibold">
|
||||
{{ legacyT('区域') }}
|
||||
</TableHead>
|
||||
<SortableTableHead
|
||||
@@ -32,22 +32,22 @@
|
||||
/>
|
||||
</template>
|
||||
</SortableTableHead>
|
||||
<TableHead class="w-[100px] h-12 font-semibold text-center">
|
||||
<TableHead class="w-[86px] h-12 font-semibold text-center">
|
||||
{{ legacyT('总请求') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[100px] h-12 font-semibold text-center">
|
||||
<TableHead class="w-[86px] h-12 font-semibold text-center">
|
||||
{{ legacyT('失败率') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[100px] h-12 font-semibold text-center">
|
||||
<TableHead class="w-[86px] h-12 font-semibold text-center">
|
||||
{{ legacyT('延迟') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[120px] h-12 font-semibold text-center">
|
||||
<TableHead class="w-[90px] h-12 font-semibold text-center">
|
||||
{{ legacyT('版本') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[160px] h-12 font-semibold">
|
||||
<TableHead class="w-[130px] h-12 font-semibold">
|
||||
{{ legacyT('最后心跳') }}
|
||||
</TableHead>
|
||||
<TableHead class="w-[140px] h-12 font-semibold text-center">
|
||||
<TableHead class="w-[120px] h-12 font-semibold text-center">
|
||||
{{ legacyT('操作') }}
|
||||
</TableHead>
|
||||
</TableRow>
|
||||
|
||||
@@ -21,9 +21,12 @@
|
||||
/>
|
||||
</button>
|
||||
</TableCell>
|
||||
<TableCell class="py-4">
|
||||
<div class="flex items-center gap-1.5">
|
||||
<span class="text-sm font-semibold">{{ node.name }}</span>
|
||||
<TableCell class="py-4 min-w-0">
|
||||
<div class="flex items-center gap-1.5 min-w-0">
|
||||
<span
|
||||
class="min-w-0 truncate text-sm font-semibold"
|
||||
:title="node.name"
|
||||
>{{ node.name }}</span>
|
||||
<Badge
|
||||
v-if="node.is_manual"
|
||||
variant="outline"
|
||||
@@ -48,11 +51,17 @@
|
||||
<HardwareTooltip :node="node" />
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell class="py-4">
|
||||
<code class="text-xs text-muted-foreground">{{ proxyNodeAddress(node) }}</code>
|
||||
<TableCell class="py-4 min-w-0">
|
||||
<code
|
||||
class="block min-w-0 truncate text-xs text-muted-foreground"
|
||||
:title="proxyNodeAddress(node)"
|
||||
>{{ proxyNodeAddress(node) }}</code>
|
||||
</TableCell>
|
||||
<TableCell class="py-4">
|
||||
<span class="text-sm text-muted-foreground">{{ legacyT(formatProxyNodeRegion(node.region)) }}</span>
|
||||
<TableCell class="py-4 min-w-0">
|
||||
<span
|
||||
class="block min-w-0 truncate text-sm text-muted-foreground"
|
||||
:title="legacyT(formatProxyNodeRegion(node.region))"
|
||||
>{{ legacyT(formatProxyNodeRegion(node.region)) }}</span>
|
||||
</TableCell>
|
||||
<TableCell class="py-4 text-center">
|
||||
<Badge
|
||||
@@ -78,8 +87,8 @@
|
||||
<TableCell class="py-4 text-center">
|
||||
<span class="text-sm tabular-nums">{{ node.is_manual ? '-' : proxyNodeVersion(node) }}</span>
|
||||
</TableCell>
|
||||
<TableCell class="py-4">
|
||||
<span class="text-xs text-muted-foreground">{{ formatProxyNodeTime(node.last_heartbeat_at, locale) }}</span>
|
||||
<TableCell class="py-4 min-w-0">
|
||||
<span class="block min-w-0 truncate text-xs text-muted-foreground">{{ formatProxyNodeTime(node.last_heartbeat_at, locale) }}</span>
|
||||
</TableCell>
|
||||
<TableCell class="py-4 text-center">
|
||||
<div class="flex items-center justify-center gap-0.5">
|
||||
|
||||
Reference in New Issue
Block a user