feat(checkout): 优化微信支付和线下付款流程

- 将默认支付方式调整为微信支付（payType=1），增加支付方式选择项 - 微信支付成功后直接调用微信支付接口并处理支付结果反馈 - 支付取消或失败时显示对应提示信息 - 线下付款(payType=9)保留并显示相应提示，不触发在线支付 - 提交订单时根据支付方式显示不同的按钮文本 (‘提交并支付’ 或 ‘提交订单’) - 针对微信支付配置缺失的错误，统一显示详细提示，便于定位问题 - 优化支付方式选中时的提示样式与说明，提升用户体验
2026-08-10 22:30:30 +08:00
parent efcbaa5b60
commit 9fcadd7725
2 changed files with 50 additions and 19 deletions
@@ -119,14 +119,7 @@
      <workItem from="1784585070286" duration="3047000" />
      <workItem from="1784638429525" duration="16147000" />
      <workItem from="1784798575885" duration="4896000" />
-    </task>
-    <task id="LOCAL-00026" summary="refactor(config): 移除开发者中心和企业控制台的自定义导航样式&#10;&#10;- 删除了开发者中心页面配置中的 navigationStyle: 'custom'&#10;- 删除了企业控制台页面配置中的 navigationStyle: 'custom'&#10;- 简化了页面配置，保持默认导航样式&#10;- 有助于提升页面兼容性和维护性">
-      <option name="closed" value="true" />
-      <created>1776019857647</created>
-      <option name="number" value="00026" />
-      <option name="presentableId" value="LOCAL-00026" />
-      <option name="project" value="LOCAL" />
-      <updated>1776019857647</updated>
+      <workItem from="1784873955217" duration="3822000" />
    </task>
    <task id="LOCAL-00027" summary="feat(userVerify): 添加阿里云身份证二要素核验功能&#10;&#10;- 在接口层新增 verifyIdCard 接口，实现姓名与身份证号核验&#10;- userVerify 页面提交时增加身份核验逻辑，核验失败阻止提交&#10;- 调用核验接口时显示加载状态，并根据结果提示用户&#10;- 后端依赖 aliyun cloudauth，提供实人认证相关服务接口&#10;- 完成基本的错误捕获与用户提示，提升实名认证流程安全性">
      <option name="closed" value="true" />
@@ -512,7 +505,15 @@
      <option name="project" value="LOCAL" />
      <updated>1784803190504</updated>
    </task>
-    <option name="localTasksCounter" value="75" />
+    <task id="LOCAL-00075" summary="feat(user): 合并切换开发者菜单并优化首页轮播图显示&#10;&#10;- 用户菜单根据 isDeveloper 字段切换显示申请或进入开发者中心&#10;- 已审核用户菜单高亮显示“进入开发者中心”&#10;- 去除冗余开发者中心菜单条目，简化结构&#10;- 重新设计开发者中心页面UI，统一门店中心风格&#10;- 顶部展示开发者头像及昵称手机号信息&#10;- 功能卡片展示“我的应用”、“API Key”和“我的工单”，异步加载数量角标&#10;- 底部添加“开发者帮助与支持”入口，替代门店订阅消息卡片&#10;- 未登录或非开发者状态显示相应空态及操作按钮&#10;- 首页轮播图为空时不显示容器，功能入口自动上移，优化空状态体验&#10;- 优化登录状态与权限校验逻辑，防止页面闪烁和无权限展示">
+      <option name="closed" value="true" />
+      <created>1784873966827</created>
+      <option name="number" value="00075" />
+      <option name="presentableId" value="LOCAL-00075" />
+      <option name="project" value="LOCAL" />
+      <updated>1784873966827</updated>
+    </task>
+    <option name="localTasksCounter" value="76" />
    <servers />
  </component>
  <component name="TypeScriptGeneratedFilesManager">
