某杰蔬菜批发配送_H5/index.html · 约 6054 字符
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<div class="banner">
12 <div>
13 <div class="bn-title">某杰蔬菜批发配送</div>
14 <div class="bn-sub">产地直供 · 一件起批 · 凌晨下单早市达<br/>餐饮/食堂/商超一站式食材采购 · 支持账期</div>
15 <div class="bn-badge">🎁 新商户首单立减 20 元</div>
16 </div>
17 <div class="bn-emoji">🥬</div>
18</div>
19<div class="search-box" data-toast="拍照找菜：上传菜品图自动匹配">
20 <span class="s-ico">🔍</span>
21 <input placeholder="搜索蔬菜 / 水果 / 肉禽 / 水产…"/>
22 <span class="s-btn">搜索</span>
23</div>
24<div class="cat-grid">
25 <a href="category.html"><span class="c-emoji">🥬</span><span class="c-name">时令蔬菜</span></a>
26 <a href="category.html"><span class="c-emoji">🍎</span><span class="c-name">鲜果干货</span></a>
27 <a href="category.html"><span class="c-emoji">🍗</span><span class="c-name">肉禽蛋品</span></a>
28 <a href="category.html"><span class="c-emoji">🐟</span><span class="c-name">水产海鲜</span></a>
29 <a href="category.html"><span class="c-emoji">❄️</span><span class="c-name">冷冻食品</span></a>
30 <a href="category.html"><span class="c-emoji">🧴</span><span class="c-name">调味粮油</span></a>
31</div>
32<div class="quick-grid">
33 <a href="category.html"><div class="qicon">📦</div>批量采购</a>
34 <a data-toast="已为你开启每周固定订货"><div class="qicon">🔁</div>定期配送</a>
35 <a href="member.html"><div class="qicon">🪪</div>客户等级</a>
36 <a href="cart.html"><div class="qicon">📋</div>进货单</a>
37 <a data-toast="邀请同行各得 20 元券"><div class="qicon">🤝</div>邀请同行</a>
38</div>
39<div class="price-news">
40 <div class="pn-head">📈 今日产地行情 <span class="pn-tag">实时更新</span></div>
41 <div id="priceList"></div>
42</div>
43<div class="seckill">
44 <div class="sk-head"><b>⚡ 限时秒杀 · 产地清仓</b><div class="sk-time"><i>02</i>:<i>12</i>:<i>40</i></div></div>
45 <div class="sk-body" id="skList"></div>
46</div>
47<div class="coupon-card" style="background:linear-gradient(135deg,#15803d,#16a34a);margin:12px;border-radius:14px;padding:14px;display:flex;align-items:center;gap:12px;color:#fff">
48 <div style="flex:1"><b style="font-size:18px;display:block">新商户立减 20 元无门槛券</b><span style="font-size:11px;opacity:.9">B 端专用 · 30 天内有效</span></div>
49 <div class="cc-btn" data-toast="优惠券已到账" style="background:#fff;color:#15803d;padding:8px 16px;border-radius:16px;font-size:12px;font-weight:700">立即领取</div>
50</div>
51<div class="section-title">🔥 产地直供爆品 <span>月供 30 万+</span></div>
52<div class="veg-card" data-toast="已加入进货单">
53 <div class="vc-img">🥬</div>
54 <div class="vc-body">
55 <div class="vc-name">山东寿光大白菜 <span class="badge badge-org">产地直供</span></div>
56 <div class="vc-desc">大棚大白菜，帮薄叶嫩水分足，食堂炖炒必备</div>
57 <div class="vc-meta">月供 3.2 万斤 · 山东寿光</div>
58 <div class="vc-foot"><div class="vc-price">¥1.8<small> /斤 原2.2</small></div><div class="vc-add">+</div></div>
59 </div>
60</div>
61<div class="section-title">🥘 组合食材包</div>
62<div id="comboList"></div>
63<div class="section-title">🏪 就近配送仓</div>
64<div id="storeList"></div>
65
66
67<nav class="tabbar"><a class=" active" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="category.html"><span class="icon">🛒</span>采购</a><a class="" href="cart.html"><span class="icon">📋</span>进货单</a><a class="" href="member.html"><span class="icon">👑</span>客户</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
68<script src="data.js"></script>
69<script>
70 var pl = document.getElementById('priceList');
71 var h0 = '';
72 window.DATA.priceNews.forEach(function (x) {
73 h0 += '<div class="pn-item"><span class="pn-name">' + x.name + '</span><span class="pn-price">' + x.price + '</span>'
74 + '<span class="pn-chg ' + x.dir + '">' + x.chg + '</span></div>';
75 });
76 pl.innerHTML = h0;
77 var sk = document.getElementById('skList');
78 var h = '';
79 window.DATA.seckills.forEach(function (x) {
80 h += '<div class="sk-item"><div class="sk-img">' + x.img + '</div><div class="sk-name">' + x.name + '</div>'
81 + '<div class="sk-price">¥' + x.price + '</div><div class="sk-old">¥' + x.old + '</div></div>';
82 });
83 sk.innerHTML = h;
84 var cl = document.getElementById('comboList');
85 var h2 = '';
86 window.DATA.combos.forEach(function (c) {
87 h2 += '<div class="veg-card"><div class="vc-img">' + c.img + '</div><div class="vc-body">'
88 + '<div class="vc-name">' + c.name + ' <span class="badge badge-sale">组合</span></div>'
89 + '<div class="vc-desc">' + c.desc + '</div>'
90 + '<div class="vc-foot"><div class="vc-price">¥' + c.price + '<small> /原' + c.old + '</small></div>'
91 + '<div class="vc-add" data-toast="组合已加入进货单">+</div></div></div></div>';
92 });
93 cl.innerHTML = h2;
94 var sl = document.getElementById('storeList');
95 var h3 = '';
96 window.DATA.stores.slice(0, 2).forEach(function (s) {
97 h3 += '<div class="veg-card"><div class="vc-img">🏪</div><div class="vc-body">'
98 + '<div class="vc-name">' + s.name + ' <span class="tag">' + s.dist + '</span></div>'
99 + '<div class="vc-desc">' + s.addr + ' · 营业 ' + s.time + '</div>'
100 + '<div class="vc-foot"><div class="vc-add" data-toast="已选择该配送仓" style="width:auto;height:auto;border-radius:14px;padding:6px 14px;font-size:12px">选仓</div></div></div></div>';
101 });
102 sl.innerHTML = h3;
103</script>
104<script src="app.js"></script>
105</body>
106</html>