164 lines
7.6 KiB
PHP
164 lines
7.6 KiB
PHP
<?php
|
||
include 'header.php';
|
||
?>
|
||
|
||
<!-- Hero Section -->
|
||
<section class="py-5" style="background: radial-gradient(circle at top right, #1e2329 0%, #0b0e11 100%); min-height: 60vh; display: flex; align-items: center;">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-6">
|
||
<h1 class="display-4 fw-bold text-white mb-4">开启您的数字资产 <span class="text-warning">交易之旅</span></h1>
|
||
<p class="lead text-secondary mb-5">全球信赖的加密资产交易平台，提供极速、安全、专业的数字资产交易服务。支持现货及永续合约交易。</p>
|
||
<div class="d-flex gap-3">
|
||
<?php if(!isset($_SESSION['user_id'])): ?>
|
||
<a href="register.php" class="btn btn-warning btn-lg px-5 fw-bold">立即注册</a>
|
||
<?php else: ?>
|
||
<a href="trade.php" class="btn btn-warning btn-lg px-5 fw-bold">进入交易</a>
|
||
<?php endif; ?>
|
||
<a href="#markets" class="btn btn-outline-light btn-lg px-5">查看行情</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 d-none d-lg-block">
|
||
<img src="https://public.bnbstatic.com/image/cms/content/body_0b0e11.png" class="img-fluid" alt="Hero">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Stats Bar -->
|
||
<div class="container mt-n5 position-relative" style="z-index: 10;">
|
||
<div class="glass-card p-4 shadow-lg" style="background: rgba(30, 32, 38, 0.9); border: 1px solid #3b4149;">
|
||
<div class="row text-center g-4">
|
||
<div class="col-md-3">
|
||
<div class="text-secondary small mb-1">24h 交易量</div>
|
||
<div class="fs-4 fw-bold text-white">$76.2B</div>
|
||
</div>
|
||
<div class="col-md-3 border-start border-secondary">
|
||
<div class="text-secondary small mb-1">主流币种</div>
|
||
<div class="fs-4 fw-bold text-white">350+</div>
|
||
</div>
|
||
<div class="col-md-3 border-start border-secondary">
|
||
<div class="text-secondary small mb-1">注册用户</div>
|
||
<div class="fs-4 fw-bold text-white">120M+</div>
|
||
</div>
|
||
<div class="col-md-3 border-start border-secondary">
|
||
<div class="text-secondary small mb-1">最低费率</div>
|
||
<div class="fs-4 fw-bold text-white">0.10%</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Market Table -->
|
||
<section id="markets" class="py-5 mt-5">
|
||
<div class="container">
|
||
<div class="d-flex justify-content-between align-items-end mb-4">
|
||
<div>
|
||
<h2 class="fw-bold text-white">热门市场</h2>
|
||
<p class="text-secondary mb-0">实时行情，全球同步</p>
|
||
</div>
|
||
<a href="market.php" class="text-warning text-decoration-none fw-bold">查看行情中心 <i class="bi bi-arrow-right"></i></a>
|
||
</div>
|
||
|
||
<div class="glass-card overflow-hidden" style="border: 1px solid #2b2f36;">
|
||
<table class="table table-dark table-hover mb-0 align-middle">
|
||
<thead>
|
||
<tr class="text-secondary" style="background: #1e2329;">
|
||
<th class="ps-4 py-3">名称</th>
|
||
<th class="py-3">最新价 (USDT)</th>
|
||
<th class="py-3">24h 涨跌</th>
|
||
<th class="py-3">24h 最高 / 最低</th>
|
||
<th class="py-3 text-end pe-4">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="market-tbody">
|
||
<tr><td colspan="5" class="text-center py-5"><div class="spinner-border text-warning"></div></td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Features -->
|
||
<section class="py-5" style="background-color: #0b0e11;">
|
||
<div class="container">
|
||
<div class="row g-4 text-center">
|
||
<div class="col-md-4">
|
||
<div class="p-4 h-100 glass-card">
|
||
<i class="bi bi-shield-check display-4 text-warning mb-3"></i>
|
||
<h4 class="text-white">安全可靠</h4>
|
||
<p class="text-secondary">采用多重安全防护机制，冷热钱包分离，保障您的资产安全。符合国际最高合规标准。</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="p-4 h-100 glass-card">
|
||
<i class="bi bi-lightning-charge display-4 text-warning mb-3"></i>
|
||
<h4 class="text-white">极速撮合</h4>
|
||
<p class="text-secondary">自研高性能撮合引擎，支持百万级并发交易，告别卡顿延迟。平均响应时间小于10ms。</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="p-4 h-100 glass-card">
|
||
<i class="bi bi-headset display-4 text-warning mb-3"></i>
|
||
<h4 class="text-white">专业支持</h4>
|
||
<p class="text-secondary">7*24小时多语种在线客服，随时解答您的任何疑问。为您提供保驾护航的交易环境。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<script>
|
||
function formatPrice(p) {
|
||
p = parseFloat(p);
|
||
if (p < 0.0001) return p.toFixed(8);
|
||
if (p < 0.01) return p.toFixed(6);
|
||
if (p < 1) return p.toFixed(4);
|
||
return p.toFixed(2);
|
||
}
|
||
|
||
async function loadMarket() {
|
||
try {
|
||
const res = await fetch('api.php?action=market_data');
|
||
const data = await res.json();
|
||
const tbody = document.getElementById('market-tbody');
|
||
let html = '';
|
||
|
||
data.slice(0, 8).forEach(coin => {
|
||
const changeClass = coin.change >= 0 ? 'text-success' : 'text-danger';
|
||
const pFormatted = formatPrice(coin.price);
|
||
html += `
|
||
<tr style="cursor: pointer;" onclick="location.href='trade.php?symbol=${coin.symbol}'" class="border-bottom border-secondary">
|
||
<td class="ps-4 py-4">
|
||
<div class="d-flex align-items-center">
|
||
<img src="${coin.icon_url}" class="me-3 rounded-circle" style="width:32px; height:32px;" onerror="this.src='https://cryptologos.cc/logos/generic-coin-logo.png'">
|
||
<div>
|
||
<div class="fw-bold text-white">${coin.symbol.replace('USDT', '')}</div>
|
||
<div class="text-secondary small" style="font-size: 11px;">${coin.name}</div>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
<td><span class="fw-bold fs-5">${pFormatted}</span></td>
|
||
<td><span class="${changeClass} fw-bold">${coin.change >= 0 ? '+' : ''}${coin.change}%</span></td>
|
||
<td>
|
||
<div class="smaller text-white">${formatPrice(coin.high || coin.price*1.01)}</div>
|
||
<div class="smaller text-secondary">${formatPrice(coin.low || coin.price*0.99)}</div>
|
||
</td>
|
||
<td class="text-end pe-4">
|
||
<a href="trade.php?symbol=${coin.symbol}" class="btn btn-sm btn-outline-warning px-3 fw-bold">立即交易</a>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
});
|
||
tbody.innerHTML = html;
|
||
} catch (e) {
|
||
console.error('Market load failed', e);
|
||
}
|
||
}
|
||
|
||
loadMarket();
|
||
setInterval(loadMarket, 5000);
|
||
</script>
|
||
|
||
<?php include 'footer.php'; ?>
|