<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>账单统计</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body {
background-color: #f8f9fa;
padding: 20px;
}
.card {
margin-bottom: 20px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.table th {
background-color: #f8f9fa;
}
.summary-card {
background-color: #fff;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
}
.amount {
font-weight: bold;
color: #28a745;
}
.amount.negative {
color: #dc3545;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h3 class="mb-0">账单统计</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="summary-card">
<h4>入款统计</h4>
<p>总入款：<span class="amount" id="totalDeposit">0.00</span></p>
<p>入款费率：<span id="depositFeeRate">5.0%</span></p>
<p>入款手续费：<span class="amount" id="depositFee">0.00</span></p>
</div>
</div>
<div class="col-md-6">
<div class="summary-card">
<h4>下发统计</h4>
<p>总下发：<span class="amount" id="totalWithdrawal">0.00</span></p>
<p>下发费率：<span id="withdrawalFeeRate">0.0%</span></p>
<p>下发手续费：<span class="amount" id="withdrawalFee">0.00</span></p>
</div>
</div>
</div>
<div class="summary-card">
<h4>余额统计</h4>
<p>应下发：<span class="amount" id="shouldWithdraw">0.00</span></p>
<p>当前余额：<span class="amount" id="currentBalance">0.00</span></p>
</div>
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h5 class="mb-0">入款记录</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table" id="depositTable">
<thead>
<tr>
<th>时间</th>
<th>金额</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h5 class="mb-0">下发记录</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table" id="withdrawalTable">
<thead>
<tr>
<th>时间</th>
<th>金额</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="/js/bill.js"></script>
</body>
</html>