r105/cart.html · 约 2683 字符
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<div class="app">11 <div class="navbar"><a class="back" href="index.html">‹</a><span class="ttl">购物车</span></div>12 <div id="clist"></div>13 <div id="cbar-holder"></div>14</div>1516<script src="data.js"></script>17<script src="cart.js"></script>18<script>19function render(){20 var cart = xcGetCart();21 var box = document.getElementById('clist');22 if (!cart.length){23 box.innerHTML = '<div class="empty">购物车还是空的，去选购吧～</div>';24 document.getElementById('cbar-holder').innerHTML = '';25 return;26 }27 var h = '';28 cart.forEach(function(i){29 h += '<div class="citem">'+30 '<div class="pic" style="background:'+i.color+'">'+i.emoji+'</div>'+31 '<div class="info">'+32 '<div class="nm">'+i.name+'</div>'+33 '<div class="sp">'+i.specLabel+' · '+i.unit+'</div>'+34 '<div class="pr">'+xcFmt(i.price*i.qty)+' <span style="color:var(--muted);font-weight:400;font-size:11px">（'+xcFmt(i.price)+'/件）</span></div>'+35 '<div class="rt" style="margin-top:6px">'+36 '<div class="mini-step">'+37 '<button onclick="chg(\''+i.key+'\',-1)">−</button>'+38 '<span class="n">'+i.qty+'</span>'+39 '<button onclick="chg(\''+i.key+'\',1)">+</button>'+40 '</div>'+41 '<span class="del" onclick="rm(\''+i.key+'\')">删除</span>'+42 '</div>'+43 '</div>'+44 '</div>';45 });46 box.innerHTML = h;47 var total = xcCartTotal(), n = xcCartCount();48 document.getElementById('cbar-holder').innerHTML =49 '<div class="cartbar">'+50 '<div class="ic">🧺<span class="badge" style="display:inline-block">'+n+'</span></div>'+51 '<div class="total">合计 <span>'+xcFmt(total)+'</span></div>'+52 '<button class="btn btn-ghost" onclick="saveCart()">保存</button>'+53 '<button class="btn btn-orange btn-lg" style="padding:9px 22px" onclick="checkout()">提交订单</button>'+54 '</div>';55}56function chg(key,d){ var c=xcGetCart(); c.forEach(function(i){ if(i.key===key) i.qty=Math.max(1,i.qty+d); }); xcSetCart(c); render(); }57function rm(key){ xcRemoveCart(key); render(); }58function saveCart(){ xcToast('购物车已保存（本地）'); }59function checkout(){60 var o = xcCheckout();61 if (!o){ xcToast('购物车为空'); return; }62 xcToast('下单成功！订单号 '+o.oid);63 setTimeout(function(){ location.href='orders.html'; }, 800);64}65render();66</script>67</body>68</html>69