99 lines
4.0 KiB
PHP
99 lines
4.0 KiB
PHP
<?php
|
|
include 'header.php';
|
|
?>
|
|
<div class="container py-5">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<div>
|
|
<h2 class="text-white fw-bold">行情中心</h2>
|
|
<p class="text-secondary small">实时监测全球主流数字货币市场价格波动</p>
|
|
</div>
|
|
<div class="input-group" style="width: 300px;">
|
|
<span class="input-group-text bg-dark border-secondary text-secondary"><i class="bi bi-search"></i></span>
|
|
<input type="text" id="market-search" class="form-control bg-dark text-white border-secondary" placeholder="搜索币种..." onkeyup="filterMarket()">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="glass-card shadow-lg">
|
|
<div class="table-responsive">
|
|
<table class="table table-dark table-hover align-middle mb-0">
|
|
<thead>
|
|
<tr class="text-secondary border-bottom border-secondary" style="background: #1e2329;">
|
|
<th class="ps-4 py-3">币种名称</th>
|
|
<th>最新价格 (USDT)</th>
|
|
<th>24h 涨跌</th>
|
|
<th>24h 最高</th>
|
|
<th>24h 最低</th>
|
|
<th>24h 成交额</th>
|
|
<th class="text-end pe-4">操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="full-market-tbody">
|
|
<tr><td colspan="7" class="text-center py-5"><div class="spinner-border text-warning"></div></td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
let allMarketData = [];
|
|
|
|
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 refreshMarket() {
|
|
try {
|
|
const res = await fetch('api.php?action=market_data');
|
|
const data = await res.json();
|
|
allMarketData = data;
|
|
renderMarket();
|
|
} catch (e) {
|
|
console.error('Market refresh failed', e);
|
|
}
|
|
}
|
|
|
|
function renderMarket() {
|
|
const search = document.getElementById('market-search').value.toLowerCase();
|
|
let html = '';
|
|
allMarketData.forEach(coin => {
|
|
if (search && !coin.symbol.toLowerCase().includes(search)) return;
|
|
|
|
const changeClass = coin.change >= 0 ? 'text-success' : 'text-danger';
|
|
const pFormatted = formatPrice(coin.price);
|
|
|
|
html += `
|
|
<tr onclick="location.href='trade.php?symbol=${coin.symbol}'" style="cursor:pointer" class="border-bottom border-secondary">
|
|
<td class="ps-4 py-3">
|
|
<div class="d-flex align-items-center">
|
|
<img src="${coin.icon_url}" class="me-3 rounded-circle" width="32" height="32" onerror="this.src='https://cryptologos.cc/logos/generic-coin-logo.png'">
|
|
<div>
|
|
<span class="fw-bold text-white d-block">${coin.symbol.replace('USDT', '')}</span>
|
|
<span class="text-secondary smaller" style="font-size: 11px;">${coin.name}</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="fw-bold fs-5">${pFormatted}</td>
|
|
<td class="${changeClass} fw-bold">${coin.change >= 0 ? '+' : ''}${coin.change}%</td>
|
|
<td>${formatPrice(coin.high || coin.price * 1.02)}</td>
|
|
<td>${formatPrice(coin.low || coin.price * 0.98)}</td>
|
|
<td class="text-secondary">$ ${parseFloat(coin.volume || 0).toLocaleString()}</td>
|
|
<td class="text-end pe-4">
|
|
<a href="trade.php?symbol=${coin.symbol}" class="btn btn-sm btn-warning px-3 fw-bold">去交易</a>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
});
|
|
document.getElementById('full-market-tbody').innerHTML = html;
|
|
}
|
|
|
|
function filterMarket() { renderMarket(); }
|
|
|
|
refreshMarket();
|
|
setInterval(refreshMarket, 3000);
|
|
</script>
|
|
<?php include 'footer.php'; ?>
|