init: 微信支付 Native 页面 (Express + JSON 存储)

2026-07-12 14:44:44 +08:00
commit d46977be14
13 changed files with 2392 additions and 0 deletions
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>微信支付 - 扫码支付</title>
+  <link rel="stylesheet" href="/css/style.css">
+</head>
+<body>
+  <div class="container">
+    <% if (error) { %>
+      <div class="error-card">
+        <h1>❌ 下单失败</h1>
+        <p><%= error %></p>
+        <a href="/" class="btn">返回重试</a>
+      </div>
+    <% } else { %>
+      <div class="pay-card">
+        <h1>⚡ 微信扫码支付</h1>
+        <div class="order-info">
+          <p>订单号: <span><%= order.orderId %></span></p>
+          <p>商品: <span><%= order.productName %></span></p>
+          <p>金额: <span>¥ <%= (order.totalFee / 100).toFixed(2) %></span></p>
+        </div>
+        <div class="qrcode-wrapper">
+          <img src="<%= qrDataUrl %>" alt="支付二维码">
+          <p class="hint">请使用微信扫描二维码支付</p>
+        </div>
+        <div id="status" class="status pending">等待支付...</div>
+        <a href="/" class="btn btn-back">返回首页</a>
+      </div>
+    <% } %>
+  </div>
+
+  <script>
+    <% if (!error) { %>
+      const orderId = '<%= order.orderId %>';
+      const checkStatus = () => {
+        fetch('/pay/status/' + orderId)
+          .then(r => r.json())
+          .then(data => {
+            const el = document.getElementById('status');
+            if (data.status === 'SUCCESS') {
+              el.className = 'status success';
+              el.textContent = '✅ 支付成功！';
+              clearInterval(timer);
+              setTimeout(() => { window.location.href = '/pay/success/' + orderId; }, 1500);
+            } else if (data.status === 'FAILED') {
+              el.className = 'status failed';
+              el.textContent = '❌ 支付失败';
+              clearInterval(timer);
+            }
+          });
+      };
+      const timer = setInterval(checkStatus, 2000);
+    <% } %>
+  </script>
+</body>
+</html>