feat: add countdown to trades table

This commit is contained in:
root 2026-02-26 10:50:19 +00:00
parent f2b4e9d076
commit eae31eaf01

View File

@ -24,6 +24,27 @@ function calcExpectedProfit(direction: string, entryPrice: number, betAmount: nu
return betAmount * (1 / price - 1); return betAmount * (1 / price - 1);
} }
function renderCountdown(endDateStr: unknown) {
const originalDate = String(endDateStr).slice(0, 10);
const endDate = new Date(String(endDateStr));
if (isNaN(endDate.getTime())) return <span className="text-muted-foreground">{originalDate}</span>;
const now = new Date();
const diffMs = endDate.getTime() - now.getTime();
const diffDays = diffMs / (1000 * 60 * 60 * 24);
if (diffMs <= 0) {
return <span className="text-muted-foreground" title={originalDate}></span>;
} else if (diffDays > 7) {
return <span className="text-orange-400" title={originalDate}>{Math.floor(diffDays)}</span>;
} else if (diffDays >= 3) {
return <span className="text-yellow-400" title={originalDate}>{Math.floor(diffDays)}</span>;
} else {
const days = Math.floor(diffDays);
const hours = Math.floor((diffMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
return <span className="text-red-400 font-bold animate-pulse" title={originalDate}>{days} {hours}h后</span>;
}
}
const statusMap: Record<string, string> = { open: "进行中", won: "盈利 ✅", lost: "亏损 ❌" }; const statusMap: Record<string, string> = { open: "进行中", won: "盈利 ✅", lost: "亏损 ❌" };
const statusVariant: Record<string, "default" | "secondary" | "destructive"> = { const statusVariant: Record<string, "default" | "secondary" | "destructive"> = {
open: "secondary", won: "default", lost: "destructive" open: "secondary", won: "default", lost: "destructive"
@ -127,7 +148,7 @@ export default async function TradesPage() {
<span className="text-blue-400">+${expProfit.toFixed(2)}</span> <span className="text-blue-400">+${expProfit.toFixed(2)}</span>
) : <span className="text-muted-foreground">-</span>} ) : <span className="text-muted-foreground">-</span>}
</td> </td>
<td className="px-3 py-2 font-mono whitespace-nowrap text-muted-foreground">{String(r[5]).slice(0, 10)}</td> <td className="px-3 py-2 font-mono whitespace-nowrap">{renderCountdown(r[5])}</td>
<td className="px-3 py-2 whitespace-nowrap"> <td className="px-3 py-2 whitespace-nowrap">
<Badge variant={statusVariant[r[6]] ?? "secondary"} className="text-[10px] px-1.5 py-0"> <Badge variant={statusVariant[r[6]] ?? "secondary"} className="text-[10px] px-1.5 py-0">
{statusMap[r[6]] ?? r[6]} {statusMap[r[6]] ?? r[6]}