xufuhan/assetx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

大改变

Browse Source
This commit is contained in:
YoRHa
2026-02-03 19:56:21 +08:00
parent 4b13d255bc
commit 9aa9e44295
545 changed files with 8712 additions and 16168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
components/alp/LiquidityAllocationTable.tsx Normal file
View File

@@ -0,0 +1,135 @@
"use client";
import { useApp } from "@/contexts/AppContext";
export default function LiquidityAllocationTable() {
const { t } = useApp();
const allocations = [
{
icon: "GY",
iconBg: "linear-gradient(135deg, #FF8904 0%, #F54900 100%)",
name: "YT-GY",
category: t("alp.quantStrategy"),
poolSize: "$25,000",
poolAmount: "24,1938 YTGY",
currentWeight: "47%",
targetWeight: "33%",
currentPrice: "$1.03",
},
{
icon: "LOGO",
iconBg: "linear-gradient(135deg, #00BBA7 0%, #007A55 100%)",
name: "YT-GY",
category: t("alp.quantStrategy"),
poolSize: "$25,000",
poolAmount: "24,1938 YTGY",
currentWeight: "47%",
targetWeight: "33%",
currentPrice: "$1.03",
},
{
icon: "LOGO",
iconBg: "linear-gradient(135deg, #1447E6 0%, #032BBD 100%)",
name: "YT-GY",
category: t("alp.quantStrategy"),
poolSize: "$25,000",
poolAmount: "24,1938 YTGY",
currentWeight: "47%",
targetWeight: "33%",
currentPrice: "$1.03",
},
];
return (
<div className="flex flex-col gap-3">
{/* Title */}
<h2 className="text-heading-h3 font-bold text-text-primary dark:text-white">
{t("alp.liquidityAllocation")}
</h2>
{/* Table */}
<div className="bg-bg-surface dark:bg-gray-800 rounded-3xl border border-border-gray dark:border-gray-700 overflow-hidden">
<div className="flex flex-col">
{/* Header */}
<div className="flex border-b border-border-gray dark:border-gray-700 flex-shrink-0">
<div className="flex-1 px-6 py-4">
<div className="text-caption-tiny font-medium text-[#4b5563] dark:text-gray-400">
{t("alp.token")}
</div>
</div>
<div className="flex-1 px-6 py-4">
<div className="text-caption-tiny font-medium text-[#4b5563] dark:text-gray-400">
{t("alp.poolSize")}
</div>
</div>
<div className="flex-1 px-6 py-4">
<div className="text-caption-tiny font-medium text-[#4b5563] dark:text-gray-400">
{t("alp.currentTargetWeight")}
</div>
</div>
<div className="flex-1 px-6 py-4">
<div className="text-caption-tiny font-medium text-[#4b5563] dark:text-gray-400">
{t("alp.currentPrice")}
</div>
</div>
</div>
{/* Body */}
{allocations.map((item, index) => (
<div
key={index}
className="flex items-center border-b border-border-gray dark:border-gray-700"
>
{/* Token Column */}
<div className="flex-1 px-6 py-4 flex items-center gap-3">
<div
className="w-8 h-8 rounded-full flex items-center justify-center text-white text-[13.57px] font-bold"
style={{ background: item.iconBg }}
>
{item.icon}
</div>
<div className="flex flex-col">
<span className="text-body-small font-bold text-text-primary dark:text-white">
{item.name}
</span>
<span className="text-caption-tiny font-regular text-text-tertiary dark:text-gray-400">
{item.category}
</span>
</div>
</div>
{/* Pool Size Column */}
<div className="flex-1 px-6 py-4">
<div className="flex flex-col">
<span className="text-body-small font-bold text-text-primary dark:text-white">
{item.poolSize}
</span>
<span className="text-caption-tiny font-regular text-[#6b7280] dark:text-gray-400">
{item.poolAmount}
</span>
</div>
</div>
{/* Weight Column */}
<div className="flex-1 px-6 py-4">
<span className="text-body-small font-bold">
<span className="text-text-primary dark:text-white">{item.currentWeight}</span>
<span className="text-text-tertiary dark:text-gray-400"> / </span>
<span className="text-text-primary dark:text-white">{item.targetWeight}</span>
</span>
</div>
{/* Price Column */}
<div className="flex-1 px-6 py-4">
<span className="text-body-small font-bold text-text-primary dark:text-white">
{item.currentPrice}
</span>
</div>
</div>
))}
</div>
</div>
</div>
);
}