feat: 取餐明细页合并支付引导功能 + 删除 user-03-paying 页面

- user-02-checkout-sync 重构:
  - 左侧订单列表压缩: 删除「类别」列改为按餐线/档口分组展示,
    单位(元/100g、g、kcal、元)挪至表头小字, 数字列去掉胶囊背景,
    去掉循环滚动动画(13 件餐品静态展示)
  - 右侧支付区重构: 营养卡压缩, 应付金额大数字联动支付方式与代金券构成 chips,
    右上角下拉切换器(6 形态 + 代金券开关), 三种含扫码卡片形态(在线/余额+在线/
    现金+在线)共用 renderScanCards() 函数, 左右两卡片完全对称(同尺寸/样式/3 渠道)
  - 混合支付弱化第一步: 已完成步骤改为细长横条, 第二步扫码区放大强调(蓝色脉冲发光边框)
- 删除 user-03-paying.html: 功能已合并到 user-02-checkout-sync
- index.html 同步删除 U03 入口卡片
- user-02/04 清理对 user-03-paying 的过时注释引用

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
fengpu
2026-08-10 15:19:37 +08:00
co-authored by Claude Opus 4.7
parent 32bd018c4e
commit ae9acce200
4 changed files with 1225 additions and 1612 deletions
@@ -217,14 +217,6 @@
<div class="card__desc">同步商品列表 + 营养摘要</div>
</div>
</a>
<a class="card" href="user-03-paying.html">
<span class="card__status card__status--done">U03</span>
<div class="card__icon">&#x1F4F1;</div>
<div class="card__body">
<div class="card__title">支付引导</div>
<div class="card__desc">4 种支付方式引导切换</div>
</div>
</a>
<a class="card" href="user-04-success.html">
<span class="card__status card__status--done">U04</span>
<div class="card__icon">&#x2705;</div>
File diff suppressed because it is too large Load Diff
File diff suppressed because it is too large Load Diff
@@ -711,7 +711,7 @@
document.querySelectorAll('.demo-switcher__btn').forEach(function(btn) {
btn.addEventListener('click', function() {
switchDemo(btn.dataset.method);
/* 同步 URL 参数,便于复制链接分享(与 user-03-paying 风格一致) */
/* 同步 URL 参数,便于复制链接分享 */
var url = new URL(window.location.href);
url.searchParams.set('method', btn.dataset.method);
window.history.replaceState({}, '', url.toString());