186 lines
9.5 KiB
PHP
186 lines
9.5 KiB
PHP
<?php
|
|
function renderTerminal($activeTab = 'spot') {
|
|
global $lang;
|
|
$coins = [
|
|
['symbol' => 'BTC', 'name' => 'Bitcoin', 'id' => '1/small/bitcoin.png', 'price' => '64,234.50', 'change' => '+2.45%'],
|
|
['symbol' => 'ETH', 'name' => 'Ethereum', 'id' => '279/small/ethereum.png', 'price' => '3,456.20', 'change' => '+1.12%'],
|
|
['symbol' => 'BNB', 'name' => 'BNB', 'id' => '825/small/binance-coin-logo.png', 'price' => '598.40', 'change' => '-0.56%'],
|
|
['symbol' => 'SOL', 'name' => 'Solana', 'id' => '4128/small/solana.png', 'price' => '145.20', 'change' => '+5.67%'],
|
|
['symbol' => 'XRP', 'name' => 'Ripple', 'id' => '44/small/xrp-symbol-white-128.png', 'price' => '0.62', 'change' => '-1.23%'],
|
|
['symbol' => 'ADA', 'name' => 'Cardano', 'id' => '975/small/cardano.png', 'price' => '0.58', 'change' => '+0.89%'],
|
|
['symbol' => 'DOGE', 'name' => 'Dogecoin', 'id' => '5/small/dogecoin.png', 'price' => '0.16', 'change' => '+12.4%'],
|
|
['symbol' => 'DOT', 'name' => 'Polkadot', 'id' => '12171/small/polkadot.png', 'price' => '8.45', 'change' => '-2.11%'],
|
|
['symbol' => 'MATIC', 'name' => 'Polygon', 'id' => '4713/small/matic-network.png', 'price' => '0.92', 'change' => '+1.56%'],
|
|
['symbol' => 'LINK', 'name' => 'Chainlink', 'id' => '877/small/chainlink.png', 'price' => '18.40', 'change' => '+3.22%'],
|
|
];
|
|
?>
|
|
<link rel="stylesheet" href="/assets/css/terminal.css?v=<?= time() ?>">
|
|
<div class="terminal-container">
|
|
<!-- Top Nav Tabs -->
|
|
<div class="terminal-top-nav">
|
|
<a href="/binary.php" class="terminal-tab <?= $activeTab === 'binary' ? 'active' : '' ?>"><?= __('second_contract') ?></a>
|
|
<a href="/trade.php" class="terminal-tab <?= $activeTab === 'spot' ? 'active' : '' ?>"><?= __('spot') ?></a>
|
|
<a href="/contract.php" class="terminal-tab <?= $activeTab === 'contract' ? 'active' : '' ?>"><?= __('contract') ?></a>
|
|
</div>
|
|
|
|
<div class="terminal-main">
|
|
<!-- Left Sidebar -->
|
|
<div class="terminal-sidebar">
|
|
<div class="sidebar-search">
|
|
<input type="text" placeholder="<?= __('coin') ?> / USDT">
|
|
</div>
|
|
<div class="coin-list-container">
|
|
<?php foreach ($coins as $c): ?>
|
|
<div class="coin-row">
|
|
<div class="coin-info">
|
|
<img src="https://assets.coingecko.com/coins/images/<?= $c['id'] ?>" alt="<?= $c['symbol'] ?>">
|
|
<div>
|
|
<span class="symbol"><?= $c['symbol'] ?></span>
|
|
<span class="change <?= strpos($c['change'], '+') !== false ? 'text-success' : 'text-danger' ?>"><?= $c['change'] ?></span>
|
|
</div>
|
|
</div>
|
|
<div class="price"><?= $c['price'] ?></div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Center Content -->
|
|
<div class="terminal-content">
|
|
<div class="content-header">
|
|
<div class="header-pair">BTC/USDT</div>
|
|
<div class="header-stat">
|
|
<label><?= __('last_price') ?></label>
|
|
<span class="text-success">64,234.50</span>
|
|
</div>
|
|
<div class="header-stat">
|
|
<label>24h <?= __('change_24h') ?></label>
|
|
<span class="text-success">+2.45%</span>
|
|
</div>
|
|
<div class="header-stat">
|
|
<label>24h High</label>
|
|
<span>65,120.00</span>
|
|
</div>
|
|
<div class="header-stat">
|
|
<label>24h Low</label>
|
|
<span>63,450.00</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="kline-container">
|
|
<!-- Simulation of K-line -->
|
|
<div id="tradingview_widget" style="height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; background: #000;">
|
|
<span style="color: #333; font-size: 24px; font-weight: bold;">TRADING VIEW CHART</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="trading-panels">
|
|
<div class="order-form-container">
|
|
<div class="order-form-tabs">
|
|
<button class="active">Limit</button>
|
|
<button>Market</button>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-6">
|
|
<div class="input-group-custom">
|
|
<label>Buy Price</label>
|
|
<div class="input-wrapper">
|
|
<input type="number" value="64234.50">
|
|
<span class="suffix">USDT</span>
|
|
</div>
|
|
</div>
|
|
<div class="input-group-custom">
|
|
<label>Amount</label>
|
|
<div class="input-wrapper">
|
|
<input type="number" placeholder="0.00">
|
|
<span class="suffix">BTC</span>
|
|
</div>
|
|
</div>
|
|
<button class="btn-buy">Buy BTC</button>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="input-group-custom">
|
|
<label>Sell Price</label>
|
|
<div class="input-wrapper">
|
|
<input type="number" value="64234.50">
|
|
<span class="suffix">USDT</span>
|
|
</div>
|
|
</div>
|
|
<div class="input-group-custom">
|
|
<label>Amount</label>
|
|
<div class="input-wrapper">
|
|
<input type="number" placeholder="0.00">
|
|
<span class="suffix">BTC</span>
|
|
</div>
|
|
</div>
|
|
<button class="btn-sell">Sell BTC</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="order-history p-3">
|
|
<h6 class="mb-3">Open Orders</h6>
|
|
<table class="table table-dark table-sm small">
|
|
<thead>
|
|
<tr class="text-muted">
|
|
<th>Time</th>
|
|
<th>Type</th>
|
|
<th>Side</th>
|
|
<th>Price</th>
|
|
<th>Amount</th>
|
|
<th>Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr><td colspan="6" class="text-center py-4 text-muted">No records found</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Right Sidebar: Order Book -->
|
|
<div class="terminal-right-sidebar">
|
|
<div class="order-book">
|
|
<div class="ob-header">
|
|
<span>Price(USDT)</span>
|
|
<span>Amount(BTC)</span>
|
|
</div>
|
|
<div class="ob-list asks">
|
|
<?php for($i=0;$i<10;$i++):
|
|
$p = 64235 + $i * 1.5;
|
|
$a = rand(10, 1000) / 1000;
|
|
$w = rand(10, 90);
|
|
?>
|
|
<div class="ob-row">
|
|
<span class="price"><?= number_format($p, 2) ?></span>
|
|
<span class="amount"><?= number_format($a, 4) ?></span>
|
|
<div class="ob-row-bg" style="width: <?= $w ?>%"></div>
|
|
</div>
|
|
<?php endfor; ?>
|
|
</div>
|
|
<div class="ob-mid-price">
|
|
<span class="val text-success">64,234.50</span>
|
|
<span class="small text-muted">≈ $64,234.50</span>
|
|
</div>
|
|
<div class="ob-list bids">
|
|
<?php for($i=0;$i<10;$i++):
|
|
$p = 64233 - $i * 1.5;
|
|
$a = rand(10, 1000) / 1000;
|
|
$w = rand(10, 90);
|
|
?>
|
|
<div class="ob-row">
|
|
<span class="price"><?= number_format($p, 2) ?></span>
|
|
<span class="amount"><?= number_format($a, 4) ?></span>
|
|
<div class="ob-row-bg" style="width: <?= $w ?>%"></div>
|
|
</div>
|
|
<?php endfor; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php
|
|
}
|
|
?>
|