Files
crypto_okx/lib/account_ledger/templates/account_ledger_panel.html
T
dekun a1abe159fa Initial standalone crypto_okx with one-click deploy.
Add deploy/manage.sh bootstrap for git.bz121.com/dekun/crypto_okx and point docs at this repo.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-13 20:00:59 +08:00

73 lines
3.3 KiB
HTML

{# 账户流水:资金/交易 Tab · 交易所账单 · SSE #}
<div class="card full account-ledger-card" id="account-ledger-root" data-account-ledger="1">
<div class="account-ledger-head">
<div>
<h2 style="margin-bottom:4px">账户流水</h2>
<p class="muted account-ledger-desc">拉取交易所资金账户与交易账户账单 · 时间跟随顶栏 UTC 预设 · 约 2 分钟自动同步</p>
</div>
<div class="account-ledger-head-actions">
<span class="muted" id="account-ledger-sync"></span>
<button type="button" class="btn-sm" id="account-ledger-refresh">立即同步</button>
</div>
</div>
<div class="account-ledger-tabs" role="tablist">
<button type="button" class="account-ledger-tab active" data-ledger-account="funding" role="tab" aria-selected="true">资金账户</button>
<button type="button" class="account-ledger-tab" data-ledger-account="trading" role="tab" aria-selected="false">交易账户</button>
</div>
<p class="muted account-ledger-status" id="account-ledger-status"></p>
<div class="account-ledger-table-wrap panel-scroll">
<table class="account-ledger-table" id="account-ledger-table">
<thead>
<tr>
<th>时间(北京)</th>
<th>币种</th>
<th>类型</th>
<th>变动</th>
<th>余额</th>
<th>合约/备注</th>
</tr>
</thead>
<tbody id="account-ledger-tbody">
<tr><td colspan="6" class="muted">加载中…</td></tr>
</tbody>
</table>
</div>
<div class="account-ledger-pager" id="account-ledger-pager">
<button type="button" class="btn-sm" id="account-ledger-prev" disabled>上一页</button>
<span class="muted" id="account-ledger-page-info"></span>
<button type="button" class="btn-sm" id="account-ledger-next" disabled>下一页</button>
</div>
</div>
<style>
.account-ledger-card { grid-column: 1 / -1; }
.account-ledger-head {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 12px; flex-wrap: wrap; margin-bottom: 10px;
}
.account-ledger-head-actions { display: flex; align-items: center; gap: 10px; }
.account-ledger-tabs {
display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap;
}
.account-ledger-tab {
border: 1px solid rgba(140,160,200,.35);
background: transparent; color: #c5cbe0;
border-radius: 6px; padding: 6px 14px; cursor: pointer; font-size: .9rem;
}
.account-ledger-tab.active {
background: #1f3a5a; border-color: #3d6f9c; color: #e8f1ff;
}
.account-ledger-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.account-ledger-table th, .account-ledger-table td {
padding: 8px 10px; border-bottom: 1px solid rgba(120,130,160,.2); text-align: left;
}
.account-ledger-table th { color: #9aa3bd; font-weight: 600; }
.account-ledger-amt-pos { color: #3ecf8e; }
.account-ledger-amt-neg { color: #f07178; }
.account-ledger-pager {
display: flex; align-items: center; justify-content: flex-end; gap: 10px;
margin-top: 12px;
}
.account-ledger-status { min-height: 1.2em; margin: 0 0 8px; }
.account-ledger-table-wrap { max-height: min(60vh, 560px); overflow: auto; }
</style>