fix(pay): 更新支付页面文案及逻辑

石广澎

2025-11-30 18b45638fe3aac07e65aeb5b1da337d4e4bdc87c

 pages/pay/scanpay.vue

@@ -1,10 +1,11 @@
<!-- 扫码支付 -->
<template>
  <view class="page">
    <u-alert closable description="安全提醒：预充值金额由邮储银行监管!" type="warning"></u-alert>
    <view class="shop u-flex u-row-between">
      <view class="u-m-r-30">
        <view class="u-font-28 color-666 u-m-b-10">付款给</view>
        <view class="u-font-34 font-bold color-333">{{ shopInfo.shop_name }}</view>
        <view class="u-font-44 font-bold color-333">{{ shopInfo.shop_name }}</view>
      </view>
      <image :src="shopInfo.logo_image||'/static/imgs/store-logo.png'" class="avg-img"></image>
    </view>
@@ -22,13 +23,30 @@
      </view>
      <view class="u-font-28 color-666 u-m-t-60">选择支付方式</view>
      <u-radio-group v-model="payWay" placement="column">
        <view v-if="platform == 15" class="u-border-bottom u-p-v-20 u-flex u-row-between">
          <image class="pay-icon" src="@/static/imgs/pay-union.png"></image>
          <view class="flex-1">
            <view class="u-font-30 color-333">云闪付</view>
            <text v-if="isNew" class="tag u-m-t-10">会员享优惠</text>
            <text v-if="!isNew&&token&&shopInfo.use_score_flag&&shopInfo.app_pay_use_score_flag" class="u-font-24 color-999 u-m-t-10">
              可用
              <text class="color-red">{{ integral }}</text>
              积分
            </text>
          </view>
          <view v-if="token&&couponInfo&&shopInfo.user_coupon_flag&&shopInfo.app_pay_use_coupon_flag" class="tag-pain">
            满{{
              parseFloat((couponInfo.thresholdValue / 100).toFixed(2))
            }}元减{{ parseFloat((couponInfo.discount / 100).toFixed(2)) }}元
          </view>
          <u-radio :customStyle="{ marginLeft: '10rpx' }" :name="15" activeColor="#D41F28" @change="radioChange($event,15)"></u-radio>
        </view>
        <view v-if="platform == 5" class="u-border-bottom u-p-v-20 u-flex u-row-between">
          <image src="@/static/imgs/pay-zfb.png" class="pay-icon"></image>
          <image class="pay-icon" mode="widthFix" src="@/static/imgs/pay-zfb.png"></image>
          <view class="flex-1">
            <view class="u-font-30 color-333">支付宝</view>
            <text v-if="isNew" class="tag u-m-t-10">会员享优惠</text>
            <text v-if="!isNew&&token&&shopInfo.use_score_flag&&shopInfo.app_pay_use_score_flag"
                  class="u-font-24 color-999 u-m-t-10">
            <text v-if="!isNew&&token&&shopInfo.use_score_flag&&shopInfo.app_pay_use_score_flag" class="u-font-24 color-999 u-m-t-10">
              可用
              <text class="color-red">{{ integral }}</text>
              积分
@@ -39,16 +57,14 @@
              parseFloat((couponInfo.thresholdValue / 100).toFixed(2))
            }}元减{{ parseFloat((couponInfo.discount / 100).toFixed(2)) }}元
          </view>
          <u-radio @change="radioChange($event,5)" :name="5" activeColor="#D41F28"
                   :customStyle="{ marginLeft: '10rpx' }"></u-radio>
          <u-radio :customStyle="{ marginLeft: '10rpx' }" :name="5" activeColor="#D41F28" @change="radioChange($event,5)"></u-radio>
        </view>
        <view v-if="platform == 2" class="u-border-bottom u-p-v-20 u-flex u-row-between">
          <image src="@/static/imgs/pay-wx.png" class="pay-icon"></image>
          <image class="pay-icon" mode="widthFix" src="@/static/imgs/pay-wx.png"></image>
          <view class="flex-1">
            <view class="u-font-30 color-333">微信</view>
            <text v-if="isNew" class="tag u-m-t-10">会员享优惠</text>
            <text v-if="!isNew&&token&&shopInfo.use_score_flag&&shopInfo.app_pay_use_score_flag"
                  class="u-font-24 color-999 u-m-t-10">
            <text v-if="!isNew&&token&&shopInfo.use_score_flag&&shopInfo.app_pay_use_score_flag" class="u-font-24 color-999 u-m-t-10">
              可用
              <text class="color-red">{{ integral }}</text>
              积分
