feat(支付): 修改授权逻辑 进入页面判断本地是否有openid,没有的话跳转微信授权，有的话直接到支付页，使用

石广澎

2024-07-10 817ebd8af46cbb19be31103600ad009437e1f12f

feat(支付):
修改授权逻辑
进入页面判断本地是否有openid,没有的话跳转微信授权，有的话直接到支付页，使用

 App.vue

@@ -1,7 +1,31 @@
<script>
import {
  config,
} from 'common/config.js';
import {
  getPlat
} from 'common/util.js';
    export default {
        onLaunch: function() {
            console.log('App Launch')
        onLaunch: function(opt) {
      /*console.log(opt)
      let platform = 2
      const redirect_uri = encodeURIComponent(`${config.webURL}/pay/scanpay?cid=${opt.query.cid}`)
      console.log('OPENID'+platform,!!uni.getStorageSync('OPENID'+platform))
      if(!!uni.getStorageSync('OPENID'+platform)){
        window.location.href = redirect_uri
        return
      }
      return
      if(!opt.query.code && !opt.query.auth_code){
        console.log('auth',platform, !opt.query.code && !opt.query.auth_code)
        if (platform == 2) {
          window.location.href =redirect_uri+'&code=sadfkhnadsmuk'
              //`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${config.wx_appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`
        } else if (platform == 5) {
          window.location.href =redirect_uri
              //`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=${config.ali_appid}&scope=auth_base&redirect_uri=${redirect_uri}&state=STATE`
        }
      }*/
        },
        onShow: function() {
            console.log('App Show')

 common/api/index.js

@@ -58,8 +58,13 @@
/* 微信支付 */
export const saveWxOrder = (params, config = {}) => http.post(URL +
    '/payfour-merchant/v1/web/aggregatePayAllin/saveWxOrder', params, config = {});
/*统一支付*/
export const saveOrder = (params, config = {}) => http.post(URL +
    '/payfour-merchant/v1/web/aggregatePayAllin/saveOrder', params, config = {});

/*取消订单*/
export const closeOrder = (params, config = {}) => http.get(URL +
    '/payfour-merchant/v1/web/aggregatePayAllin/scanPayOrderClose', params, config = {});

/* 图形验证吗 */
export const getVerify = (params, config = {}) => http.get(URL +
@@ -75,7 +80,7 @@

/* 通联快捷支付 */
export const tlPay = (params, config = {}) => http.post(URL +
    '/payfour-merchant/v1/web/aggregatePayAllin/payagreeconfirm',
    '/payfour-merchant/v1/web/aggregatePayAllin/pay/scanpayagreeconfirm',
    params, config = {});

/* 微信支付结果 */

 common/config.js

@@ -2,7 +2,7 @@

// 开发
const dev = {
    webURL: 'https://sfzf.cpbtsoft.cn/pay',
    webURL: 'https://sfzf.cpbtsoft.cn',
    baseURL: '/dev-api',
    sftpURL: 'https://yqzx.jinmingyuan.com/file',
    wx_appid: 'wx4c146dba764dcb05',
@@ -10,7 +10,7 @@
}
// 测试
const test = {
    webURL: 'https://sfzf.cpbtsoft.cn/pay',
    webURL: 'https://sfzf.cpbtsoft.cn',
    baseURL: 'https://sfzf.cpbtsoft.cn/prod-api',
    sftpURL: 'https://sfzf.cpbtsoft.cn/file',
    wx_appid: 'wx4c146dba764dcb05',
@@ -18,7 +18,7 @@
}
// 正式
const prod = {
    webURL: 'https://jmy.jinmingyuan.com/pay',
    webURL: 'https://jmy.jinmingyuan.com',
    baseURL: 'https://yqzx.jinmingyuan.com',
    sftpURL: 'https://yqzx.jinmingyuan.com/file',
    wx_appid: 'wx4c146dba764dcb05',
@@ -30,7 +30,7 @@
    '02': '信用卡'
}
module.exports = {
    config: dev,
    config: test,
    ACCESSTOKEN: "Authorization",
    /* 是否打印请求日志 */
    DEBUG: false,

 common/http.interceptor.js

@@ -62,7 +62,7 @@
            vm.$u.toast("授权过期,请重新登录");
            setTimeout(() => {
                uni.reLaunch({
                    url: "/pages/pay/scanpay?cid=" + cid
                    url: "/pay/login?cid=" + cid
                })
            }, 800);
            return Promise.reject(res)
@@ -76,4 +76,4 @@
        vm.$u.toast("请求异常！"); //错误提示信息
        return Promise.reject(response)
    })
}
}

 manifest.json

@@ -71,9 +71,9 @@
    },
    "vueVersion" : "2",
    "h5" : {
        "title" : "支付",
        "title" : "邮佰惠",
        "router" : {
            "base" : "/pay/",
            "base" : "/",
            "mode" : "history"
        },
        "devServer" : {

 pages.json

@@ -2,8 +2,9 @@
    "easycom": {
        "^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
    },
    "pages": [{
            "path": "pages/pay/scanpay",
    "pages": [
        {
            "path": "pay/scanpay",
            "style": {
                "navigationBarTitleText": "支付",
                "enablePullDownRefresh": false
@@ -12,8 +13,9 @@
                "navigationStyle": "custom"
                // #endif
            }
        }, {
            "path": "pages/pay/discountpay",
        },
        {
            "path": "pay/discountpay",
            "style": {
                "navigationBarTitleText": "优惠",
                "enablePullDownRefresh": false
@@ -23,15 +25,9 @@
                // #endif
            }

        },{
            "path": "pages/pay/wxpay",
            "style": {
                // #ifdef H5
                "navigationStyle": "custom"
                // #endif
            }
        }, {
            "path": "pages/pay/register",
        },
        {
            "path": "pay/register",
            "style": {
                "navigationBarTitleText": "注册",
                "enablePullDownRefresh": false
@@ -41,8 +37,9 @@
                // #endif
            }

        }, {
            "path": "pages/pay/paySuccess",
        },
        {
            "path": "pay/paySuccess",
            "style": {
                "navigationBarTitleText": "支付成功",
                "enablePullDownRefresh": false
@@ -52,81 +49,11 @@
                // #endif
            }

        }, {
            "path": "pages/pay/scanRes",
            "style": {
                "navigationStyle": "custom"
            }
        }, {
            "path": "pages/pay/login",
        },
        {
            "path": "pay/login",
            "style": {
                "navigationBarTitleText": "登录",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/addCardFirst",
            "style": {
                "navigationBarTitleText": "添加银行卡",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/addCardSecond",
            "style": {
                "navigationBarTitleText": "添加银行卡",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/addCardCode",
            "style": {
                "navigationBarTitleText": "银行卡验证码",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/bindCard/bindCard",
            "style": {
                "navigationBarTitleText": "绑定银行卡",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/shuaKa/shuaKa",
            "style": {
                "navigationBarTitleText": "刷卡活动",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,
                "navigationStyle": "custom"
                // #endif
            }

        }, {
            "path": "pages/pay/shuaKa/introduce",
            "style": {
                "navigationBarTitleText": "活动详情",
                "enablePullDownRefresh": false
                // #ifdef H5
                ,

 pages/pay/addCardCode.vue

File was deleted

 pages/pay/addCardFirst.vue

File was deleted

 pages/pay/addCardSecond.vue

File was deleted

 pages/pay/bindCard/bindCard.vue

File was deleted

 pages/pay/scanRes.vue

File was deleted

 pages/pay/scanpay.vue

File was deleted

 pages/pay/shuaKa/introduce.vue

File was deleted

 pages/pay/shuaKa/shuaKa.vue

File was deleted

 pages/pay/wxpay.vue

File was deleted

 pay/discountpay.vue

File was renamed from pages/pay/discountpay.vue
@@ -345,7 +345,7 @@
                        this.youHuiInfo = res.youHuiInfo
                        if (res.isOk == 1) {
                            uni.navigateTo({
                                url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                                url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                                    .stringify(this.youHuiInfo)}`
                            })
                        } else {
@@ -394,7 +394,7 @@
                  // 使用以上方式判断前端返回,微信团队郑重提示：
                  //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
                  uni.navigateTo({
                    url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                    url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                        .stringify(this.youHuiInfo)}`
                  })
                }
@@ -408,7 +408,7 @@
                }, (res) => {
                    if (res.resultCode == 9000) {
                        uni.navigateTo({
                            url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                            url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                                .stringify(this.youHuiInfo)}`
                        })
                        // 支付成功
@@ -432,7 +432,7 @@
                    uni.hideKeyboard()
                    this.codeShow = false
                    uni.navigateTo({
                        url: `/pages/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                        url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                            .stringify(this.youHuiInfo)}`
                    })
                }).catch(() => {

 pay/login.vue

File was renamed from pages/pay/login.vue
@@ -16,17 +16,21 @@
            };
        },
        onLoad(opt) {
      const redirect_uri = encodeURIComponent(`${config.webURL}/pay/scanpay?cid=${opt.cid}`)
      /*if(uni.getStorageSync('UNIONID'+this.platform)){
        window.location.href = redirect_uri
        return
      }*/
            uni.clearStorage()
            const redirect_uri = encodeURIComponent(`${config.webURL}/pages/pay/scanpay?cid=${opt.cid}`)
            if (this.platform == 2) {
                window.location.href =
                    `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${config.wx_appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
                    `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${config.wx_appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`
            } else if (this.platform == 5) {
                window.location.href =
                    `https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=${config.ali_appid}&scope=auth_base&redirect_uri=${redirect_uri}&state=STATE`
            } else {
                uni.reLaunch({
                    url: `/pages/pay/scanpay?cid=${opt.cid}`
                    url: `/pay/scanpay?cid=${opt.cid}`
                })
            }


 pay/paySuccess.vue

File was renamed from pages/pay/paySuccess.vue
@@ -62,20 +62,6 @@
                </view>
            </view>

            <view v-else-if="!join" class="box bg-fff u-m-t-20">
                <navigator class="u-flex" url="/pages/pay/shuaKa/shuaKa">
                    <image class="card-logo" :src="bankCardStyle.logo"></image>
                    <view class="u-flex-1">
                        <view class="u-font-30">领刷{{info.bankCardName}}{{info.totalDiscount/100}}元立减金</view>
                        <view class="u-font-24 color-999">参与刷卡有礼，领更多优惠</view>
                    </view>
                    <view>
                        <u-button type="success" size="mini" text="领取"></u-button>
                    </view>

                </navigator>
            </view>

            <view :url="jumpUrl" class="btn-box">
                <u-button @click="clickDone" text="完成" type="success" plain shape="circle"></u-button>
            </view>
@@ -375,4 +361,4 @@
    .lh-1 {
        line-height: 1;
    }
</style>
</style>

 pay/register.vue

File was renamed from pages/pay/register.vue
@@ -183,7 +183,7 @@
                        uni.hideLoading();
                        uni.setStorageSync('IS_NEW', false)
                        uni.redirectTo({
                            url: '/pages/pay/scanpay?cid=' + this.cid
                            url: '/pay/scanpay?cid=' + this.cid
                        })
                    }).catch(() => {
                        uni.hideLoading();

 pay/scanpay.vue

New file
@@ -0,0 +1,522 @@
<!-- 扫码支付 -->
<template>
  <view class="page">
    <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>
      <image :src="shopInfo.logo_image||'/static/imgs/store-logo.png'" class="avg-img"></image>
    </view>
    <view class="u-p-48 bg-fff u-flex-1 content">
      <view class="u-font-28 color-666">金额</view>
      <view class="u-p-v-20 u-flex u-border-bottom u-relative">
        <view class="money-icon color-333">¥</view>
        <view class="u-flex-1 u-flex u-m-l-10" style="height: 80rpx;">
          <view v-if="money" class="money-num">{{ money }}</view>
          <view :class="['cursor',{'cursor-act':!money&&bordShow}]"></view>
          <view v-if="!money" class="u-font-50 color-999">请输入金额</view>
          <view :class="['cursor',{'cursor-act':money&&bordShow}]"></view>
        </view>
        <view class="mask" @click="showBord"></view>
      </view>
      <image v-if="isNew&&(this.payWay == 2&&!UNIONID)" @click="toRegister" class="reg-btn" src="/static/register-btn.png" mode=""></image>
    </view>
    <button class="pay-it" @click="pay">付款</button>
    <!-- 数字键盘 -->
    <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>
  </view>
</template>

<script>
import {
  config,
  ACCESSTOKEN
} from 'common/config.js';
import {
  queryShop,
  userLogin,
  queryMyUseSweepPayMaxCoupon,
  closeOrder,
  saveOrder,
} from 'common/api/index'

export default {
  data() {
    return {
      UNIONID: null,
      payWay: this.$utils.getPlat(),
      cid: '',
      bordShow: true, // 显示键盘
      shopInfo: {
        shop_name: '',
        scan_flag: '',
        use_score_flag: 0, //商铺是否可用积分 0否 1是
        user_coupon_flag: 0, //商铺是否可用优惠券 0否 1是
        app_pay_use_score_flag: 0, //微信/支付宝是否可用积分 0否 1是
        app_pay_use_coupon_flag: 0, //微信/支付宝是否可用优惠券 0否 1是
        bank_pay_use_score_flag: 0, //银行卡支付是否可用积分 0否 1是
        bank_pay_use_coupon_flag: 0, //银行卡支付是否可用优惠券 0否 1是
      },
      money: '', // 金额
      couponInfo: null, // 优惠券内容
      token: null,
      isNew: false, // 是否新用户，新用户查询不到积分和银行卡
      canReset: false,
      end: 0,
      count: 0,
    };
  },
  onLoad(opt) {
    this.isNew = uni.getStorageSync('IS_NEW')
    // uni.setStorageSync('OPENID' + this.payWay, opt.code)
    uni.showLoading()
    if (opt.cid) {
      this.cid = opt.cid
      uni.setStorageSync('CID', opt.cid)
      this.init()
    }
    if (opt.code || opt.auth_code) {
      let code = opt.code
      if (this.payWay == 5) {
        code = opt.auth_code
      }
      this.end++
      userLogin({
        platform: this.payWay,
        params: {
          code
        }
      }).then(res => {
        this.getToken(res)
      }).catch(() => {
        uni.hideLoading()
      })
    }

  },
  onShow() {
    this.UNIONID = uni.getStorageSync('UNIONID' + this.payWay) || null
    this.token = uni.getStorageSync(ACCESSTOKEN) || null
    if (this.canReset && this.token && !this.isNew) {
      this.end = 0
      this.count = 0
      uni.showLoading()
      this.getUserInfo()
    }
    this.canReset = true
  },
  methods: {
    getToken(res) {
      this.count++
      if (this.count >= this.end) {
        uni.hideLoading()
      }
      this.token = res.token
      if (res.openid) {
        uni.setStorageSync('OPENID' + this.payWay, res.token)
      }
      if (res.unionid) {
        uni.setStorageSync('UNIONID' + this.payWay, res.token)
      }
      uni.setStorageSync(ACCESSTOKEN, res.token)
      uni.setStorageSync('IS_NEW', res.isNew)
      this.isNew = res.isNew
      if (!res.isNew) {
        this.getUserInfo()
      }
    },
    toRegister() {
      if (this.UNIONID) {
        uni.navigateTo({
          url: '/pay/register?cid=' + this.cid
        })
      }
      if (this.payWay == 2) {
        const redirect_uri = encodeURIComponent(`${config.webURL}/pay/scanpay?cid=${opt.query.cid}`)
        window.location.href =
            `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${config.wx_appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
      }

    },
    // 更新金额
    changeMoney(str) {
      this.money = str;
    },
    // 展示键盘
    showBord() {
      this.bordShow = true;
    },
    init() {
      this.end += 1
      //获取商铺信息
      queryShop({
        params: {
          cid: this.cid
        }
      }).then(res => {
        this.count++
        if (this.count >= this.end) {
          uni.hideLoading()
        }
        if (res.logo_image) {
          try {
            let arr = JSON.parse(res.logo_image)
            res.logo_image = config.sftpURL + arr[0].path
          } catch (e) {
            //TODO handle the exception
            res.logo_image = ''
          }
        }
        this.shopInfo = res
      }).catch(() => {
        uni.hideLoading()
      })
    },
    // 获取会员相关信息
    getUserInfo() {
      this.end += 1
      //获取用户优惠券
      queryMyUseSweepPayMaxCoupon({
        params: {
          shopId: this.shopInfo.id
        }
      }).then(res => {

        this.count++
        if (this.count >= this.end) {
          uni.hideLoading()
        }
        this.couponInfo = res
      }).catch(() => {
        this.count++
        if (this.count >= this.end) {
          uni.hideLoading()
        }
      })
    },
    //跳转营销页面
    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: `/pay/discountpay?shopInfo=${shopInfo}&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: `/pay/discountpay?shopInfo=${shopInfo}&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: `/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
            })
            return false
          } else {
            return true
          }
        } else if (this.discount.shopDiscount != 1) {
          uni.navigateTo({
            url: `/pay/discountpay?shopInfo=${shopInfo}&integral=${this.integral}&scoreWorth=${this.scoreWorth}&money=${this.money}&payWay=${this.payWay}&bankCardId=${this.bankCardId}`
          })
          return false
        } else {
          return true
        }
      } else {
        return true
      }
    },
    //确认支付
    pay() {
      if (uni.$u.test.isEmpty(this.money)) {
        uni.$u.toast('请输入金额！')
        return
      }
      this.bordShow = true
      // return this.toDiscount() //判断是否需要跳转营销页面
      if (this.toDiscount()) {
        // 金额 this.money
        uni.showLoading()
        const params = {
          money: parseFloat((this.money * 100).toPrecision(12)),
          shopId: this.shopInfo.id,
          cid: this.cid,
          payWay: this.payWay,
          score: 0,
          couponDetailId: ''
        }
        if (this.payWay == 3) {
          params.bankCardId = this.bankCardId
        }
        //生成订单
        saveOrder(params).then(res => {
          uni.hideLoading()
          try {
            this.orderId = res.orderId
            res.youHuiInfo.shopName = this.shopInfo.shop_name
            this.youHuiInfo = res.youHuiInfo
            if (this.payWay == 2) {
              this.wxPay(res.paymentData)
            }
            if (this.payWay == 5) {
              this.aliPay(res.paymentData)
            }
          } catch (e) {
            //TODO handle the exception
            console.error(e);
          }
        }).catch(() => {
          uni.hideLoading()
        })
      }

    },
    // 微信支付
    wxPay(res) {
      setTimeout(() => {
        WeixinJSBridge.invoke(
            'getBrandWCPayRequest', {
              "appId": res.appId, //公众号ID，由商户传入
              "timeStamp": res.timeStamp, //时间戳，自1970年以来的秒数
              "nonceStr": res.nonceStr, //随机串
              "package": res.package,
              "signType": res.signType, //微信签名方式：
              "paySign": res.paySign //微信签名
            },
            (res) => {
              if (res.err_msg == "get_brand_wcpay_request:ok") {
                // 使用以上方式判断前端返回,微信团队郑重提示：
                //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
                uni.navigateTo({
                  url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                      .stringify(this.youHuiInfo)}`
                })
              } else {
                this.closeOrder()
              }
            });
      }, 200)
    },
    //支付宝支付
    aliPay(res) {
      ap.tradePay({
        tradeNO: res.tradeNO
      }, (res) => {
        if (res.resultCode == 9000) {
          uni.navigateTo({
            url: `/pay/paySuccess?orderId=${this.orderId}&youHuiInfo=${JSON
                .stringify(this.youHuiInfo)}`
          })
          // 支付成功
        } else if (res.resultCode == 8000 || res.resultCode == 6001) {
          // 正在处理中 || 取消
        } else {
          this.closeOrder()
          // 支付失败
        }
      });
    },
    closeOrder() {
      closeOrder({
        id: this.orderId,
      }).then(res => {
      })
    }
  }
};
</script>

<style scoped lang="scss">
.page {
  height: calc(100vh - 0px);
  display: flex;
  flex-direction: column;
}

.shop {
  padding: 50rpx 64rpx;
}

.avg-img {
  width: 94rpx;
  height: 94rpx;
  border-radius: 10rpx;
  background-color: #ffffff;
}

.content {
  border-radius: 40rpx 40rpx 0 0;
}

.money {
  font-size: 40rpx;
  color: #333;
}

.money-icon {
  font-size: 70rpx;
  // font-weight: bold;
  margin-right: 20rpx;
}

.money-num {
  font-size: 96rpx;
  // font-weight: bold;
}

.pay-it {
  position: absolute;
  width: 686rpx;
  height: 98rpx;
  bottom: 0;
  border-radius: 10rpx;
  font-size: 34rpx;
  color: #ffffff;
  background-color: #de2d35;
  margin: 32rpx;
}

.bank-card-ad {
  padding-top: 50rpx;
  background-image: url(~@/static/bank-card-ad1.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
}

.pay-icon {
  align-self: flex-start;
  width: 48rpx;
  height: 48rpx;
  margin-right: 20rpx;
}

.tag {
  background-color: #F35656;
  font-size: 20rpx;
  color: #fff;
  border-radius: 4rpx;
  line-height: 1;
  padding: 4rpx;
}

.tag-pain {
  border: 1px solid #D31F28;
  font-size: 22rpx;
  color: #D31F28;
  border-radius: 4rpx;
  line-height: 1;
  padding: 8rpx 4rpx;
}

.mask {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
  z-index: 101;
  background-color: rgba(0, 0, 0, 0);
}

@keyframes cursor-blinks {
  0% {
    opacity: 1;
    display: block;
  }

  50% {
    opacity: 0;
    display: none;
  }

  100% {
    opacity: 1;
    display: block;
  }
}

.cursor {
  border-left: 1px solid transparent;
  height: 80rpx;
}

.cursor-act {
  border-left: 1px solid #333;
  animation: cursor-blinks 1s infinite steps(1, start);
}

.reg-btn {
  display: block;
  margin-top: 30rpx;
  width: 654rpx;
  height: 198rpx;

  image {
    width: 100%;
    height: 100%;
  }
}

.u-font-money {
  font-size: 60rpx;
}

.bankCard-list {
  height: 50vh;
  width: 750rpx;
  box-sizing: border-box;

  .pay-icon {
    align-self: center;
  }
}

.add-icon {
  width: 50rpx;
  height: 50rpx;
  border-radius: 25rpx;
  background: #ffc0c38f;
  display: flex;
  align-items: center;
  justify-content: center;
}

.shuka {
  width: 678rpx;
  height: 45rpx;
  position: relative;
  left: -10rpx;

  image {
    width: 100%;
    height: 100%;
  }
}

.btn {
  /* position: fixed;
bottom: 100rpx; */
  margin: 0 auto;
  margin-top: 120rpx;
  position: relative;
  width: 680rpx;
  height: 100rpx;
}

.wx-app {
  position: absolute;
  width: 680rpx;
  height: 100rpx;
}
</style>