r41/orders.html · 约 3080 字符
1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8">
5<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6<title>订单管理</title>
7<link rel="stylesheet" href="style.css">
8</head>
9<body>
10<div class="wrap">
11<div class="header">
12 <div class="top"><span class="role">后台管理</span><span style="margin-left:auto;font-size:12px;opacity:.85">驰旭教育</span></div>
13 <h1>订单管理</h1>
14 <div class="sub">今日成交 168 笔 · ¥32,860</div>
15</div>
16<div class="kpi" style="margin-top:12px">
17 <div class="box"><div class="num">168</div><div class="lab">今日订单</div></div>
18 <div class="box"><div class="num" style="color:var(--accent)">¥32,860</div><div class="lab">今日成交额</div></div>
19 <div class="box"><div class="num" style="color:var(--secondary)">12</div><div class="lab">待退款</div></div>
20 <div class="box"><div class="num" style="color:#16a34a">96.4%</div><div class="lab">支付成功率</div></div>
21</div>
22<div class="filters"><span class="f on">全部</span><span class="f">已支付</span><span class="f">待支付</span><span class="f">退款中</span><span class="f">已完成</span></div>
23<div class="order-card">
24 <div class="oh"><span>订单号 CX20260716A0871</span><span class="pill tag ok" style="margin-left:auto">已支付</span></div>
25 <div class="ob"><div class="oc" style="background:linear-gradient(135deg,#2563eb,#1e3a8a)">💻</div><div class="info"><div class="t">前端工程师全栈实战训练营</div><div class="s">买家 张三 · 07-16 14:22 · 余额支付</div></div></div>
26 <div class="of"><span style="color:var(--muted)">实付金额</span><b class="price">¥169.00</b></div>
27</div>
28<div class="order-card">
29 <div class="oh"><span>订单号 CX20260716A0865</span><span class="pill tag wait" style="margin-left:auto">待支付</span></div>
30 <div class="ob"><div class="oc" style="background:linear-gradient(135deg,#06b6d4,#0e7490)">🐍</div><div class="info"><div class="t">Python 数据分析入门到实战</div><div class="s">买家 李四 · 07-16 13:58 · 在线支付</div></div></div>
31 <div class="of"><span style="color:var(--muted)">应付金额</span><b class="price">¥159.00</b></div>
32</div>
33<div class="order-card">
34 <div class="oh"><span>订单号 CX20260716A0840</span><span class="pill tag no" style="margin-left:auto">退款中</span></div>
35 <div class="ob"><div class="oc" style="background:linear-gradient(135deg,#7c3aed,#5b21b6)">🎨</div><div class="info"><div class="t">UI 设计规范与组件库搭建</div><div class="s">买家 王五 · 07-16 11:30 · 申请退款</div></div></div>
36 <div class="of"><span style="color:var(--muted)">退款金额</span><b class="price">¥129.00</b></div>
37</div>
38<div class="bottom-nav"><a class="nav-item" href="category.html"><span class="icon">🏷️</span>分类管理</a><a class="nav-item active" href="orders.html"><span class="icon">🧾</span>订单管理</a></div><div class="safe-bottom"></div>
39</div>
40
41</body>
42</html>