小草卤肉店/orders.html · 约 3091 字符
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,maximum-scale=1,user-scalable=no"/>
6<title>我的订单 · 小草卤肉店</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<header class="header"><a class="back" onclick="history.back()">‹</a><h1>我的订单</h1><span class="right"></span></header>
12<div class="order-tabs">
13 <a class="active">全部</a><a>待配送</a><a>配送中</a><a>已完成</a><a>售后</a>
14</div>
15<div class="order-card">
16 <div class="oc-head"><span>2026-08-30 18:30 <span class="tag">外卖配送</span></span><span class="st">配送中</span></div>
17 <div class="oc-goods"><div class="og-img">🍖</div><div class="og-name">招牌卤猪蹄 + 麻辣鸡爪<br/><span style="font-size:11px;color:#b08868">五香 · 真空锁鲜</span></div><div class="og-price">¥71.8</div></div>
18 <div class="oc-foot"><span>共 2 件 · 实付</span><b>¥71.8</b></div>
19 <div class="oc-ops"><i>查看物流</i><i>再次购买</i></div>
20</div>
21<div class="order-card">
22 <div class="oc-head"><span>2026-08-26 12:05</span><span class="st" style="color:#16a34a">已完成</span></div>
23 <div class="oc-goods"><div class="og-img">🥩</div><div class="og-name">秘制卤牛肉（斤）<br/><span style="font-size:11px;color:#b08868">已签收 · 好评</span></div><div class="og-price">¥68</div></div>
24 <div class="oc-foot"><span>共 1 件 · 实付</span><b>¥68</b></div>
25 <div class="oc-ops"><i class="main">去评价</i><i>再次购买</i></div>
26</div>
27<div class="order-card">
28 <div class="oc-head"><span>2026-08-20 20:18</span><span class="st" style="color:#16a34a">已完成</span></div>
29 <div class="oc-goods"><div class="og-img">🥚</div><div class="og-name">五香卤蛋 ×6 + 卤藕片<br/><span style="font-size:11px;color:#b08868">门店自提 · 已取</span></div><div class="og-price">¥27.4</div></div>
30 <div class="oc-foot"><span>共 2 件 · 实付</span><b>¥27.4</b></div>
31 <div class="oc-ops"><i>查看评价</i><i>再次购买</i></div>
32</div>
33<div class="section-title">📦 配送进度</div>
34<div class="track-line" id="trackList"></div>
35
36
37<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="category.html"><span class="icon">🍖</span>卤味</a><a class="" href="vip.html"><span class="icon">👑</span>会员</a><a class=" active" href="orders.html"><span class="icon">📦</span>订单</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
38<script src="data.js"></script>
39<script>
40 var tl = document.getElementById('trackList');
41 var h = '';
42 window.DATA.tracks.forEach(function (t) {
43 var cls = t.now ? 'now' : (t.done ? 'done' : '');
44 h += '<div class="tl-item ' + cls + '"><div class="tl-dot"></div><div>'
45 + '<div class="tl-title">' + t.title + '</div><div class="tl-time">' + t.time + '</div></div></div>';
46 });
47 tl.innerHTML = h;
48</script>
49<script src="app.js"></script>
50</body>
51</html>