- 新增全员订单管理页面,仅限管理员访问 - 购买积分页新增显示用户个人充值记录,管理员可见全员记录 - 支付模块增加用户充值历史查看页面及对应 API 接口 - buy.html 模板新增充值记录展示,包括个人和管理员视角的切换标签 - base.html 添加网站图标图像替换原图标字体图标 - 更新支付宝配置 AppID 和应用私钥 - 增加页面脚本支持充值记录标签页切换功能 - 补充日志,记录更多用户登录成功信息
88 lines
5.2 KiB
HTML
88 lines
5.2 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}充值记录 - AI 视界{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="flex-1 overflow-y-auto p-8 relative">
|
|
<div class="max-w-5xl mx-auto space-y-8">
|
|
<!-- 头部 -->
|
|
<div class="flex items-center justify-between">
|
|
<div class="space-y-1">
|
|
<h1 class="text-3xl font-black text-slate-900 tracking-tight">充值记录</h1>
|
|
<p class="text-slate-500 font-bold text-sm flex items-center gap-2">
|
|
<i data-lucide="history" class="w-4 h-4"></i>
|
|
查看您的所有积分充值历史
|
|
</p>
|
|
</div>
|
|
<a href="{{ url_for('auth.buy_page') }}" class="btn-primary px-6 py-3 rounded-2xl flex items-center gap-2 shadow-xl shadow-indigo-200">
|
|
<i data-lucide="plus-circle" class="w-5 h-5"></i>
|
|
立即充值
|
|
</a>
|
|
</div>
|
|
|
|
<!-- 记录列表 -->
|
|
<div class="bg-white/70 backdrop-blur-xl rounded-[2.5rem] border border-slate-200/50 shadow-2xl overflow-hidden">
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-left border-collapse">
|
|
<thead>
|
|
<tr class="border-b border-slate-100 bg-slate-50/50">
|
|
<th class="px-8 py-5 text-[10px] font-black text-slate-400 uppercase tracking-widest">订单号</th>
|
|
<th class="px-8 py-5 text-[10px] font-black text-slate-400 uppercase tracking-widest">积分</th>
|
|
<th class="px-8 py-5 text-[10px] font-black text-slate-400 uppercase tracking-widest">金额</th>
|
|
<th class="px-8 py-5 text-[10px] font-black text-slate-400 uppercase tracking-widest">状态</th>
|
|
<th class="px-8 py-5 text-[10px] font-black text-slate-400 uppercase tracking-widest">支付时间</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-slate-100">
|
|
{% if orders %}
|
|
{% for order in orders %}
|
|
<tr class="hover:bg-slate-50/50 transition-colors group">
|
|
<td class="px-8 py-5">
|
|
<div class="flex flex-col">
|
|
<span class="text-sm font-bold text-slate-700">{{ order.out_trade_no }}</span>
|
|
<span class="text-[10px] text-slate-400 font-mono">Ali: {{ order.trade_no or '-' }}</span>
|
|
</div>
|
|
</td>
|
|
<td class="px-8 py-5">
|
|
<div class="flex items-center gap-2">
|
|
<div class="w-8 h-8 bg-amber-50 text-amber-500 rounded-lg flex items-center justify-center">
|
|
<i data-lucide="zap" class="w-4 h-4"></i>
|
|
</div>
|
|
<span class="text-sm font-black text-slate-900">+{{ order.points }}</span>
|
|
</div>
|
|
</td>
|
|
<td class="px-8 py-5">
|
|
<span class="text-sm font-bold text-slate-600">¥{{ order.amount }}</span>
|
|
</td>
|
|
<td class="px-8 py-5">
|
|
{% if order.status == 'PAID' %}
|
|
<span class="px-3 py-1 bg-emerald-50 text-emerald-600 text-[10px] font-black rounded-lg border border-emerald-100">已完成</span>
|
|
{% elif order.status == 'PENDING' %}
|
|
<span class="px-3 py-1 bg-amber-50 text-amber-600 text-[10px] font-black rounded-lg border border-amber-100">待支付</span>
|
|
{% else %}
|
|
<span class="px-3 py-1 bg-slate-50 text-slate-400 text-[10px] font-black rounded-lg border border-slate-100">已取消</span>
|
|
{% endif %}
|
|
</td>
|
|
<td class="px-8 py-5">
|
|
<span class="text-xs font-bold text-slate-400">{{ order.paid_at.strftime('%Y-%m-%d %H:%M') if order.paid_at else '-' }}</span>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
{% else %}
|
|
<tr>
|
|
<td colspan="5" class="px-8 py-20 text-center">
|
|
<div class="flex flex-col items-center gap-4 opacity-20">
|
|
<i data-lucide="inbox" class="w-16 h-16"></i>
|
|
<p class="font-black text-xl">暂无充值记录</p>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{% endif %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|