66 lines
2.2 KiB
HTML
66 lines
2.2 KiB
HTML
{% extends 'base.html' %}
|
|
{% block title %}账单列表{% endblock %}
|
|
{% block content %}
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<h3>账单列表</h3>
|
|
<div class="text-muted">总金额：¥ {{ total_amount }}</div>
|
|
</div>
|
|
|
|
<form method="get" class="row g-2 mb-3">
|
|
<div class="col-md-3">
|
|
<select name="status" class="form-select">
|
|
<option value="">全部状态</option>
|
|
{% for val,label in status_choices %}
|
|
<option value="{{ val }}" {% if status == val %}selected{% endif %}>{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<button class="btn btn-primary" type="submit">筛选</button>
|
|
</div>
|
|
</form>
|
|
|
|
<table class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>周期</th>
|
|
<th>套餐费用</th>
|
|
<th>超量费用</th>
|
|
<th>调整</th>
|
|
<th>总金额</th>
|
|
<th>状态</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for inv in invoices %}
|
|
<tr>
|
|
<td>{{ inv.period_start }} ~ {{ inv.period_end }}</td>
|
|
<td>¥ {{ inv.amount_plan_total }}</td>
|
|
<td>¥ {{ inv.amount_overage_total }}</td>
|
|
<td>¥ {{ inv.amount_adjustment }}</td>
|
|
<td><strong>¥ {{ inv.amount_total }}</strong></td>
|
|
<td>
|
|
{% if inv.status == 'unpaid' %}
|
|
<span class="badge bg-warning text-dark">未支付</span>
|
|
{% elif inv.status == 'paid' %}
|
|
<span class="badge bg-success">已支付</span>
|
|
{% elif inv.status == 'cancelled' %}
|
|
<span class="badge bg-secondary">已取消</span>
|
|
{% else %}
|
|
{{ inv.get_status_display }}
|
|
{% endif %}
|
|
</td>
|
|
<td>
|
|
<a href="{% url 'billing:detail' inv.id %}" class="btn btn-sm btn-outline-secondary">详情</a>
|
|
{% if inv.status == 'unpaid' %}
|
|
<a href="{% url 'billing:pay' inv.id %}" class="btn btn-sm btn-primary ms-1">支付</a>
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% empty %}
|
|
<tr><td colspan="7" class="text-center">暂无账单</td></tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% endblock %} |