258 lines
12 KiB
HTML
258 lines
12 KiB
HTML
{{template "components/header.html" .}}
|
|
{{template "components/preloader.html" .}}
|
|
<div id="main-wrapper">
|
|
<!-- Sidebar Start -->
|
|
{{template "components/sidebar.html" .}}
|
|
<!-- Sidebar End -->
|
|
<div class="page-wrapper">
|
|
<!-- Header Start -->
|
|
{{template "components/topbar.html" .}}
|
|
<!-- Header End -->
|
|
<div class="body-wrapper">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-sm-6 col-xl-3">
|
|
<div class="card bg-primary-subtle shadow-none">
|
|
<div class="card-body p-4">
|
|
<div class="d-flex align-items-center">
|
|
<div class="round rounded text-bg-primary d-flex align-items-center justify-content-center">
|
|
<i class="cc BTC text-white fs-7" title="BTC"></i>
|
|
</div>
|
|
<h6 class="mb-0 ms-3">BTC</h6>
|
|
<div class="ms-auto text-primary d-flex align-items-center">
|
|
<i class="ti ti-trending-up text-primary fs-6 me-1"></i>
|
|
<span class="fs-2 fw-bold">+ 2.30%</span>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center justify-content-between mt-4">
|
|
<h3 class="mb-0 fw-semibold fs-7">0.1245</h3>
|
|
<span class="fw-bold">$1,015.00</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6 col-xl-3">
|
|
<div class="card bg-danger-subtle shadow-none">
|
|
<div class="card-body p-4">
|
|
<div class="d-flex align-items-center">
|
|
<div class="round rounded text-bg-danger d-flex align-items-center justify-content-center">
|
|
<i class="cc ETH text-white fs-7" title="ETH"></i>
|
|
</div>
|
|
<h6 class="mb-0 ms-3">ETH</h6>
|
|
<div class="ms-auto text-danger d-flex align-items-center">
|
|
<i class="ti ti-trending-up text-danger fs-6 me-1"></i>
|
|
<span class="fs-2 fw-bold">+ 3.20%</span>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center justify-content-between mt-4">
|
|
<h3 class="mb-0 fw-semibold fs-7">0.5620</h3>
|
|
<span class="fw-bold">$2,110.00</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6 col-xl-3">
|
|
<div class="card bg-success-subtle shadow-none">
|
|
<div class="card-body p-4">
|
|
<div class="d-flex align-items-center">
|
|
<div class="round rounded text-bg-success d-flex align-items-center justify-content-center">
|
|
<i class="cc LTC text-white fs-7" title="LTC"></i>
|
|
</div>
|
|
<h6 class="mb-0 ms-3">LTC</h6>
|
|
<div class="ms-auto text-info d-flex align-items-center">
|
|
<i class="ti ti-trending-down text-success fs-6 me-1"></i>
|
|
<span class="fs-2 fw-bold text-success">+ 3.20%</span>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center justify-content-between mt-4">
|
|
<h3 class="mb-0 fw-semibold fs-7">1.200</h3>
|
|
<span class="fw-bold">$1,100.00</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6 col-xl-3">
|
|
<div class="card bg-warning-subtle shadow-none">
|
|
<div class="card-body p-4">
|
|
<div class="d-flex align-items-center">
|
|
<div class="round rounded text-bg-warning d-flex align-items-center justify-content-center">
|
|
<i class="cc XRP text-white fs-7" title="XRP"></i>
|
|
</div>
|
|
<h6 class="mb-0 ms-3">XRP</h6>
|
|
<div class="ms-auto text-info d-flex align-items-center">
|
|
<i class="ti ti-trending-down text-warning fs-6 me-1"></i>
|
|
<span class="fs-2 fw-bold text-warning">+ 2.20%</span>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-center justify-content-between mt-4">
|
|
<h3 class="mb-0 fw-semibold fs-7">1.150</h3>
|
|
<span class="fw-bold">$2,150.00</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h4 class="card-title fw-semibold">Trade History</h4>
|
|
<p class="card-subtitle">Trade and the Age of Exploration</p>
|
|
<div class="table-responsive mt-4">
|
|
<table class="table table-borderless text-nowrap align-middle mb-0">
|
|
<tbody>
|
|
<tr class="bg-light">
|
|
<td class="rounded-start bg-transparent">
|
|
<div class="d-flex align-items-center gap-3">
|
|
<div>
|
|
<i class="cc BTC fs-7"></i>
|
|
</div>
|
|
<div>
|
|
<h6 class="mb-0">Bitcoin</h6>
|
|
<span class="fs-3">BTC</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="bg-transparent"> $981.1254 <i class="ti ti-chevron-down text-danger ms-1 fs-4"></i>
|
|
</td>
|
|
<td class="bg-transparent">
|
|
<i class="cc ETC me-1 text-primary fs-5" title="ETC"></i> 0.23125
|
|
</td>
|
|
<td class="bg-transparent">$1.23560 B</td>
|
|
<td class="bg-transparent">04 Feb 2024</td>
|
|
<td class="text-end rounded-end bg-transparent">
|
|
<span class="badge bg-danger">transfer</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="6"></td>
|
|
</tr>
|
|
<tr class="bg-light">
|
|
<td class="rounded-start bg-transparent">
|
|
<div class="d-flex align-items-center gap-3">
|
|
<div>
|
|
<i class="cc ETH fs-7"></i>
|
|
</div>
|
|
<div>
|
|
<h6 class="mb-0">Ethereum</h6>
|
|
<span class="fs-3">ETH</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="bg-transparent"> $450.1254 <i class="ti ti-chevron-down text-danger ms-1 fs-4"></i>
|
|
</td>
|
|
<td class="bg-transparent">
|
|
<i class="cc ETC me-1 text-primary fs-5" title="ETC"></i> 0.45000
|
|
</td>
|
|
<td class="bg-transparent">$3.23560 B</td>
|
|
<td class="bg-transparent">09 Mar 2024</td>
|
|
<td class="text-end rounded-end bg-transparent">
|
|
<span class="badge bg-primary">sell</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="6"></td>
|
|
</tr>
|
|
<tr class="bg-light">
|
|
<td class="rounded-start bg-transparent">
|
|
<div class="d-flex align-items-center gap-3">
|
|
<div>
|
|
<i class="cc LTC fs-7"></i>
|
|
</div>
|
|
<div>
|
|
<h6 class="mb-0">Litecoin</h6>
|
|
<span class="fs-3">LTC</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="bg-transparent"> $100.1254 <i class="ti ti-chevron-up text-success ms-1 fs-4"></i>
|
|
</td>
|
|
<td class="bg-transparent">
|
|
<i class="cc BTC me-1 text-danger fs-5" title="BTC"></i> 0.56012
|
|
</td>
|
|
<td class="bg-transparent">$2.45620 B</td>
|
|
<td class="bg-transparent">12 Dec 2024</td>
|
|
<td class="text-end rounded-end bg-transparent">
|
|
<span class="badge bg-success">buy</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="6"></td>
|
|
</tr>
|
|
<tr class="bg-light">
|
|
<td class="rounded-start bg-transparent">
|
|
<div class="d-flex align-items-center gap-3">
|
|
<div>
|
|
<i class="cc XRP fs-7"></i>
|
|
</div>
|
|
<div>
|
|
<h6 class="mb-0">XRP</h6>
|
|
<span class="fs-3">XRP</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="bg-transparent"> $450.1254 <i class="ti ti-chevron-down text-danger ms-1 fs-4"></i>
|
|
</td>
|
|
<td class="bg-transparent">
|
|
<i class="cc ETC me-1 text-primary fs-5" title="ETC"></i> 0.45000
|
|
</td>
|
|
<td class="bg-transparent">$3.23560 B</td>
|
|
<td class="bg-transparent">01 Aug 2024</td>
|
|
<td class="text-end rounded-end bg-transparent">
|
|
<span class="badge bg-danger">transfer</span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
function MarketWebSocket()
|
|
{
|
|
if ("WebSocket" in window)
|
|
{
|
|
|
|
// 打开一个 web socket
|
|
var ws = new WebSocket("ws://market.senlin.ai:13300/ws");
|
|
|
|
ws.onopen = function()
|
|
{
|
|
// Web Socket 已连接上，使用 send() 方法发送数据
|
|
console.log("Web Socket 已连接上");
|
|
};
|
|
|
|
ws.onmessage = function (evt)
|
|
{
|
|
var received_msg = evt.data;
|
|
console.log(received_msg);
|
|
};
|
|
|
|
ws.onclose = function()
|
|
{
|
|
// 关闭 websocket
|
|
console.log("连接已关闭");
|
|
};
|
|
}
|
|
|
|
else
|
|
{
|
|
// 浏览器不支持 WebSocket
|
|
alert("您的浏览器不支持 WebSocket!");
|
|
}
|
|
}
|
|
|
|
MarketWebSocket();
|
|
</script>
|
|
|
|
{{template "components/footer.html" .}}
|