@@ -59,93 +75,119 @@
              parseFloat((couponInfo.thresholdValue / 100).toFixed(2))
            }}元减{{ parseFloat((couponInfo.discount / 100).toFixed(2)) }}元
          </view>
          <u-radio @change="radioChange($event,2)" :name="2" activeColor="#D41F28"
                   :customStyle="{ marginLeft: '10rpx' }">
          <u-radio :customStyle="{ marginLeft: '10rpx' }" :name="2" activeColor="#D41F28" @change="radioChange($event,2)">
          </u-radio>
        </view>
        <navigator v-if="shuaka&&token&&bankCard!=-1" class="shuka" url="/pages/pay/shuaKa/shuaKa">
          <image src="/static/shuaka/shuaka.png" mode=""></image>
        </navigator>
        <view v-if="bankCard.id" class="u-border-bottom u-p-v-20 u-flex">
          <view @click="bordShow=false;bankCardOpen=true" class="flex-1 u-flex">
            <image :src="bankCardStyle.logo" class="pay-icon"></image>
            <view>
              <view class="u-font-30 color-333 u-flex">
                {{ bankCard.bankName }}({{ cardType[bankCard.cardType] }})({{ bankCard.cardNo }})
                <u-icon name="arrow-right"
                        color="#000">
                </u-icon>
              </view>
              <!-- <text v-if="isNew" class="tag u-m-t-10">会员享优惠</text> -->
              <text v-if="!isNew&&shopInfo.use_score_flag&&shopInfo.bank_pay_use_score_flag"
                    class="u-font-24 color-999 u-m-t-10">
                可用
                <text class="color-red">{{ integral }}</text>
                积分
              </text>
        <view class="u-border-bottom u-p-v-20 u-flex u-row-between">
          <image class="pay-icon" mode="widthFix" src="@/static/zjjg/yue.png"></image>
          <view class="flex-1">
            <view class="u-flex">
              <view class="u-font-30 color-333">储值卡</view>
              <navigator class="u-m-l-30" :url="`/pages/pay/recharge?cardInfo=${encodeURIComponent(JSON.stringify(cardInfo))}`">
                <u-button size="mini" type="warning">去充值</u-button>
              </navigator>
            </view>

            <text class="u-font-24 color-999 u-m-t-10">
              可用余额
              <text class="color-red">￥{{ cardInfo.amount }}</text>
            </text>
          </view>
          <view v-if="!isNew&&shopInfo.user_coupon_flag&&shopInfo.bank_pay_use_coupon_flag&&couponInfo"
                class="tag-pain">
            满{{
              parseFloat((couponInfo.thresholdValue / 100).toFixed(2))
            }}元减{{ parseFloat((couponInfo.discount / 100).toFixed(2)) }}元
          </view>
          <u-radio @change="radioChange($event,3, bankCard.id)" :name="3" activeColor="#D41F28"
                   :customStyle="{ marginLeft: '10rpx' }">

          <u-radio :customStyle="{ marginLeft: '10rpx' }" :name="14" activeColor="#D41F28" @change="radioChange($event,14)">
          </u-radio>
        </view>
        <!--            <navigator v-if="shuaka&&token&&bankCard!=-1" class="shuka" url="/pages/pay/shuaKa/shuaKa">
                  <image src="/static/shuaka/shuaka.png" mode=""></image>
                </navigator>
                <view v-if="bankCard.id" class="u-border-bottom u-p-v-20 u-flex">
                  <view @click="bordShow=false;bankCardOpen=true" class="flex-1 u-flex">
                    <image :src="bankCardStyle.logo" class="pay-icon"></image>
                    <view>
                      <view class="u-font-30 color-333 u-flex">
                        {{ bankCard.bankName }}({{ cardType[bankCard.cardType] }})({{ bankCard.cardNo }})
                        <u-icon name="arrow-right" color="#000">
                        </u-icon>
                      </view>
                      &lt;!&ndash; <text v-if="isNew" class="tag u-m-t-10">会员享优惠</text> &ndash;&gt;
                      <text v-if="!isNew&&shopInfo.use_score_flag&&shopInfo.bank_pay_use_score_flag" class="u-font-24 color-999 u-m-t-10">
                        可用
                        <text class="color-red">{{ integral }}</text>
                        积分
                      </text>
                    </view>
                  </view>
                  <view v-if="!isNew&&shopInfo.user_coupon_flag&&shopInfo.bank_pay_use_coupon_flag&&couponInfo" class="tag-pain">
                    满{{
                      parseFloat((couponInfo.thresholdValue / 100).toFixed(2))
                    }}元减{{ parseFloat((couponInfo.discount / 100).toFixed(2)) }}元
                  </view>
                  <u-radio @change="radioChange($event,3)" :name="bankCard.id" activeColor="#D41F28" :customStyle="{ marginLeft: '10rpx' }">
                  </u-radio>
                </view>-->
      </u-radio-group>
      <navigator v-if="bankCard==-1&&bindCard&&token&&!isNew" class="shuka" url="/pages/pay/bindCard/bindCard">
        <image src="/static/bangka.png" mode=""></image>
      </navigator>
      <navigator v-if="bankCard==-1&&!isNew" url="/pages/pay/bindCard/bindCard"
                 class="u-border-bottom u-p-v-20 u-flex u-row-between">
        <view class="u-flex-1 u-flex ">
          <image class="pay-icon" :src="bankCardStyle.logo" mode=""></image>
          <view class="flex-1 u-m-l-20">
            <view class="u-font-30 color-333">银行卡</view>
            <view class="u-font-24 color-red">绑卡可享更多优惠</view>
          </view>
      <navigator :url="`/pages/pay/vipEwm?cardInfo=${encodeURIComponent(JSON.stringify(cardInfo1))}`" class="u-border-bottom u-p-v-20 u-flex u-row-between">
        <image class="pay-icon" mode="widthFix" src="@/static/zjjg/cika.png"></image>
        <view class="flex-1 u-m-l-20">
          <view class="u-font-30 color-333">次卡支付</view>
          <text class="u-font-24 color-999 u-m-t-10">
            可用次数
            <text class="color-red">{{ cardInfo1.times }}次</text>
          </text>
        </view>
        <u-radio disabled activeColor="#D41F28" :customStyle="{ marginLeft: '30rpx' }">
        </u-radio>
      </navigator>
      <navigator v-if="isNew" class="reg-btn" :url="'/pages/pay/register?cid='+cid">
        <image src="/static/register-btn.png" mode=""></image>
      <!--         <navigator v-if="bankCard==-1&&bindCard&&token&&!isNew" class="shuka" url="/pages/pay/bindCard/bindCard">
              <image src="/static/bangka.png" mode=""></image>
            </navigator>
            <navigator v-if="bankCard==-1&&!isNew" url="/pages/pay/bindCard/bindCard" class="u-border-bottom u-p-v-20 u-flex u-row-between">
              <view class="u-flex-1 u-flex ">
                <image class="pay-icon" :src="bankCardStyle.logo" mode=""></image>
                <view class="flex-1 u-m-l-20">
                  <view class="u-font-30 color-333">银行卡</view>
                  <view class="u-font-24 color-red">绑卡可享更多优惠</view>
                </view>
              </view>
              <u-radio disabled activeColor="#D41F28" :customStyle="{ marginLeft: '30rpx' }">
              </u-radio>
            </navigator>-->
      <!--         <navigator v-if="isNew" class="reg-btn" :url="'/pages/pay/register?cid='+cid">
              <image src="/static/register-btn.png" mode=""></image>
            </navigator>-->
      <navigator :url="'/pages/pay/register?cid='+cid" class="reg-url">
        加入《{{ shopInfo.shop_name }}》会员，享受更多优惠
      </navigator>
    </view>


    <button class="pay-it" @click="pay">付款</button>
    <!-- 选择银行卡 -->
    <u-popup mode="bottom" :closeable="true" :show="bankCardOpen" :round="10" @close="bankCardOpen = false">
    <u-popup :closeable="true" :round="10" :show="bankCardOpen" mode="bottom" @close="bankCardOpen = false">
      <view class="u-font-32 color-333 u-text-center u-p-30 u-border-bottom">选择银行支付</view>
      <scroll-view scroll-y class="u-p-h-30 bankCard-list">
      <scroll-view class="u-p-h-30 bankCard-list" scroll-y>
        <block v-for="(item,i) in bankCardList" :key="i">
          <view @click="chooseBankCard(item)" class="u-border-bottom u-p-v-30 u-flex">
          <view class="u-border-bottom u-p-v-30 u-flex" @click="chooseBankCard(item)">
            <view class="flex-1 u-flex">
              <image :src="bankCardStyle.logo" class="pay-icon"></image>
              <image :src="bankCardStyle.logo" class="pay-icon" mode="widthFix"></image>
              <view>
                <view class="u-font-26 color-333">{{ item.bankName }}</view>
                <view class="u-m-t-10 u-font-28 color-333">{{ cardType[item.cardType] }}({{ item.cardNo }})
                </view>
              </view>
            </view>
            <u-icon name="checkbox-mark" :color="bankCardId==item.id?'#D31F28':'#fff'" size="22"></u-icon>
            <u-icon :color="bankCardId==item.id?'#D31F28':'#fff'" name="checkbox-mark" size="22"></u-icon>
          </view>
        </block>
        <navigator url="/pages/pay/bindCard/bindCard" class="u-border-bottom u-p-v-30 u-flex">
        <navigator class="u-border-bottom u-p-v-30 u-flex" url="/pages/pay/bindCard/bindCard">
          <view class="add-icon">
            <u-icon name="plus" bold color="#D31F28"></u-icon>
            <u-icon bold color="#D31F28" name="plus"></u-icon>
          </view>
          <view class="u-font-28 color-333 u-m-l-20">使用新卡支付</view>
        </navigator>
      </scroll-view>
    </u-popup>
    <!-- 数字键盘 -->
    <u-popup :show="bordShow" :overlay="false" @close="bordShow = false">
      <key-bord @changeMoney="changeMoney" :num.sync="money" @close="bordShow = false" @pay="pay"></key-bord>
    <u-popup :overlay="false" :show="bordShow" @close="bordShow = false">
      <key-bord :num.sync="money" @changeMoney="changeMoney" @close="bordShow = false" @pay="pay"></key-bord>
    </u-popup>
    <!-- 支付验证码 -->
    <u-popup :show="codeShow" closeable mode="center" @close="codeShow = false">
