# 需求描述:
多件折模块,需要实现单独的购物车、结算。
多件折模块页面整体分为了三个部分:
1.顶部:活动列表以及折扣标签
2.中间:对应的活动商品列表
3.底部:购物车面板
# 接口
接口文档地址:https://app.apifox.com/project/5590637 接口目录ID:96365709
许多接口应该是原接口进行的改造,可能定义在旧的接口文档 D:\project\frontend-app\config\config.js 或者新维护的 D:\project\frontend-app\apis 中。
可参考的加购:
店铺加购:D:\project\frontend-app\components\themes\shoptheme6.vue
项目级购物车 tabbar:D:\project\frontend-app\pages\cart\cart.vue
# 活动商品列表
需要添加数字步进器,允许进行加减
步进器中间展示的数量,初始化的数据来自购物车列表中匹配到的对应的商品的已加购数量
# 购物车面板
展示加购的全部数量、去结算按钮
点击加购面板,弹出购物车列表弹窗,弹窗中展示购物车列表、合计金额、立即结算按钮;购物车列表中展示商品图片、名称、金额、步进器(和活动商品列表中的步进器一致)。
# 原型
多件折活动列表:

<div class="pg-canvas sp-canvas"><div class="sp-act-head"><button class="sp-act-back" data-act="sp-back"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"></path></svg></button><div><div class="t" data-zh="多件折扣" data-en="Bundle Deal">多件折扣</div><div class="s" data-zh="多买多省 · 件件优惠" data-en="Buy More, Save More">多买多省 · 件件优惠</div></div></div><div class="sp-sess-nav"><div class="sp-sess-tab" data-act="sp-bundle-sess" data-i="0"><div class="d" data-zh="6月1日 00:00 — 6月3日 23:59" data-en="Jun 1 00:00 — Jun 3 23:59">6月1日 00:00 — 6月3日 23:59</div><span class="b" data-zh="已结束" data-en="Ended">已结束</span></div><div class="sp-sess-tab on" data-act="sp-bundle-sess" data-i="1"><div class="d" data-zh="6月5日 00:00 — 6月12日 23:59" data-en="Jun 5 00:00 — Jun 12 23:59">6月5日 00:00 — 6月12日 23:59</div><span class="b" data-zh="进行中" data-en="Ongoing">进行中</span></div><div class="sp-sess-tab" data-act="sp-bundle-sess" data-i="2"><div class="d" data-zh="6月13日 00:00 — 6月15日 23:59" data-en="Jun 13 00:00 — Jun 15 23:59">6月13日 00:00 — 6月15日 23:59</div><span class="b" data-zh="即将开始" data-en="Upcoming">即将开始</span></div></div><div class="sp-rules"><span data-zh="满2件享9折" data-en="2+ items: 10% OFF">满2件享9折</span><span class="arrow"> → </span><span data-zh="满5件享8折" data-en="5+ items: 20% OFF">满5件享8折</span></div><div class="sp-scroll" data-bundle-list=""><div class="sp-sitem" data-bid="powerbank"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg></div><div class="bd"><div class="n" data-zh="20000mAh快充移动电源 22.5W 多协议兼容" data-en="20000mAh Power Bank 22.5W Multi-Protocol">20000mAh快充移动电源 22.5W 多协议兼容</div><div class="sp-fprice"><span class="sp-flash-price">USD 9.90</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 2.8k" data-en="2.8k sold">已售 2.8k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">1</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="cable"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></div><div class="bd"><div class="n" data-zh="磁吸充电线 多色可选 1.5米 快充协议" data-en="Magnetic Cable Multi-Color 1.5m Fast Charge">磁吸充电线 多色可选 1.5米 快充协议</div><div class="sp-fprice"><span class="sp-flash-price">USD 5.99</span><span class="sp-flash-tag" data-zh="满5件8折" data-en="5+ 20%OFF">满5件8折</span><span class="sp-sold sp-sright" data-zh="已售 4.5k" data-en="4.5k sold">已售 4.5k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="cable"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="cable"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="charger"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7" rx="1"></rect><rect x="14" y="3" width="7" height="7" rx="1"></rect><rect x="14" y="14" width="7" height="7" rx="1"></rect><rect x="3" y="14" width="7" height="7" rx="1"></rect></svg></div><div class="bd"><div class="n" data-zh="磁吸无线充电底座 15W 可折叠便携" data-en="MagSafe Charger 15W Foldable Portable">磁吸无线充电底座 15W 可折叠便携</div><div class="sp-fprice"><span class="sp-flash-price">USD 15.80</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 1.2k" data-en="1.2k sold">已售 1.2k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="charger"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="charger"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="fan"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2"></rect><path d="M12 18h.01"></path></svg></div><div class="bd"><div class="n" data-zh="手机散热背夹 半导体制冷 静音风扇" data-en="Phone Cooling Fan Semiconductor Quiet">手机散热背夹 半导体制冷 静音风扇</div><div class="sp-fprice"><span class="sp-flash-price">USD 7.50</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 3.1k" data-en="3.1k sold">已售 3.1k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="fan"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="fan"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div></div><div class="sp-bundle-bar" data-bundle-bar="" data-act="sp-bundle-open" style=""><div class="mid"><div class="cnt"><span data-zh="已选 " data-en="Selected ">已选 </span><b data-bundle-cnt="">1</b><span data-zh=" 件" data-en=" items"> 件</span><span class="arr"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18l6-6-6-6"></path></svg></span></div><div class="hint" data-zh="加购凑单,满2件9折 / 满5件8折" data-en="Add items: 2+ 10% OFF, 5+ 20% OFF">加购凑单,满2件9折 / 满5件8折</div></div><button class="go" data-zh="去结算" data-en="Checkout">去结算</button></div><div class="sp-overlay" data-bundle-drawer=""><div class="sp-drawer"><div class="sp-drawer-head"><span class="t" data-zh="已加购商品" data-en="Cart Items">已加购商品</span><button class="x" data-act="sp-bundle-close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6L6 18M6 6l12 12"></path></svg></button></div><div class="list" data-bundle-drawer-list=""><div class="sp-drawer-item"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg></div><div class="sp-dri"><div class="n" data-zh="20000mAh快充移动电源 22.5W 多协议兼容" data-en="20000mAh Power Bank 22.5W Multi-Protocol">20000mAh快充移动电源 22.5W 多协议兼容</div><div class="p">USD 9.90</div></div><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">1</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div><div class="sp-drawer-foot"><span class="total"><span data-zh="合计:" data-en="Total: ">合计:</span><b class="amt" data-bundle-total="">USD 9.90</b></span><button class="sp-buy" data-act="sp-bundle-go" data-zh="立即结算" data-en="Checkout Now">立即结算</button></div></div></div><div class="sp-toast" data-sp-toast=""></div></div>
1
点开购物车弹窗:

