添加扫码成功操作页，修改主页面样式，更换主页图标

Liuyi

2024-10-16 7cbda90b02e31447122f1d22c9797b423d7bd9fc

 pages/recharge/index.vue

@@ -1,7 +1,8 @@
<script setup>
   import{ ref ,onMounted} from 'vue'
   import { wxPayApi } from '../../api/index.js'
   
   const choosedMoney = ref()
   const choosedMoney = ref(50)
   const disabled = ref(true)
   //选择金额
   const moneyList = ref([
@@ -38,26 +39,63 @@
   const payMethod = ref()
   const payList = ref([
      // {text:"支付宝支付",value:1,checked:true,img:'../../static/images/recharge/pay.png'},
      {text:"微信支付",value:2,checked:false,img:'../../static/images/recharge/wx.png'},
      {text:"余额",value:3,checked:false,img:'../../static/images/recharge/balance.png'},
      {text:"微信支付",value:2,checked:true,img:'../../static/images/recharge/wx.png'},
      // {text:"余额",value:3,checked:false,img:'../../static/images/recharge/balance.png'},
   ])
   function choosePay(index1){
      payList.value.forEach((item,index) =>{
         if(item.checked == true){
            item.checked = false
         }
      })
      payList.value[index1].checked = true
      payMethod.value = payList.value[index1].value
   }
   function submit(){
   // function choosePay(index1){
   //    payList.value.forEach((item,index) =>{
   //       if(item.checked == true){
   //          item.checked = false
   //       }
   //    })
   //    payList.value[index1].checked = true
   //    payMethod.value = payList.value[index1].value
   // }
   async function submit(){
      let money = ''
      if(disabled.value){
         money = choosedMoney.value
      }else{
         money = otherMoney.value
         money = Number(otherMoney.value)
      }
      console.log('money',money)
      await wxPayApi({businessType:1,tradeAmount:money}).then((res) =>{
         if(res.code == 200){
            //调用微信官方支付接口弹出付款界面,输入密码扣款
            wx.requestPayment({
              //预支付订单信息
              // appId: res.data.appId,
              timeStamp: res.data.timeStamp,     //时间戳 
              nonceStr: res.data.nonceStr,      //随机串     
              package: res.data.package,      //prepay_id
              signType: res.data.signType,      //签名算法MD5		
              paySign: res.data.paySign ,//微信签名 
             success (res) {
               if (res.errMsg == "requestPayment:ok"){
                 console.log('支付成功', res)
                 uni.showToast({
                  title: '支付成功',
                  duration: 2000,
                 });
                 uni.navigateBack()
               }else{
                 uni.showToast({
                  title: '支付失败',
                  duration: 2000,
                  icon:'none'
                 });
               }
				   
             },
             fail (res) { 
               uni.showToast({
                  title: '微信支付失败',
                  duration: 2000,
                  icon:'none'
               });
             }
            })
         }
      })
   }
</script>
<template>
@@ -86,10 +124,10 @@
               </view>
            </view>
            <view class="pay-methods">
               <view class="money-title">
               <!-- <view class="money-title">
                  <view class="title-icon"></view>
                  <view class="title-text">请选择支付方式</view>
               </view>
               </view> -->
               <view class="methods-list">
                  <block v-for="(item,index) in payList">
                     <view class="pay-item">
@@ -97,7 +135,7 @@
                           <image :src="item.img" alt=""></image>
                           <view>{{item.text}}</view>
                        </view>
                        <radio :value="item.value" :checked="item.checked" @click="choosePay(index)"/>
                        <radio :value="item.value" :checked="item.checked"/>
                     </view>
                  </block>
               </view>