fix: 修复手动输入地址后购买按钮不显示的问题

- 在 EVMPurchasePanel 中添加 manualAddress 状态
- 手动输入地址确认后显示购买按钮(提示连接钱包完成购买)
- 添加 effectiveAddress 和 isManualMode 辅助变量
- 钱包信息区域支持手动地址显示(琥珀色样式区分)
This commit is contained in:
NAC Admin 2026-03-21 01:56:31 +08:00
parent 896146f9aa
commit 5136b590de
1 changed files with 35 additions and 8 deletions

View File

@ -320,8 +320,12 @@ function EVMPurchasePanel({ network, lang, wallet }: { network: "BSC" | "ETH"; l
const { purchaseState, buyWithUSDT, reset, calcTokens, getUsdtBalance } = usePresale(wallet, network);
const [usdtInput, setUsdtInput] = useState("100");
const [usdtBalance, setUsdtBalance] = useState<number | null>(null);
const [manualAddress, setManualAddress] = useState<string | null>(null);
const targetChainId = CONTRACTS[network].chainId;
const isWrongNetwork = wallet.isConnected && wallet.chainId !== targetChainId;
// effectiveAddress: 真实钱包地址 或 手动输入的地址
const effectiveAddress = wallet.address || manualAddress;
const isManualMode = !wallet.isConnected && !!manualAddress;
const fetchBalance = useCallback(async () => {
const bal = await getUsdtBalance();
@ -388,14 +392,15 @@ function EVMPurchasePanel({ network, lang, wallet }: { network: "BSC" | "ETH"; l
return (
<div className="space-y-4">
{/* Wallet info — only shown when connected */}
{wallet.isConnected && !isWrongNetwork && (
<div className="flex items-center justify-between px-3 py-2 rounded-lg" style={{ background: "rgba(255,255,255,0.04)", border: "1px solid rgba(255,255,255,0.08)" }}>
{/* Wallet info — shown when connected or manual address entered */}
{effectiveAddress && !isWrongNetwork && (
<div className="flex items-center justify-between px-3 py-2 rounded-lg" style={{ background: isManualMode ? "rgba(240,180,41,0.06)" : "rgba(255,255,255,0.04)", border: isManualMode ? "1px solid rgba(240,180,41,0.25)" : "1px solid rgba(255,255,255,0.08)" }}>
<div className="flex items-center gap-2">
<div className="w-2 h-2 rounded-full bg-green-400" style={{ boxShadow: "0 0 6px #00e676" }} />
<span className="text-xs text-white/60 counter-digit">{shortenAddress(wallet.address || "")}</span>
<div className="w-2 h-2 rounded-full" style={{ background: isManualMode ? "#f0b429" : "#00e676", boxShadow: isManualMode ? "0 0 6px #f0b429" : "0 0 6px #00e676" }} />
<span className="text-xs text-white/60 counter-digit">{shortenAddress(effectiveAddress)}</span>
{isManualMode && <span className="text-xs text-amber-400/70">{lang === "zh" ? "(手动地址)" : "(manual)"}</span>}
</div>
{usdtBalance !== null && (
{usdtBalance !== null && !isManualMode && (
<span className="text-xs text-white/50">{t("buy_balance")} <span className="text-white/80 counter-digit">{usdtBalance.toFixed(2)} USDT</span></span>
)}
</div>
@ -482,14 +487,15 @@ function EVMPurchasePanel({ network, lang, wallet }: { network: "BSC" | "ETH"; l
)}
{/* Buy Button — or Connect Wallet if not connected */}
{!wallet.isConnected ? (
{!wallet.isConnected && !manualAddress ? (
<div className="space-y-3">
<p className="text-sm text-white/60 text-center">{t("buy_connect_msg")}</p>
<WalletSelector
lang={lang}
connectedAddress={wallet.address ?? undefined}
onAddressDetected={(addr) => {
toast.success(lang === "zh" ? `已连接: ${addr.slice(0, 6)}...${addr.slice(-4)}` : `Connected: ${addr.slice(0, 6)}...${addr.slice(-4)}`);
setManualAddress(addr);
toast.success(lang === "zh" ? `地址已确认: ${addr.slice(0, 6)}...${addr.slice(-4)}` : `Address confirmed: ${addr.slice(0, 6)}...${addr.slice(-4)}`);
}}
compact
/>
@ -505,6 +511,27 @@ function EVMPurchasePanel({ network, lang, wallet }: { network: "BSC" | "ETH"; l
? `切换到 ${CONTRACTS[network].chainName} 后即可购买`
: `Switch to ${CONTRACTS[network].chainName} to Buy`}
</button>
) : isManualMode ? (
<div className="space-y-2">
<div className="rounded-xl p-3 text-center" style={{ background: "rgba(240,180,41,0.06)", border: "1px solid rgba(240,180,41,0.2)" }}>
<p className="text-xs text-amber-400/80 mb-1">
{lang === "zh" ? "⚠️ 手动地址模式:需连接钱包才能完成链上购买" : "⚠️ Manual mode: Connect wallet to complete on-chain purchase"}
</p>
<p className="text-xs text-white/40">
{lang === "zh" ? "请点击右上角连接您的钱包" : "Please connect your wallet via the top-right button"}
</p>
</div>
<button
onClick={() => {
toast.info(lang === "zh" ? "请先连接钱包以完成购买" : "Please connect your wallet to complete the purchase");
}}
disabled={!isValidAmount}
className="btn-primary-nac w-full py-4 rounded-xl text-base font-bold opacity-70"
style={{ fontFamily: "'Space Grotesk', sans-serif" }}
>
{lang === "zh" ? `连接钱包购买 ${formatNumber(tokenAmount)} XIC` : `Connect Wallet to Buy ${formatNumber(tokenAmount)} XIC`}
</button>
</div>
) : (
<button
onClick={handleBuy}