@@ -154,11 +196,10 @@
        <view class="u-text-center u-m-b-20 color-666">{{ shopInfo.shop_name }}</view>
        <view class="u-flex u-row-center font-bold u-m-b-40">
          <text class="u-font-42">￥</text>
          <text
              class="u-font-money">{{ money }}
          <text class="u-font-money">{{ money }}
          </text>
        </view>
        <u-code-input @finish="bankPay" v-model="smscode" mode="box" :focus="true"></u-code-input>
        <u-code-input v-model="smscode" :focus="true" mode="box" @finish="bankPay"></u-code-input>
      </view>

    </u-popup>
@@ -166,33 +207,28 @@
</template>

<script>
import {
  config,
  cardType,
  ACCESSTOKEN
} from '@/common/config.js';
import {
  headBand,
  bankCardStyle,
  myBankCard,
  queryShop,
  queryMyDiscount,
  getScoreWorth,
  userLogin,
  queryScore,
  queryMyUseSweepPayMaxCoupon,
  getWechatConfigInfo,
  saveWxOrder,
  tlPay
} from '@/common/api/index'
import {ACCESSTOKEN, cardType, config} from '@/common/config.js';
import {bankCardStyle, getScoreWorth, getWechatConfigInfo, headBand, myBankCard, queryMyDiscount, queryMyUseSweepPayMaxCoupon, queryScore, queryShop, saveWxOrder, tlPay, userLogin} from '@/common/api/index'
import wx from 'weixin-js-sdk'; // 使用js-sdk
import {
  activityInfo
} from '@/common/api/shuaka'
import {activityInfo} from '@/common/api/shuaka'