<div class="pg-canvas sp-canvas"><div class="sp-act-head"><button class="sp-act-back" data-act="sp-back"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"></path></svg></button><div><div class="t" data-zh="多件折扣" data-en="Bundle Deal">多件折扣</div><div class="s" data-zh="多买多省 · 件件优惠" data-en="Buy More, Save More">多买多省 · 件件优惠</div></div></div><div class="sp-sess-nav"><div class="sp-sess-tab" data-act="sp-bundle-sess" data-i="0"><div class="d" data-zh="6月1日 00:00 — 6月3日 23:59" data-en="Jun 1 00:00 — Jun 3 23:59">6月1日 00:00 — 6月3日 23:59</div><span class="b" data-zh="已结束" data-en="Ended">已结束</span></div><div class="sp-sess-tab on" data-act="sp-bundle-sess" data-i="1"><div class="d" data-zh="6月5日 00:00 — 6月12日 23:59" data-en="Jun 5 00:00 — Jun 12 23:59">6月5日 00:00 — 6月12日 23:59</div><span class="b" data-zh="进行中" data-en="Ongoing">进行中</span></div><div class="sp-sess-tab" data-act="sp-bundle-sess" data-i="2"><div class="d" data-zh="6月13日 00:00 — 6月15日 23:59" data-en="Jun 13 00:00 — Jun 15 23:59">6月13日 00:00 — 6月15日 23:59</div><span class="b" data-zh="即将开始" data-en="Upcoming">即将开始</span></div></div><div class="sp-rules"><span data-zh="满2件享9折" data-en="2+ items: 10% OFF">满2件享9折</span><span class="arrow"> → </span><span data-zh="满5件享8折" data-en="5+ items: 20% OFF">满5件享8折</span></div><div class="sp-scroll" data-bundle-list=""><div class="sp-sitem" data-bid="powerbank"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg></div><div class="bd"><div class="n" data-zh="20000mAh快充移动电源 22.5W 多协议兼容" data-en="20000mAh Power Bank 22.5W Multi-Protocol">20000mAh快充移动电源 22.5W 多协议兼容</div><div class="sp-fprice"><span class="sp-flash-price">USD 9.90</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 2.8k" data-en="2.8k sold">已售 2.8k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">1</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="cable"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></div><div class="bd"><div class="n" data-zh="磁吸充电线 多色可选 1.5米 快充协议" data-en="Magnetic Cable Multi-Color 1.5m Fast Charge">磁吸充电线 多色可选 1.5米 快充协议</div><div class="sp-fprice"><span class="sp-flash-price">USD 5.99</span><span class="sp-flash-tag" data-zh="满5件8折" data-en="5+ 20%OFF">满5件8折</span><span class="sp-sold sp-sright" data-zh="已售 4.5k" data-en="4.5k sold">已售 4.5k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="cable"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="cable"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="charger"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7" rx="1"></rect><rect x="14" y="3" width="7" height="7" rx="1"></rect><rect x="14" y="14" width="7" height="7" rx="1"></rect><rect x="3" y="14" width="7" height="7" rx="1"></rect></svg></div><div class="bd"><div class="n" data-zh="磁吸无线充电底座 15W 可折叠便携" data-en="MagSafe Charger 15W Foldable Portable">磁吸无线充电底座 15W 可折叠便携</div><div class="sp-fprice"><span class="sp-flash-price">USD 15.80</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 1.2k" data-en="1.2k sold">已售 1.2k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="charger"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="charger"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div><div class="sp-sitem" data-bid="fan"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2"></rect><path d="M12 18h.01"></path></svg></div><div class="bd"><div class="n" data-zh="手机散热背夹 半导体制冷 静音风扇" data-en="Phone Cooling Fan Semiconductor Quiet">手机散热背夹 半导体制冷 静音风扇</div><div class="sp-fprice"><span class="sp-flash-price">USD 7.50</span><span class="sp-flash-tag" data-zh="满2件9折" data-en="2+ 10%OFF">满2件9折</span><span class="sp-sold sp-sright" data-zh="已售 3.1k" data-en="3.1k sold">已售 3.1k</span></div><div class="sp-qrow"><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="fan"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">0</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="fan"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div></div></div><div class="sp-bundle-bar" data-bundle-bar="" data-act="sp-bundle-open" style=""><div class="mid"><div class="cnt"><span data-zh="已选 " data-en="Selected ">已选 </span><b data-bundle-cnt="">1</b><span data-zh=" 件" data-en=" items"> 件</span><span class="arr"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18l6-6-6-6"></path></svg></span></div><div class="hint" data-zh="加购凑单,满2件9折 / 满5件8折" data-en="Add items: 2+ 10% OFF, 5+ 20% OFF">加购凑单,满2件9折 / 满5件8折</div></div><button class="go" data-zh="去结算" data-en="Checkout">去结算</button></div><div class="sp-overlay show" data-bundle-drawer=""><div class="sp-drawer"><div class="sp-drawer-head"><span class="t" data-zh="已加购商品" data-en="Cart Items">已加购商品</span><button class="x" data-act="sp-bundle-close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6L6 18M6 6l12 12"></path></svg></button></div><div class="list" data-bundle-drawer-list=""><div class="sp-drawer-item"><div class="sp-img"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg></div><div class="sp-dri"><div class="n" data-zh="20000mAh快充移动电源 22.5W 多协议兼容" data-en="20000mAh Power Bank 22.5W Multi-Protocol">20000mAh快充移动电源 22.5W 多协议兼容</div><div class="p">USD 9.90</div></div><div class="sp-qty-ctrl"><button class="sp-qty-btn" data-act="sp-bundle-minus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"></path></svg></button><span class="sp-qty-num">1</span><button class="sp-qty-btn" data-act="sp-bundle-plus" data-id="powerbank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"></path></svg></button></div></div></div><div class="sp-drawer-foot"><span class="total"><span data-zh="合计:" data-en="Total: ">合计:</span><b class="amt" data-bundle-total="">USD 9.90</b></span><button class="sp-buy" data-act="sp-bundle-go" data-zh="立即结算" data-en="Checkout Now">立即结算</button></div></div></div><div class="sp-toast" data-sp-toast=""></div></div>
1