From 8bff7b19bd9e87320834a61abdafdacc6f7eeebc Mon Sep 17 00:00:00 2001 From: root Date: Thu, 26 Feb 2026 12:42:29 +0000 Subject: [PATCH] feat: add history and about pages --- frontend/app/about/page.tsx | 81 +++++++++++++++++++++++++++++++ frontend/app/history/page.tsx | 91 +++++++++++++++++++++++++++++++++++ 2 files changed, 172 insertions(+) create mode 100644 frontend/app/about/page.tsx create mode 100644 frontend/app/history/page.tsx diff --git a/frontend/app/about/page.tsx b/frontend/app/about/page.tsx new file mode 100644 index 0000000..87d143a --- /dev/null +++ b/frontend/app/about/page.tsx @@ -0,0 +1,81 @@ +export default function AboutPage() { + return ( +
+
+

策略说明

+

资金费率套利原理与历史数据

+
+ +
+

策略原理

+

+ 永续合约每8小时结算一次资金费率。多头多时，多头付钱给空头（费率为正）；空头多时，空头付钱给多头（费率为负）。 +

+

+ 套利做法：现货买入 + 永续做空，完全对冲币价风险，净收资金费率（USDT结算）。 +

+
+
买入 1 BTC 现货（$96,000）
+
做空 1 BTC 永续（$96,000，1倍杠杆）
+
───────────────────────
+
BTC涨跌：两边对冲，净盈亏 = 0
+
资金费率：每8小时直接收 USDT ✓
+
+
+ +
+

历史年化数据（2019-2026，露露×小周15轮验证）

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
资产全周期毛年化PM净年化负费率占比
BTC12.33%11.67%13.07%
ETH14.87%14.09%12.17%
50/50组合13.81%13.08%—
+

PM = Portfolio Margin模式，资金利用率约95%。数据来源：Binance fapi/v1/fundingRate官方API

+
+ +
+

风险说明

+
+ {[ + { level: "🟡 中", risk: "市场周期", desc: "熊市年化可降至0-4%，但不亏本金" }, + { level: "🟢 低", risk: "费率持续为负", desc: "历史负费率仅12-13%，长期均值为正" }, + { level: "🟡 中", risk: "交易所对手方", desc: "FTX教训，建议考虑分散" }, + { level: "🟢 低", risk: "爆仓风险", desc: "1倍杠杆+对冲，理论需BTC翻倍才触发" }, + { level: "🟢 低", risk: "基差波动", desc: "长期持有不影响，只影响平仓时机" }, + ].map((r, i) => ( +
+ {r.level} + {r.risk} + {r.desc} +
+ ))} +
+
+
+ ); +} diff --git a/frontend/app/history/page.tsx b/frontend/app/history/page.tsx new file mode 100644 index 0000000..63b633f --- /dev/null +++ b/frontend/app/history/page.tsx @@ -0,0 +1,91 @@ +"use client"; + +import { useEffect, useState } from "react"; +import { HistoryPoint } from "@/lib/api"; +import { + LineChart, Line, XAxis, YAxis, Tooltip, Legend, + ResponsiveContainer, ReferenceLine +} from "recharts"; + +export default function HistoryPage() { + const [btc, setBtc] = useState([]); + const [eth, setEth] = useState([]); + const [loading, setLoading] = useState(true); + + useEffect(() => { + fetch("/api/history") + .then((r) => r.json()) + .then((d) => { setBtc(d.BTC ?? []); setEth(d.ETH ?? []); setLoading(false); }) + .catch(() => setLoading(false)); + }, []); + + const btcMap = new Map(btc.map((p) => [p.timestamp.slice(0, 13), p.fundingRate * 100])); + const ethMap = new Map(eth.map((p) => [p.timestamp.slice(0, 13), p.fundingRate * 100])); + const allTimes = Array.from(new Set([...btcMap.keys(), ...ethMap.keys()])).sort(); + const chartData = allTimes.slice(-42).map((t) => ({ + time: t.slice(5).replace("T", " "), + BTC: btcMap.get(t) ?? null, + ETH: ethMap.get(t) ?? null, + })); + + const tableData = allTimes.slice().reverse().slice(0, 50).map((t) => ({ + time: t.replace("T", " "), + btc: btcMap.get(t), + eth: ethMap.get(t), + })); + + return ( +
+
+

历史费率

+

过去7天 BTC / ETH 资金费率记录

+
+ + {loading ? ( +
加载中...
+ ) : ( + <> +
+

费率走势（过去7天）

+ + + + `${v.toFixed(3)}%`} width={60} /> + `${v.toFixed(4)}%`} contentStyle={{ background: "#1e293b", border: "1px solid #475569", borderRadius: 8 }} /> + + + + + + +
+ +
+ + + + + + + + + + {tableData.map((row, i) => ( + + + + + + ))} + +
时间BTC 费率ETH 费率
{row.time}= 0 ? "text-emerald-400" : "text-red-400"}`}> + {row.btc != null ? `${row.btc.toFixed(4)}%` : "--"} + = 0 ? "text-emerald-400" : "text-red-400"}`}> + {row.eth != null ? `${row.eth.toFixed(4)}%` : "--"} +
+
+ + )} +
+ ); +}