export default {
  data() {
    return {
      cardInfo1: {
        type: 1,
        name: '',
        amount: 0,
        score: 0,
        times: 12
      },
      cardInfo: {
        type: 0,
        name: '',
        amount: 200,
        score: 0,
        times: 12
      },
      platform: this.$utils.getPlat(),
      cardType: cardType,
      cid: '',
@@ -211,7 +247,7 @@
      money: '', // 金额
      integral: 0, // 使用积分
      couponInfo: null, // 优惠券内容
      payWay: 3, //支付方式 5 支付宝 2 微信 3银行卡
      payWay: 3, //支付方式 5 支付宝 2 微信 3银行卡 15云闪付
      token: null,
      isNew: false, // 是否新用户，新用户查询不到积分和银行卡
      codeShow: false, // 银行卡支付验证码输入弹窗
@@ -246,10 +282,13 @@
      uni.setStorageSync('CID', opt.cid)
      this.init()
    }
    if (opt.code || opt.auth_code) {
    if (opt.code || opt.auth_code || opt.userAuthCode) {
      let code = opt.code
      if (this.platform == 5) {
        code = opt.auth_code
      }
      if (this.platform == 15) {
        code = opt.userAuthCode
      }
      this.end++
      userLogin({
@@ -262,6 +301,7 @@
      }).catch(() => {
        uni.hideLoading()
      })

    } else {
      if (process.env.NODE_ENV === 'development') {
        console.log('开发环境');
@@ -294,7 +334,7 @@
    this.canReset = true
  },
  methods: {
    getToken(res){
    getToken(res) {
      this.count++
      if (this.count >= this.end) {
        uni.hideLoading()
@@ -307,12 +347,9 @@
        this.getUserInfo()
      }
    },
    radioChange(e, item, bankCardId) {
    radioChange(e, item) {
      this.bordShow = false
      this.payWay = item
      if(bankCardId){
        this.bankCardId = bankCardId
      }
    },
    // 更新金额
    changeMoney(str) {
@@ -343,7 +380,10 @@
            res.logo_image = ''
          }
        }
        uni.setStorageSync('SHOP_INFO', res)
        this.shopInfo = res
        this.cardInfo.name = res.shop_name
        this.cardInfo1.name = res.shop_name
      }).catch(() => {
        uni.hideLoading()
      })
@@ -507,26 +547,25 @@
    },
    //跳转营销页面
    toDiscount() {
      const shopInfo = encodeURIComponent(JSON.stringify(this.shopInfo))
      if (!this.isNew) { //是会员
        if (this.integral > 0 || this.couponInfo) { //有优惠券或积分
          if (this.payWay == 3 && (this.shopInfo.bank_pay_use_score_flag || this.shopInfo
              .bank_pay_use_coupon_flag)) { //银行卡支付

            uni.navigateTo({
              url: `/pages/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
              url: `/pages/pay/discountpay?integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
            })
            return false
          } else if ((this.shopInfo.use_score_flag && this.shopInfo.app_pay_use_score_flag) || (this
              .shopInfo
              .user_coupon_flag && this.shopInfo.app_pay_use_coupon_flag)) {
            uni.navigateTo({
              url: `/pages/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
              url: `/pages/pay/discountpay?integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
            })
            return false
          } else if (this.discount.shopDiscount != 1) {
            uni.navigateTo({
              url: `/pages/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
              url: `/pages/pay/discountpay?integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
            })
            return false
          } else {
@@ -534,7 +573,7 @@
          }
        } else if (this.discount.shopDiscount != 1) {
          uni.navigateTo({
            url: `/pages/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
            url: `/pages/pay/discountpay?integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
          })
          return false
        } else {
@@ -551,7 +590,7 @@
        return
      }
      this.bordShow = false
      // return this.toDiscount() //判断是否需要跳转营销页面
      //判断是否需要跳转营销页面
      if (this.toDiscount()) {
        // 金额 this.money
        uni.showLoading()
@@ -586,9 +625,7 @@
                this.aliPay(res.paymentData)
              }
            } else if (res.toPayMethod == 3) {
              // window.location.href = res.paymentUrl
              this.smscode = ''
              this.codeShow = true
              window.location.href = res.paymentUrl
            }
          } catch (e) {
            //TODO handle the exception
@@ -602,6 +639,23 @@
    },
    // 微信支付
    wxPay(res) {
      /*setTimeout(() => {
        wx.chooseWXPay({
          timestamp: res.timeStamp, // 支付签名时间戳
          nonceStr: res.nonceStr, // 支付签名随机串，不长于 32 位
          package: res.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
          signType: res.signType, // 微信支付V3的传入 RSA ,微信支付V2的传入格式与V2统一下单的签名格式保持一致
          paySign: res.paySign, // 支付签名
          success: function (res) {
            // 支付成功后的回调函数
            uni.navigateTo({
              url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                  .stringify(this.youHuiInfo)}`
            })
          }
        });
      }, 200)*/

      setTimeout(() => {
        WeixinJSBridge.invoke(
            'getBrandWCPayRequest', {
@@ -616,10 +670,10 @@
              if (res.err_msg == "get_brand_wcpay_request:ok") {
                // 使用以上方式判断前端返回,微信团队郑重提示：
                //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
                uni.navigateTo({
                /*uni.navigateTo({
                  url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                      .stringify(this.youHuiInfo)}`
                })
                })*/
              }
            });
      }, 200)
@@ -630,10 +684,10 @@
        tradeNO: res.tradeNO
      }, (res) => {
        if (res.resultCode == 9000) {
          uni.navigateTo({
          /*uni.navigateTo({
            url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                .stringify(this.youHuiInfo)}`
          })
              .stringify(this.youHuiInfo)}`
          })*/
          // 支付成功
        } else if (res.resultCode == 8000 || res.resultCode == 6001) {
          // 正在处理中 || 取消
@@ -666,7 +720,7 @@
};
</script>

<style scoped lang="scss">
<style lang="scss" scoped>
.page {
  height: calc(100vh - 0px);
  display: flex;
@@ -727,7 +781,6 @@
.pay-icon {
  align-self: flex-start;
  width: 48rpx;
  height: 48rpx;
  margin-right: 20rpx;
}

@@ -836,7 +889,7 @@

.btn {
  /* position: fixed;
  bottom: 100rpx; */
bottom: 100rpx; */
  margin: 0 auto;
  margin-top: 120rpx;
  position: relative;
@@ -849,4 +902,11 @@
  width: 680rpx;
  height: 100rpx;
}

.reg-url {
  text-align: center;
  font-size: 28rpx;
  margin-top: 30rpx;
  color: #de2d35;
}
</style>