150 lines
3.7 KiB
Vue

<template>
<view class="box" :style="{paddingTop: top + 'px'}">
<u-navbar
title="充值缴费"
bgColor="transparent"
leftIconSize="20px"
:autoBack="true"
/>
<view class="msg">
账户余额()
<view>{{money}}</view>
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/recharge_img.png" mode="widthFix" />
</view>
<view class="recharge">
<view class="rechargeTit">充值金额</view>
<view class="iptbox">
<view></view>
<input type="number" :value="amount" @input="headerAmountClick" placeholder="请输入充值金额" placeholder-style="color: #999999;font-size: 24rpx;" />
</view>
<view class="btn" @click="headerSubmitClick">
确认充值
</view>
</view>
</view>
</template>
<script>
import { menuButtonInfo, request, getProviderPromise } from '../../utils/index';
import { apiArr } from '../../api/kitchen';
import { apiPay } from '../../api/pay';
export default {
data() {
return {
top: 0,
money: 0, // 账户余额
amount: '',
goodsMsg: {},
};
},
onLoad() {
console.log('页面战', getCurrentPages());
const meun = menuButtonInfo();
this.top = meun.height + meun.top;
this.init();
},
methods: {
async init(){
const res = await request(apiArr.balance, 'POST',{});
this.money = res?.money || 0
},
headerAmountClick(e) {
this.amount = e.detail.value
},
async headerSubmitClick() {
uni.showLoading({
title: '充值中...',
mask: true
});
const res = await request(apiArr.recharge, 'POST', {money: Number(this.amount)}, {silent: false});
console.log('apiArr.recharge res', res);
this.goodsMsg = res;
this.pay(res);
},
async pay(res) {
const _this = this;
const res1 = await request(apiPay.pay, 'POST', {
address: '',
goods_id: String(res.id),
merchant_no: res.merchant_no,
out_trade_no: res.order_no,
quantity: 1,
remark: '',
subject: '用户充值',
term_no: res.term_no,
total_amount: String(res.money * 100),
// total_amount:String(1),
user: String(uni.getStorageSync('userId')),
user_id: uni.getStorageSync('openId')
}, { silent: false });
console.log('拉卡拉预下单接口调用成功', res1);
const {resp_data,msg} = res1;
uni.hideLoading()
if(msg == '成功'){
const provider = await getProviderPromise('payment');
console.log('获取当前支付渠道', provider);
uni.requestPayment({
provider: provider[0],
timeStamp: String(resp_data.acc_resp_fields.time_stamp),
nonceStr:String(resp_data.acc_resp_fields.nonce_str),
package:String(resp_data.acc_resp_fields.package),
signType:String(resp_data.acc_resp_fields.sign_type),
paySign:String(resp_data.acc_resp_fields.pay_sign),
success(res){
console.log('1111', res);
_this.amount = '';
_this.queryPay()
},
fail(fal){
console.log('支付异常', fal);
}
})
}
},
async queryPay(){
let that = this
const { goodsMsg } = that;
console.log('queryPayqueryPayqueryPayqueryPayqueryPay', goodsMsg);
const res = await request(apiPay.queryPay, 'POST', {
merchant_no: goodsMsg.merchant_no,
term_no: goodsMsg.term_no,
out_trade_no: goodsMsg.order_no
}, { silent: false })
uni.hideLoading();
if(res.statusCode == '200'){
uni.showToast({
title: '支付成功!',
success() {
// setTimeout(() => {
// that.getBanlance()
// }, 1500)
}
})
}else{
uni.showToast({
title: res.msg,
})
}
},
},
}
</script>
<style>
@import url("./index.css");
</style>