49 lines
2.0 KiB
TypeScript
49 lines
2.0 KiB
TypeScript
import { OddsLineMovementChart } from '@/components/OddsLineMovementChart';
|
||
|
||
const samples = [
|
||
{ time: '12:00', bookmaker: 'Bet365', odds: 1.82 },
|
||
{ time: '12:30', bookmaker: 'Bet365', odds: 1.79 },
|
||
{ time: '13:00', bookmaker: 'Bet365', odds: 1.84 },
|
||
{ time: '12:00', bookmaker: 'Pinnacle', odds: 1.8 },
|
||
{ time: '12:30', bookmaker: 'Pinnacle', odds: 1.77 },
|
||
{ time: '13:00', bookmaker: 'Pinnacle', odds: 1.85 },
|
||
{ time: '12:00', bookmaker: 'DraftKings', odds: 1.83 },
|
||
{ time: '12:30', bookmaker: 'DraftKings', odds: 1.81 },
|
||
{ time: '13:00', bookmaker: 'DraftKings', odds: 1.8 },
|
||
];
|
||
|
||
export default function OddsPage() {
|
||
return (
|
||
<div className="space-y-4">
|
||
<h2 className="dot-matrix text-2xl text-[#7d2a15]">跨平台賠率比較矩陣</h2>
|
||
<section className="panel-glow rounded-2xl p-5">
|
||
<p className="text-sm text-[#7a5b46]">此頁面接入後端 odds API 與 Redis 快取後，可顯示即時最高賠率、套利空間與賠率走勢線。</p>
|
||
<div className="mt-5 overflow-auto rounded-xl border border-[#d8b58c] bg-white/65">
|
||
<table className="min-w-full text-sm">
|
||
<thead>
|
||
<tr className="bg-[#f3e3ca] text-left">
|
||
<th className="px-3 py-2">場次</th>
|
||
<th className="px-3 py-2">Bet365</th>
|
||
<th className="px-3 py-2">Pinnacle</th>
|
||
<th className="px-3 py-2">DraftKings</th>
|
||
<th className="px-3 py-2">套利</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td className="px-3 py-2">德國 vs 西班牙</td>
|
||
<td className="px-3 py-2">1.92</td>
|
||
<td className="px-3 py-2">1.90</td>
|
||
<td className="px-3 py-2">1.91</td>
|
||
<td className="px-3 py-2 text-emerald-700">低</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</section>
|
||
|
||
<OddsLineMovementChart data={samples} />
|
||
</div>
|
||
);
|
||
}
|