@@ -128,11 +128,13 @@ const CheckoutPage: React.FC = () => {
  const { isVip } = useVipStatus()

  // 支付方式相关状态
-  const [payType, setPayType] = useState<number>(9) // 9: 线下付款（默认），8: 货到付款（已注释）
+  // 1: 微信支付（默认，提交订单后直接调起微信支付），9: 线下付款（微信转账，商家确认后发货）
+  const [payType, setPayType] = useState<number>(1)

  // 支付方式选项
  const PAYMENT_OPTIONS = [
    // { id: 8, name: '货到付款', desc: '送达时支付', icon: '货', bgColor: '#f0fdf4', iconBg: '#dbeafe', iconColor: '#2563eb', borderColor: '#22c55e' },
+    { id: 1, name: '微信支付', desc: '推荐使用微信支付', icon: '微', bgColor: '#f0fdf4', iconBg: '#dcfce7', iconColor: '#16a34a', borderColor: '#22c55e' },
    { id: 9, name: '线下付款', desc: '微信转账，商家确认后发货', icon: '线', bgColor: '#fffbeb', iconBg: '#fef3c7', iconColor: '#d97706', borderColor: '#f59e0b' },
  ]

@@ -298,18 +300,39 @@ const CheckoutPage: React.FC = () => {
        await removeSelected()
      }

-      // 显示成功提示
-      Taro.showToast({ title: '订单已提交', icon: 'success' })
+      // 微信支付(payType=1)：后端返回预支付参数后直接调起微信支付
+      if (payType === 1 && res) {
+        try {
+          await Taro.requestPayment({
+            timeStamp: res.timeStamp,
+            nonceStr: res.nonceStr,
+            package: res.package,
+            signType: res.signType,
+            paySign: res.paySign,
+          })
+          Taro.showToast({ title: '支付成功', icon: 'success' })
+        } catch (payErr: any) {
+          if (payErr?.errMsg?.includes('cancel')) {
+            Taro.showToast({ title: '已取消支付，可在订单中继续付款', icon: 'none' })
+          } else {
+            Taro.showToast({ title: payErr?.message || '支付失败', icon: 'none' })
+          }
+        }
+      } else {
+        // 线下付款(payType=9)等无需在线支付的场景
+        Taro.showToast({ title: '订单已提交', icon: 'success' })
+      }
+
      setTimeout(() => {
        Taro.navigateTo({ url: '/pages/order/list' })
      }, 1500)
    } catch (err: any) {
      const message = err.message || '提交失败'
-      // 线下付款(payType=9)下单时，后端如果仍尝试创建微信支付订单，
-      // 会因支付配置缺失应用ID而报错。这里给出更明确的提示。
-      if (payType === 9 && /应用ID|appid|appId|支付配置|微信支付订单|创建支付订单失败/.test(message)) {
-        Taro.showToast({ title: '线下支付暂不可用：微信支付配置缺失', icon: 'none', duration: 3000 })
-        console.error('[checkout] 线下付款下单失败，后端支付配置问题：', message)
+      // 微信支付(payType=1)或线下付款(payType=9)下单时，若后端微信支付配置缺失（应用ID/appid 缺失）
+      // 会导致创建支付订单失败。这里给出统一的明确提示。
+      if (/应用ID|appid|appId|支付配置|微信支付订单|创建支付订单失败|微信支付/.test(message)) {
+        Taro.showToast({ title: '微信支付暂不可用：支付配置缺失', icon: 'none', duration: 3000 })
+        console.error('[checkout] 下单失败，后端微信支付配置问题：', message)
      } else {
        Taro.showToast({ title: message, icon: 'none' })
      }
@@ -496,7 +519,14 @@ const CheckoutPage: React.FC = () => {
              )
            })}

-            {/* 线下付款选中时显示提示 */}
+            {/* 支付方式选中提示 */}
+            {payType === 1 && (
+              <View className='mt-2 p-2 rounded-lg' style={{ backgroundColor: '#dcfce7' }}>
+                <Text className='text-xs text-green-600'>
+                  提交订单后将直接调起微信支付，支付成功即完成下单。
+                </Text>
+              </View>
+            )}
            {payType === 9 && (
              <View className='mt-2 p-2 rounded-lg' style={{ backgroundColor: '#fef3c7' }}>
                <Text className='text-xs text-orange-600'>
@@ -577,7 +607,7 @@ const CheckoutPage: React.FC = () => {
            style={{ backgroundColor: submitting ? '#ccc' : '#0e932e' }}
            onClick={submitting ? undefined : handleSubmit}
          >
-            <Text>{submitting ? '提交中...' : '提交订单'}</Text>
+            <Text>{submitting ? '提交中...' : (payType === 1 ? '提交并支付' : '提交订单')}</Text>
          </View>
        </View>
      </View>