150 lines
3.8 KiB
Vue
150 lines
3.8 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')) || 67, //TODO: 临时写死
|
|
user_id: uni.getStorageSync('openId') || 'oWc1867ogXgDGzKgykd-JS3GUOkE' //TODO: 临时写死
|
|
}, { 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> |