某杰废品回收站_H5/detail.html · 约 5180 字符
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="detail-img"><div class="di-badge">📷 支持拍照识别品类</div>🔶</div>
13<div class="detail-price">
14 <div class="dp-num">¥48<small> /公斤</small> <span style="color:#059669;font-size:13px">会员加价 5%</span></div>
15 <div class="dp-meta">废铜线 · 光亮紫铜价更高 · 上门实称实结算 · 当场现结</div>
16 <div class="dp-row">
17 <div class="dp-cell">📅 今日行情<br/>+3%</div>
18 <div class="dp-cell">⚖️ 计价方式<br/>按公斤</div>
19 <div class="dp-cell">🚴 上门时效<br/>1 小时内</div>
20 <div class="dp-cell">💰 结算<br/>微信零钱</div>
21 </div>
22</div>
23<div class="spec-box">
24 <div class="sb-title">预估回收量</div>
25 <div class="spec-row"><span class="sr-label">品类</span><div class="sr-opts"><div class="spec-opt sel">光亮铜线</div><div class="spec-opt">带皮铜线</div><div class="spec-opt">紫铜件</div></div></div>
26 <div class="spec-row"><span class="sr-label">预估重量</span><div class="sr-opts"><div class="spec-opt sel">5 公斤</div><div class="spec-opt">10 公斤</div><div class="spec-opt">20 公斤+</div></div></div>
27 <div class="spec-row"><span class="sr-label">数量</span><div class="sr-num"><i>-</i><b>1</b><i>+</i></div></div>
28 <div style="font-size:11px;color:#8fc2b4;margin-top:10px">预估收益约 <b style="color:#dc2626">¥240</b>（以上门实称重量为准）</div>
29</div>
30<div class="rule-box">
31 <div class="rb-title">✅ 回收标准</div>
32 <div class="rule-line ok"><b>收：</b><span>纸箱请拆开压平，去掉胶带与泡沫填充物</span></div>
33 <div class="rule-line ok"><b>收：</b><span>瓶类请清空液体、去瓶盖与标签并踩扁</span></div>
34 <div class="rule-line ok"><b>收：</b><span>衣物请清洗晾干后打包，一袋式混装按统货价</span></div>
35 <div class="rule-line ok"><b>收：</b><span>家电请提前清空并断电，留出搬运通道</span></div>
36 <div class="rule-line no" style="margin-top:6px"><b>不收：</b><span>油漆桶、农药瓶等危险废弃物</span></div>
37 <div class="rule-line no"><b>不收：</b><span>医疗垃圾、注射器等涉疫物品</span></div>
38 <div class="rule-line no"><b>不收：</b><span>混入大量生活垃圾、建筑垃圾的统货</span></div>
39 <div class="rule-line no"><b>不收：</b><span>来源不明、涉嫌赃物的物品（将报警处理）</span></div>
40</div>
41<div class="section-title">📋 上门回收流程</div>
42<div class="flow-box" style="margin-top:0">
43 <div id="flowList2"></div>
44</div>
45<div class="section-title">💬 回收用户评价（2360+）</div>
46<div id="evalList"></div>
47<div class="section-title">❤️ 猜你还想回收</div>
48<div id="guessList" style="display:flex;gap:10px;overflow-x:auto;padding:0 12px;scrollbar-width:none"></div>
49<div style="height:70px"></div>
50<div class="buy-bar">
51 <div class="bb-cart"><span class="ico">📋<span class="num">3</span></span>回收单</div>
52 <div class="bb-btn buy" data-toast="已加入回收单">加入回收单</div>
53 <div class="bb-btn now" data-toast="预约成功，回收员将尽快接单">立即预约</div>
54</div>
55
56
57<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>首页</a><a class=" active" 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>
58<script src="data.js"></script>
59<script>
60 var fl = document.getElementById('flowList2');
61 var h1 = '';
62 window.DATA.flow.forEach(function (f) {
63 h1 += '<div class="flow-item"><div class="fi-ico">' + f.ico + '</div><div>'
64 + '<div class="fi-name">' + f.name + '</div><div class="fi-desc">' + f.desc + '</div></div></div>';
65 });
66 fl.innerHTML = h1;
67 var el = document.getElementById('evalList');
68 var h = '';
69 window.DATA.evals.forEach(function (x) {
70 h += '<div class="eval-card"><div class="ev-head"><div class="ev-avatar">' + x.avatar + '</div>'
71 + '<div>' + x.name + '</div><div class="ev-star">' + x.star + '</div>'
72 + '</div><div class="ev-text">' + x.text + '</div></div>';
73 });
74 el.innerHTML = h;
75 var gl = document.getElementById('guessList');
76 var h2 = '';
77 window.DATA.products.slice(6, 10).forEach(function (b) {
78 h2 += '<div class="sk-item" style="width:110px"><div class="sk-img" style="height:80px">' + b.img + '</div>'
79 + '<div class="sk-name">' + b.name + '</div><div class="sk-price">¥' + b.price + '</div></div>';
80 });
81 gl.innerHTML = h2;
82</script>
83<script src="app.js"></script>
84</body>
85</html>