100 lines
4.9 KiB
PHP
100 lines
4.9 KiB
PHP
<?php
|
|
include_once 'config.php';
|
|
include 'header.php';
|
|
?>
|
|
<!-- Hero Carousel Section -->
|
|
<div id="heroCarousel" class="carousel slide" data-bs-ride="carousel">
|
|
<div class="carousel-indicators">
|
|
<button type="button" data-bs-target="#heroCarousel" data-bs-slide-to="0" class="active"></button>
|
|
<button type="button" data-bs-target="#heroCarousel" data-bs-slide-to="1"></button>
|
|
<button type="button" data-bs-target="#heroCarousel" data-bs-slide-to="2"></button>
|
|
</div>
|
|
<div class="carousel-inner">
|
|
<div class="carousel-item active" style="height: 550px; background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('https://images.unsplash.com/photo-1621761191319-c6fb62004040?q=80&w=2070&auto=format&fit=crop'); background-size: cover; background-position: center;">
|
|
<div class="container h-100 d-flex align-items-center">
|
|
<div class="row w-100 align-items-center">
|
|
<div class="col-lg-7">
|
|
<h1 class="display-3 fw-bold mb-4">开启您的<br><span style="color: var(--accent-color);">加密货币</span>之旅</h1>
|
|
<p class="lead text-light mb-5">在全球最受信任的交易平台买卖和存储加密货币。<?php echo $project_name; ?> 为您提供安全、稳定、高效的服务。</p>
|
|
<div class="d-flex gap-3">
|
|
<a href="/register.php" class="btn btn-warning btn-lg px-5 fw-bold">立即注册</a>
|
|
<a href="/trade.php" class="btn btn-outline-light btn-lg px-5 fw-bold">开始交易</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="container" style="margin-top: -50px; position: relative; z-index: 10;">
|
|
<div class="glass-card p-4 d-flex flex-wrap justify-content-around align-items-center text-center shadow-lg">
|
|
<div class="download-item">
|
|
<h6 class="text-secondary mb-2 small fw-bold">iOS 下载</h6>
|
|
<button class="btn btn-outline-light border-secondary px-4"><i class="bi bi-apple me-2 text-warning"></i>App Store</button>
|
|
</div>
|
|
<div class="download-item">
|
|
<h6 class="text-secondary mb-2 small fw-bold">安卓下载</h6>
|
|
<button class="btn btn-outline-light border-secondary px-4"><i class="bi bi-android2 me-2 text-warning"></i>Android</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Market Section -->
|
|
<section id="markets" class="container py-5 mt-4">
|
|
<div class="d-flex justify-content-between align-items-end mb-4">
|
|
<div>
|
|
<h2 class="fw-bold">热门行情</h2>
|
|
<p class="text-secondary mb-0">实时获取全球顶级加密货币价格走势</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-dark table-hover align-middle">
|
|
<thead class="text-secondary">
|
|
<tr style="background: #1e2329;">
|
|
<th scope="col" class="ps-4 py-3">币种</th>
|
|
<th scope="col" class="py-3">价格</th>
|
|
<th scope="col" class="py-3">24h 涨跌</th>
|
|
<th scope="col" class="text-end pe-4 py-3">操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="market-list">
|
|
<tr>
|
|
<td colspan="4" class="text-center py-5">
|
|
<div class="spinner-border text-warning" role="status"></div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<script>
|
|
const symbols = ['BTCUSDT', 'ETHUSDT', 'BNBUSDT', 'SOLUSDT', 'XRPUSDT'];
|
|
async function fetchMarkets() {
|
|
try {
|
|
const response = await fetch('https://api.binance.com/api/v3/ticker/24hr?symbols=' + JSON.stringify(symbols));
|
|
const data = await response.json();
|
|
const list = document.getElementById('market-list');
|
|
list.innerHTML = '';
|
|
data.forEach(coin => {
|
|
const symbolBase = coin.symbol.replace('USDT', '');
|
|
const change = parseFloat(coin.priceChangePercent);
|
|
list.innerHTML += `
|
|
<tr>
|
|
<td class="ps-4 py-3"><span class="fw-bold text-white">${symbolBase}</span>/USDT</td>
|
|
<td class="fw-bold py-3 text-white">$${parseFloat(coin.lastPrice).toLocaleString()}</td>
|
|
<td class="${change >= 0 ? 'text-success' : 'text-danger'} py-3 fw-bold">${change.toFixed(2)}%</td>
|
|
<td class="text-end pe-4 py-3"><a href="/trade.php?symbol=${coin.symbol}" class="btn btn-sm btn-warning fw-bold">交易</a></td>
|
|
</tr>
|
|
`;
|
|
});
|
|
} catch (e) { console.error(e); }
|
|
}
|
|
fetchMarkets();
|
|
setInterval(fetchMarkets, 5000);
|
|
</script>
|
|
<?php include 'footer.php'; ?>
|