@uxda/appkit 4.3.40 → 4.3.42

package/src/payment/components/TradeView.vue

@@ -1,627 +1,627 @@
-<template>
-  <view class="view recharge-view2">
-    <view class="flex-grow">
-      <rights-picker
-        :items="amounts"
-        :selected="state.selected"
-        @change="onAmountSelect"
-      />
-      <div class="bean-buy" v-if="amounts[state.selected]">
-        <div class="left">
-          <div class="title">使用云豆支付</div>
-          <div class="amount" v-if="!selectBean">
-            余额 {{ formatAmount(balance || 0) }}
-          </div>
-          <div class="amount" v-else>
-            扣减后余额
-            {{ balance > amounts[state.selected].paymentAmount ? formatAmount(balance - amounts[state.selected].paymentAmount) : 0 }}
-          </div>
-        </div>
-        <div class="right" @click="selectBean = !selectBean">
-          <div class="amount" >
-            -{{ selectBean && balance < amounts[state.selected].paymentAmount ? balance : formatAmount(amounts[state.selected].paymentAmount || 0) }}
-          </div>
-          <img
-            class="icon"
-            :src="
-              selectBean
-                ? 'https://cdn.ddjf.com/static/images/appkit/select.svg'
-                : 'https://cdn.ddjf.com/static/images/appkit/not-select.svg'
-            "
-          />
-        </div>
-
-        <div class="balance-warning" v-if="isCombinedPayment">
-          云豆余额不足,还需额外支付{{ formatAmount(extraPaymentAmount) }}元
-        </div>
-      </div>
-
-      <div class="balance-warning-tip" v-if="isCombinedPayment">
-        请在支付完成前确保元豆余额不被消耗,否则本次权益可能购买失败
-      </div>
-
-      <slot name="banner"></slot>
-    </view>
-
-    <view class="amount-footer">
-      <view class="agreement" v-if="!selectBean || isCombinedPayment">
-        <nut-checkbox v-model="state.agreed"
-          >我已阅读并同意<a
-            v-track-click
-            class="link inline"
-            @click="onAgreementLinkClick"
-            >《大道云平台云豆充值服务协议》</a
-          ></nut-checkbox
-        >
-      </view>
-      <div class="buy-amount">
-        <div class="left">
-          待支付：
-          <span class="amount">
-            <i>￥</i>{{ formatAmount(currentAmount) }}
-          </span>
-        </div>
-        <nut-button
-          block
-          shape="square"
-          :loading="state.buttonLoading"
-          v-track-click
-          @click="onPayClick"
-          class="recharge-button"
-          >购买</nut-button
-        >
-      </div>
-    </view>
-    <nut-dialog
-      title="确认购买"
-      custom-class="trade-dialog"
-      v-model:visible="showDialog"
-      @cancel="showDialog = !showDialog"
-      @ok="beanPay"
-    >
-      <template v-if="amounts[state.selected]">
-        <div class="item">
-          云豆扣减：{{
-            formatAmount(amounts[state.selected].paymentAmount || 0)
-          }}
-        </div>
-        <div class="item">
-          权益增加：{{
-            formatAmount(amounts[state.selected].priceRightNum || 0)
-          }}笔
-        </div>
-        <div class="item">
-          扣减后云豆余额：{{
-            formatAmount(balance - amounts[state.selected].paymentAmount)
-          }}
-        </div>
-      </template>
-    </nut-dialog>
-  </view>
-</template>
-
-<script lang="ts" setup>
-import { computed, onMounted, reactive, ref } from "vue";
-import RightsPicker, { Amount } from './RightsPicker.vue'
-import { endpoints, useHttp } from '../api'
-import { endpoints as balanceEndpoints } from "../../balance/api";
-import { requestBrandWCPayByBean, requestPaymentByBean } from '../services'
-import Taro, { showToast, useRouter, showModal } from '@tarojs/taro'
-import { useAmount } from '../../shared/composables/useAmount'
-import { isWechat } from '../../shared/composables/useDeviceEnv'
-
-// 充值用户界面
-// 配置了必须的属性后
-// 自动获取支付套餐包列表
-// 并发起微信支付
-export interface RechargeViewProps {
-  /**
-   * header头中的appcode，一般情况下与app参数一致，当无应用权限时，此参数未空
-   **/
-  headerApp: string;
-  /**
-   * 应用
-   **/
-  app: string;
-  /**
-   * 充值场景
-   */
-  // stage?: string, // 这个参数暂时不用
-  /**
-   * 租户
-   */
-  tenant: string;
-  /**
-   * h5支付完成后跳转地址
-   */
-  payFinishJumpUrl?: "";
-  /**
-   * 所有应用
-   **/
-   apps?: string;
-  /**
-   * 权益编码
-   */
-  rightCode?: string;
-}
-
-const props = defineProps<RechargeViewProps>();
-const { formatAmount } = useAmount();
-const { params } = useRouter();
-
-const emit = defineEmits<{
-  (event: 'complete', value: { result: boolean, type: string }): void,
-  (event: 'agree'): void,
-  (event: 'loaded'): void,
-}>()
-
-const state = reactive({
-  agreed: false,
-  selected: 0,
-  // agreementOpen: false,
-  buttonLoading: false,
-  thirdPayId: '',
-})
-
-const balance = ref<number>(0);
-const amounts = ref<Amount[]>([]);
-const selectBean = ref<boolean>(false);
-
-const onAgreementLinkClick = (e) => {
-  e.preventDefault();
-  e.stopImmediatePropagation();
-  emit("agree");
-  // state.agreementOpen = true
-};
-
-const onAmountSelect = (selected: number) => {
-  state.selected = selected;
-  selectBean.value = false;
-};
-
-// 计算额外支付金额（当云豆余额不足时）
-const extraPaymentAmount = computed(() => {
-  if (!selectBean.value || !amounts.value[state.selected]) {
-    return 0;
-  }
-  const paymentAmount = amounts.value[state.selected].paymentAmount || 0;
-  const currentBalance = balance.value || 0;
-  return Math.max(0, paymentAmount - currentBalance);
-});
-
-// 计算待支付金额
-const currentAmount = computed(() => {
-  if (!amounts.value[state.selected]) {
-    return 0;
-  }
-
-  // 如果选择了云豆支付
-  if (selectBean.value) {
-    // 如果余额不足，返回额外需要支付的金额
-    if (balance.value < amounts.value[state.selected].paymentAmount) {
-      return extraPaymentAmount.value;
-    }
-    // 如果余额充足，返回0（全部用云豆支付）
-    return 0;
-  }
-
-  // 如果没有选择云豆支付，返回全额
-  return amounts.value[state.selected].paymentAmount || 0;
-});
-
-// 判断是否为组合支付
-const isCombinedPayment = computed(() => {
-  return (
-    selectBean.value &&
-    amounts.value[state.selected] &&
-    balance.value < amounts.value[state.selected].paymentAmount
-  );
-});
-
-onMounted(() => {
-  const $http = useHttp({ Appcode: props.headerApp, Tenant: props.tenant })
-  const rightCode = props.rightCode || params.rightCode || (
-    props.app === 'corporateStar'
-      ? 'riskQueryCompany'
-      : props.app === 'activitykit'
-        ? 'bdxLiteQuery'
-        : 'riskQueryMulti'
-  )
-  $http.get<any[]>(endpoints.获取增值权益类目, {
-    rightCode,
-    scene: isWechat() && props.headerApp ? '' : 'APP'
-  }).then((res: any) => {
-    balance.value = res.balance
-    amounts.value = res.paymentCaseConfigVOS
-    // 如果没有应用权限，只显示5000元多充值档位
-    if (!props.headerApp) {
-      const has5000 = amounts.value.some((item: any) => item.paymentAmount === 5000)
-      if (has5000) {
-        amounts.value = amounts.value.filter((item: any) => item.paymentAmount === 5000)
-      }
-    }
-    emit('loaded')
-  })
-})
-
-// 云豆支付对话框
-const showDialog = ref<boolean>(false);
-
-// 处理确认支付（纯云豆支付）
-async function beanPay() {
-  const $http = useHttp({ Appcode: props.headerApp, Tenant: props.tenant });
-  try {
-    const response: any = await $http.post(
-      `/payment/paymentCaseConfig/purchase/${amounts.value[state.selected].id}`
-    );
-    if (response) {
-      showDialog.value = false;
-      emit("complete", { result: response, type: "bean" });
-    } else {
-      showToast({
-        title: (response as any)?.message || "支付失败",
-        icon: "none",
-      });
-    }
-  } catch (error: any) {
-    showToast({
-      title: error?.message || "支付失败",
-      icon: "none",
-    });
-  }
-}
-
-// 执行微信支付（用于组合支付或纯微信支付）
-function proceedWechatPayment() {
-  if (!state.agreed) {
-    showToast({
-      title: "请勾选《大道云平台云豆充值协议》",
-      icon: "none",
-    });
-    return false;
-  }
-
-  state.buttonLoading = true;
-
-  if (Taro.getEnv() === "WEB") {
-    // if (!isWechat()) {
-    //   showToast({
-    //     title: "请使用微信浏览器打开",
-    //     icon: "none",
-    //   });
-    //   state.buttonLoading = false;
-    //   return false;
-    // }
-    // 组合支付或纯微信支付：传递caseConfigId和amount，后端会自动处理云豆扣减
-    requestBrandWCPayByBean({
-      caseConfigId: amounts.value[state.selected].id,
-      amount: currentAmount.value,
-      app: "loankitMp",
-      tenant: props.tenant,
-      accountAuthFlag: false,
-      channelCode: getChannelCode(),
-      payFinishJumpUrl: props.payFinishJumpUrl,
-      fromMini: !!params.from,
-      useCloudBean: isCombinedPayment.value
-    })
-      .then((result: any) => {
-        state.buttonLoading = false;
-        if (typeof result === "boolean" && result) {
-          window.location.href = props.payFinishJumpUrl as string;
-        } else if (typeof result === 'object' && result?.paymentType === 'H5' && result?.prePayStr) {
-          state.thirdPayId = result?.thirdPayId || ''
-          window.location.href = result?.prePayStr;
-        } else {
-          emit("complete", {
-            result,
-            type: isCombinedPayment.value ? "combined" : "wePay",
-          });
-        }
-      })
-      .catch((error) => {
-        state.buttonLoading = false;
-        showToast({
-          title: error.message || "支付失败",
-          icon: "none",
-        });
-      });
-  } else {
-    wx.login({
-      success({ code }: { code: string }) {
-        requestPaymentByBean(
-          {
-            caseConfigId: amounts.value[state.selected].id,
-            amount: currentAmount.value,
-            app: props.app,
-            tenant: props.tenant,
-            user: code,
-          },
-          props.headerApp
-        )
-          .then((result) => {
-            state.buttonLoading = false;
-            if (result) {
-              emit("complete", {
-                result: true,
-                type: isCombinedPayment.value ? "combined" : "wePay",
-              });
-            }
-          })
-          .catch((error) => {
-            state.buttonLoading = false;
-            showToast({
-              title: error.message || "支付失败",
-              icon: "none",
-            });
-          });
-      },
-      fail() {
-        state.buttonLoading = false;
-        showToast({
-          title: "登录失败，请重试",
-          icon: "none",
-        });
-      },
-    });
-  }
-}
-
-// 根据环境判断渠道编码
-function getChannelCode() {
-  if (isWechat()) {
-    return 'centergzh';
-  } else {
-    return 'YundouZfb';
-  }
-}
-
-const onPayClick = async () => {
-  // 云豆支付与组合支付检验云豆是否已经改变，改变则刷新选择
-  if (isCombinedPayment.value || selectBean.value) {
-    const res = await checkBalance()
-    if (!res) return
-  }
-
-  // 用云豆支付（纯云豆支付）
-  if (selectBean.value && !isCombinedPayment.value) {
-    showDialog.value = true;
-    return;
-  }
-
-  // 纯微信支付
-  proceedWechatPayment();
-}
-
-/**
- * 校验余额是否充足
- */
- async function checkBalance() {
-   const $http = useHttp()
-  return new Promise((resolve, reject) => {
-    state.buttonLoading = true;
-    $http
-      .get<any>(balanceEndpoints.获取余额明细, {
-        app: props.apps,
-      })
-      .then((data) => {
-        state.buttonLoading = false;
-        if (data.commonAccount < balance.value) {
-          showModal({
-            title: '温馨提示',
-            content: '云豆不足，请刷新后再次确认',
-            showCancel: false,
-            confirmText: '刷新',
-            confirmColor: '#017fff',
-            success: () => {
-              balance.value = data.commonAccount;
-            }
-          })
-          resolve(false)
-          
-        } else {
-          resolve(true)
-        }
-      }).catch((error) => {
-        state.buttonLoading = false;
-        resolve(false)
-      })
-  })
-}
-
-const payResultCheck = () => {
-  if (!state.thirdPayId) return
-  
-  const $http = useHttp()
-  $http.get<any>(endpoints.获取支付结果, {
-    thirdPayId: state.thirdPayId
-  }).then(response => {
-    if (response.payStatus === 'paid') {
-      emit("complete", {
-        result: true,
-        type: isCombinedPayment.value ? "combined" : "wePay",
-      });
-    }
-  })
-}
-
-defineExpose({
-  payResultCheck
-})
-</script>
-
-<style lang="scss">
-.recharge-view2 {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  --nut-primary-color: #017fff;
-
-  .flex-grow {
-    flex-grow: 1;
-  }
-
-  .bean-buy {
-    margin: 0 15px;
-    padding: 10px;
-    background: #fffbf3;
-    border-radius: 5px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-wrap: wrap;
-
-    .left {
-      .title {
-        color: #fd6701;
-        font-size: 14px;
-        font-weight: 600;
-        line-height: 20px;
-        margin-bottom: 6px;
-      }
-
-      .amount {
-        color: #353535;
-        font-size: 13px;
-        line-height: 16px;
-        background-image: url("https://cdn.ddjf.com/static/images/appkit/yundou.png");
-        background-repeat: no-repeat;
-        background-size: 16px 16px;
-        padding-left: 24px;
-      }
-    }
-
-    .right {
-      display: flex;
-      align-items: center;
-
-      .amount {
-        color: #353535;
-        font-size: 15px;
-        line-height: 20px;
-        margin-right: 10px;
-      }
-
-      .icon {
-        display: block;
-        width: 16px;
-        height: 16px;
-        font-size: 0;
-      }
-    }
-  }
-
-  .balance-warning {
-    width: 100%;
-    padding: 8px 10px;
-    margin-top: 10px;
-    background: #fdefe6;
-    border-radius: 5px;
-    color: #fd6701;
-    font-size: 12px;
-
-    &-tip {
-      margin: 10px 26px 0;
-      color: #666666;
-      font-size: 10px;
-    }
-  }
-
-  .amount-footer {
-    padding: 10px 0;
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    z-index: 10;
-    background-color: #fff;
-
-    .agreement {
-      font-size: 12px;
-      display: flex;
-      justify-content: center;
-      align-items: cebter;
-      height: 40px;
-    }
-
-    .buy-amount {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      padding: 0 10px;
-      border-radius: 0px;
-      box-shadow: 0px -5px 14px -5px rgba(0, 0, 0, 0.1);
-
-      /* 上边框阴影 */
-      .left {
-        width: 70%;
-        color: #353535;
-        font-size: 13px;
-
-        .amount {
-          color: #fd6701;
-          font-size: 20px;
-          font-weight: 600;
-
-          i {
-            font-size: 14px;
-            font-style: normal;
-          }
-        }
-      }
-
-      .recharge-button {
-        background: linear-gradient(
-          90deg,
-          #ffebc1 0%,
-          #ffd7a7 52.29%,
-          #ffb875 100%
-        );
-        color: #353535;
-        margin: 12px 0;
-        border: 0;
-        border-radius: 8px;
-        flex: 1;
-      }
-    }
-
-    .nut-checkbox {
-      line-height: 40px;
-    }
-
-    .nut-checkbox__label {
-      margin-left: 8px;
-      flex: flex;
-      font-size: 12px;
-    }
-
-    .link {
-      display: inline;
-      color: #fd6701;
-    }
-  }
-}
-
-.trade-dialog {
-  .nut-dialog__header {
-    font-size: 16px;
-    color: #262626;
-  }
-
-  .item {
-    font-size: 14px;
-    color: #666666;
-    line-height: 21px;
-  }
-
-  .nut-dialog__footer-cancel {
-    color: #353535 !important;
-    border-color: #cccccc !important;
-  }
-
-  .nut-dialog__footer-ok {
-    border: none;
-    color: #353535;
-    background: linear-gradient(90deg, #ffebc1 0%, #ffb875 100%);
-  }
-}
-</style>
+<template>
+  <view class="view recharge-view2">
+    <view class="flex-grow">
+      <rights-picker
+        :items="amounts"
+        :selected="state.selected"
+        @change="onAmountSelect"
+      />
+      <div class="bean-buy" v-if="amounts[state.selected]">
+        <div class="left">
+          <div class="title">使用云豆支付</div>
+          <div class="amount" v-if="!selectBean">
+            余额 {{ formatAmount(balance || 0) }}
+          </div>
+          <div class="amount" v-else>
+            扣减后余额
+            {{ balance > amounts[state.selected].paymentAmount ? formatAmount(balance - amounts[state.selected].paymentAmount) : 0 }}
+          </div>
+        </div>
+        <div class="right" @click="selectBean = !selectBean">
+          <div class="amount" >
+            -{{ selectBean && balance < amounts[state.selected].paymentAmount ? balance : formatAmount(amounts[state.selected].paymentAmount || 0) }}
+          </div>
+          <img
+            class="icon"
+            :src="
+              selectBean
+                ? 'https://cdn.ddjf.com/static/images/appkit/select.svg'
+                : 'https://cdn.ddjf.com/static/images/appkit/not-select.svg'
+            "
+          />
+        </div>
+
+        <div class="balance-warning" v-if="isCombinedPayment">
+          云豆余额不足,还需额外支付{{ formatAmount(extraPaymentAmount) }}元
+        </div>
+      </div>
+
+      <div class="balance-warning-tip" v-if="isCombinedPayment">
+        请在支付完成前确保元豆余额不被消耗,否则本次权益可能购买失败
+      </div>
+
+      <slot name="banner"></slot>
+    </view>
+
+    <view class="amount-footer">
+      <view class="agreement" v-if="!selectBean || isCombinedPayment">
+        <nut-checkbox v-model="state.agreed"
+          >我已阅读并同意<a
+            v-track-click
+            class="link inline"
+            @click="onAgreementLinkClick"
+            >《大道云平台云豆充值服务协议》</a
+          ></nut-checkbox
+        >
+      </view>
+      <div class="buy-amount">
+        <div class="left">
+          待支付：
+          <span class="amount">
+            <i>￥</i>{{ formatAmount(currentAmount) }}
+          </span>
+        </div>
+        <nut-button
+          block
+          shape="square"
+          :loading="state.buttonLoading"
+          v-track-click
+          @click="onPayClick"
+          class="recharge-button"
+          >购买</nut-button
+        >
+      </div>
+    </view>
+    <nut-dialog
+      title="确认购买"
+      custom-class="trade-dialog"
+      v-model:visible="showDialog"
+      @cancel="showDialog = !showDialog"
+      @ok="beanPay"
+    >
+      <template v-if="amounts[state.selected]">
+        <div class="item">
+          云豆扣减：{{
+            formatAmount(amounts[state.selected].paymentAmount || 0)
+          }}
+        </div>
+        <div class="item">
+          权益增加：{{
+            formatAmount(amounts[state.selected].priceRightNum || 0)
+          }}笔
+        </div>
+        <div class="item">
+          扣减后云豆余额：{{
+            formatAmount(balance - amounts[state.selected].paymentAmount)
+          }}
+        </div>
+      </template>
+    </nut-dialog>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, reactive, ref } from "vue";
+import RightsPicker, { Amount } from './RightsPicker.vue'
+import { endpoints, useHttp } from '../api'
+import { endpoints as balanceEndpoints } from "../../balance/api";
+import { requestBrandWCPayByBean, requestPaymentByBean } from '../services'
+import Taro, { showToast, useRouter, showModal } from '@tarojs/taro'
+import { useAmount } from '../../shared/composables/useAmount'
+import { isWechat } from '../../shared/composables/useDeviceEnv'
+
+// 充值用户界面
+// 配置了必须的属性后
+// 自动获取支付套餐包列表
+// 并发起微信支付
+export interface RechargeViewProps {
+  /**
+   * header头中的appcode，一般情况下与app参数一致，当无应用权限时，此参数未空
+   **/
+  headerApp: string;
+  /**
+   * 应用
+   **/
+  app: string;
+  /**
+   * 充值场景
+   */
+  // stage?: string, // 这个参数暂时不用
+  /**
+   * 租户
+   */
+  tenant: string;
+  /**
+   * h5支付完成后跳转地址
+   */
+  payFinishJumpUrl?: "";
+  /**
+   * 所有应用
+   **/
+   apps?: string;
+  /**
+   * 权益编码
+   */
+  rightCode?: string;
+}
+
+const props = defineProps<RechargeViewProps>();
+const { formatAmount } = useAmount();
+const { params } = useRouter();
+
+const emit = defineEmits<{
+  (event: 'complete', value: { result: boolean, type: string }): void,
+  (event: 'agree'): void,
+  (event: 'loaded'): void,
+}>()
+
+const state = reactive({
+  agreed: false,
+  selected: 0,
+  // agreementOpen: false,
+  buttonLoading: false,
+  thirdPayId: '',
+})
+
+const balance = ref<number>(0);
+const amounts = ref<Amount[]>([]);
+const selectBean = ref<boolean>(false);
+
+const onAgreementLinkClick = (e) => {
+  e.preventDefault();
+  e.stopImmediatePropagation();
+  emit("agree");
+  // state.agreementOpen = true
+};
+
+const onAmountSelect = (selected: number) => {
+  state.selected = selected;
+  selectBean.value = false;
+};
+
+// 计算额外支付金额（当云豆余额不足时）
+const extraPaymentAmount = computed(() => {
+  if (!selectBean.value || !amounts.value[state.selected]) {
+    return 0;
+  }
+  const paymentAmount = amounts.value[state.selected].paymentAmount || 0;
+  const currentBalance = balance.value || 0;
+  return Math.max(0, paymentAmount - currentBalance);
+});
+
+// 计算待支付金额
+const currentAmount = computed(() => {
+  if (!amounts.value[state.selected]) {
+    return 0;
+  }
+
+  // 如果选择了云豆支付
+  if (selectBean.value) {
+    // 如果余额不足，返回额外需要支付的金额
+    if (balance.value < amounts.value[state.selected].paymentAmount) {
+      return extraPaymentAmount.value;
+    }
+    // 如果余额充足，返回0（全部用云豆支付）
+    return 0;
+  }
+
+  // 如果没有选择云豆支付，返回全额
+  return amounts.value[state.selected].paymentAmount || 0;
+});
+
+// 判断是否为组合支付
+const isCombinedPayment = computed(() => {
+  return (
+    selectBean.value &&
+    amounts.value[state.selected] &&
+    balance.value < amounts.value[state.selected].paymentAmount
+  );
+});
+
+onMounted(() => {
+  const $http = useHttp({ Appcode: props.headerApp, Tenant: props.tenant })
+  const rightCode = props.rightCode || params.rightCode || (
+    props.app === 'corporateStar'
+      ? 'riskQueryCompany'
+      : props.app === 'activitykit'
+        ? 'bdxLiteQuery'
+        : 'riskQueryMulti'
+  )
+  $http.get<any[]>(endpoints.获取增值权益类目, {
+    rightCode,
+    scene: isWechat() && props.headerApp ? '' : 'APP'
+  }).then((res: any) => {
+    balance.value = res.balance
+    amounts.value = res.paymentCaseConfigVOS
+    // 如果没有应用权限，只显示5000元多充值档位
+    if (!props.headerApp) {
+      const has5000 = amounts.value.some((item: any) => item.paymentAmount === 5000)
+      if (has5000) {
+        amounts.value = amounts.value.filter((item: any) => item.paymentAmount === 5000)
+      }
+    }
+    emit('loaded')
+  })
+})
+
+// 云豆支付对话框
+const showDialog = ref<boolean>(false);
+
+// 处理确认支付（纯云豆支付）
+async function beanPay() {
+  const $http = useHttp({ Appcode: props.headerApp, Tenant: props.tenant });
+  try {
+    const response: any = await $http.post(
+      `/payment/paymentCaseConfig/purchase/${amounts.value[state.selected].id}`
+    );
+    if (response) {
+      showDialog.value = false;
+      emit("complete", { result: response, type: "bean" });
+    } else {
+      showToast({
+        title: (response as any)?.message || "支付失败",
+        icon: "none",
+      });
+    }
+  } catch (error: any) {
+    showToast({
+      title: error?.message || "支付失败",
+      icon: "none",
+    });
+  }
+}
+
+// 执行微信支付（用于组合支付或纯微信支付）
+function proceedWechatPayment() {
+  if (!state.agreed) {
+    showToast({
+      title: "请勾选《大道云平台云豆充值协议》",
+      icon: "none",
+    });
+    return false;
+  }
+
+  state.buttonLoading = true;
+
+  if (Taro.getEnv() === "WEB") {
+    // if (!isWechat()) {
+    //   showToast({
+    //     title: "请使用微信浏览器打开",
+    //     icon: "none",
+    //   });
+    //   state.buttonLoading = false;
+    //   return false;
+    // }
+    // 组合支付或纯微信支付：传递caseConfigId和amount，后端会自动处理云豆扣减
+    requestBrandWCPayByBean({
+      caseConfigId: amounts.value[state.selected].id,
+      amount: currentAmount.value,
+      app: "loankitMp",
+      tenant: props.tenant,
+      accountAuthFlag: false,
+      channelCode: getChannelCode(),
+      payFinishJumpUrl: props.payFinishJumpUrl,
+      fromMini: !!params.from,
+      useCloudBean: isCombinedPayment.value
+    })
+      .then((result: any) => {
+        state.buttonLoading = false;
+        if (typeof result === "boolean" && result) {
+          window.location.href = props.payFinishJumpUrl as string;
+        } else if (typeof result === 'object' && result?.paymentType === 'H5' && result?.prePayStr) {
+          state.thirdPayId = result?.thirdPayId || ''
+          window.location.href = result?.prePayStr;
+        } else {
+          emit("complete", {
+            result,
+            type: isCombinedPayment.value ? "combined" : "wePay",
+          });
+        }
+      })
+      .catch((error) => {
+        state.buttonLoading = false;
+        showToast({
+          title: error.message || "支付失败",
+          icon: "none",
+        });
+      });
+  } else {
+    wx.login({
+      success({ code }: { code: string }) {
+        requestPaymentByBean(
+          {
+            caseConfigId: amounts.value[state.selected].id,
+            amount: currentAmount.value,
+            app: props.app,
+            tenant: props.tenant,
+            user: code,
+          },
+          props.headerApp
+        )
+          .then((result) => {
+            state.buttonLoading = false;
+            if (result) {
+              emit("complete", {
+                result: true,
+                type: isCombinedPayment.value ? "combined" : "wePay",
+              });
+            }
+          })
+          .catch((error) => {
+            state.buttonLoading = false;
+            showToast({
+              title: error.message || "支付失败",
+              icon: "none",
+            });
+          });
+      },
+      fail() {
+        state.buttonLoading = false;
+        showToast({
+          title: "登录失败，请重试",
+          icon: "none",
+        });
+      },
+    });
+  }
+}
+
+// 根据环境判断渠道编码
+function getChannelCode() {
+  if (isWechat()) {
+    return 'centergzh';
+  } else {
+    return 'YundouZfb';
+  }
+}
+
+const onPayClick = async () => {
+  // 云豆支付与组合支付检验云豆是否已经改变，改变则刷新选择
+  if (isCombinedPayment.value || selectBean.value) {
+    const res = await checkBalance()
+    if (!res) return
+  }
+
+  // 用云豆支付（纯云豆支付）
+  if (selectBean.value && !isCombinedPayment.value) {
+    showDialog.value = true;
+    return;
+  }
+
+  // 纯微信支付
+  proceedWechatPayment();
+}
+
+/**
+ * 校验余额是否充足
+ */
+ async function checkBalance() {
+   const $http = useHttp()
+  return new Promise((resolve, reject) => {
+    state.buttonLoading = true;
+    $http
+      .get<any>(balanceEndpoints.获取余额明细, {
+        app: props.apps,
+      })
+      .then((data) => {
+        state.buttonLoading = false;
+        if (data.commonAccount < balance.value) {
+          showModal({
+            title: '温馨提示',
+            content: '云豆不足，请刷新后再次确认',
+            showCancel: false,
+            confirmText: '刷新',
+            confirmColor: '#017fff',
+            success: () => {
+              balance.value = data.commonAccount;
+            }
+          })
+          resolve(false)
+          
+        } else {
+          resolve(true)
+        }
+      }).catch((error) => {
+        state.buttonLoading = false;
+        resolve(false)
+      })
+  })
+}
+
+const payResultCheck = () => {
+  if (!state.thirdPayId) return
+  
+  const $http = useHttp()
+  $http.get<any>(endpoints.获取支付结果, {
+    thirdPayId: state.thirdPayId
+  }).then(response => {
+    if (response.payStatus === 'paid') {
+      emit("complete", {
+        result: true,
+        type: isCombinedPayment.value ? "combined" : "wePay",
+      });
+    }
+  })
+}
+
+defineExpose({
+  payResultCheck
+})
+</script>
+
+<style lang="scss">
+.recharge-view2 {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  --nut-primary-color: #017fff;
+
+  .flex-grow {
+    flex-grow: 1;
+  }
+
+  .bean-buy {
+    margin: 0 15px;
+    padding: 10px;
+    background: #fffbf3;
+    border-radius: 5px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+
+    .left {
+      .title {
+        color: #fd6701;
+        font-size: 14px;
+        font-weight: 600;
+        line-height: 20px;
+        margin-bottom: 6px;
+      }
+
+      .amount {
+        color: #353535;
+        font-size: 13px;
+        line-height: 16px;
+        background-image: url("https://cdn.ddjf.com/static/images/appkit/yundou.png");
+        background-repeat: no-repeat;
+        background-size: 16px 16px;
+        padding-left: 24px;
+      }
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+
+      .amount {
+        color: #353535;
+        font-size: 15px;
+        line-height: 20px;
+        margin-right: 10px;
+      }
+
+      .icon {
+        display: block;
+        width: 16px;
+        height: 16px;
+        font-size: 0;
+      }
+    }
+  }
+
+  .balance-warning {
+    width: 100%;
+    padding: 8px 10px;
+    margin-top: 10px;
+    background: #fdefe6;
+    border-radius: 5px;
+    color: #fd6701;
+    font-size: 12px;
+
+    &-tip {
+      margin: 10px 26px 0;
+      color: #666666;
+      font-size: 10px;
+    }
+  }
+
+  .amount-footer {
+    padding: 10px 0;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    z-index: 10;
+    background-color: #fff;
+
+    .agreement {
+      font-size: 12px;
+      display: flex;
+      justify-content: center;
+      align-items: cebter;
+      height: 40px;
+    }
+
+    .buy-amount {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0 10px;
+      border-radius: 0px;
+      box-shadow: 0px -5px 14px -5px rgba(0, 0, 0, 0.1);
+
+      /* 上边框阴影 */
+      .left {
+        width: 70%;
+        color: #353535;
+        font-size: 13px;
+
+        .amount {
+          color: #fd6701;
+          font-size: 20px;
+          font-weight: 600;
+
+          i {
+            font-size: 14px;
+            font-style: normal;
+          }
+        }
+      }
+
+      .recharge-button {
+        background: linear-gradient(
+          90deg,
+          #ffebc1 0%,
+          #ffd7a7 52.29%,
+          #ffb875 100%
+        );
+        color: #353535;
+        margin: 12px 0;
+        border: 0;
+        border-radius: 8px;
+        flex: 1;
+      }
+    }
+
+    .nut-checkbox {
+      line-height: 40px;
+    }
+
+    .nut-checkbox__label {
+      margin-left: 8px;
+      flex: flex;
+      font-size: 12px;
+    }
+
+    .link {
+      display: inline;
+      color: #fd6701;
+    }
+  }
+}
+
+.trade-dialog {
+  .nut-dialog__header {
+    font-size: 16px;
+    color: #262626;
+  }
+
+  .item {
+    font-size: 14px;
+    color: #666666;
+    line-height: 21px;
+  }
+
+  .nut-dialog__footer-cancel {
+    color: #353535 !important;
+    border-color: #cccccc !important;
+  }
+
+  .nut-dialog__footer-ok {
+    border: none;
+    color: #353535;
+    background: linear-gradient(90deg, #ffebc1 0%, #ffb875 100%);
+  }
+}
+</style>