mnsx/user/page/pay.vue

<template>
	<view class="content">
		<view class="store-info flex">
			<image :src="store_logo" mode="" class="store-logo"></image>
			<view class="store-name">
				{{store_name}}
			</view>
		</view>
		<view class="money-box">
			￥
			<input type="text" value="" v-model="money" placeholder="请输入充值金额" placeholder-class="place"/>
		</view>
		<view class="sub" @click="!payLoding ? confirm() : ''" :class="{'disable': payLoding}">
			确认付款
		</view>
	</view>
</template>

<script>
	// #ifdef H5
	import { rechargeWechat ,userBalance} from '@/api/wallet.js';
	// #endif
	// #ifdef MP
	import { rechargeRoutine ,userBalance} from '@/api/wallet.js';
	// #endif
	export default {
		data() {
			return {
				type: 'weixin',
				money: '',
				store_name: '',
				store_logo: '',
				store_id: '',
				payLoding: false
			}
		},
		onLoad(opt) {
			console.log(opt.store_name)
			this.store_name = opt.store_name
			this.store_logo = opt.store_logo
			this.store_id = opt.store_id
			
		},
		methods: {
			// 提交
			confirm() {
				let obj = this;
				if(obj.money == 0){
					return this.$api.msg('请输入充值金额');
				}
				console.log(obj.money,'ddddddddddddddddddddddddddddddddddddddddddd')
				// if(!this.isSect) {
				// 	return this.$api.msg('请选择支付方式');
				// }
				if (wx.requestSubscribeMessage) {
				    wx.requestSubscribeMessage({
				    	tmplIds: ['HgPU5FHUTwqGNSkJ7IsAP0XkJZV3UUf9fjUWUD3ebZY'],
				    	success(res) {
				    		console.log(res,'订阅消息')
				    	},
				    	fail(err) {
				    		console.log(err)
				    	},
				    	complete() {
				    		obj.payLoding = true;
				    		// #ifdef H5
				    		console.log('H5++++++++++++++++')
				    		rechargeWechat({
				    			price: obj.money,
				    			from: obj.type,
				    			store_id: obj.store_id
				    		})
				    			.then(e => {
				    				let da = e.data.data;
				    				obj.weichatObj.chooseWXPay({
				    					timestamp: da.timestamp,
				    					nonceStr: da.nonceStr,
				    					package: da.package,
				    					signType: da.signType,
				    					paySign: da.paySign,
				    					success: function(res) {
				    						uni.showToast({
				    							title: '充值成功',
				    							duration: 2000,
				    							position: 'top'
				    						});
				    					}
				    				});
				    				obj.payLoding = false;
				    			})
				    			.catch(e => {
				    				obj.payLoding = false;
				    				console.log(e);
				    			});
				    		// #endif
				    		// #ifdef MP
				    		console.log('MP++++++++++++++++')
				    		rechargeRoutine({
				    			price: obj.money,
				    			store_id: obj.store_id
				    		})
				    			.then(e => {
				    				let da = e.data;
				    				wx.requestPayment({
				    					timeStamp: da.timestamp,
				    					nonceStr: da.nonceStr,
				    					package: da.package,
				    					signType: da.signType,
				    					paySign: da.paySign,
				    					success: function(res) {
				    						uni.redirectTo({
				    							url: '/pages/money/paySuccess?isshow=false'
				    						});
				    					}
				    				});
				    					
				    				obj.payLoding = false;
				    			})
				    			.catch(e => {
				    				obj.payLoding = false;
				    				console.log(e);
				    			});
				    		// #endif
				    	}
				    })
				} else {
				    obj.payLoding = true;
				    // #ifdef H5
				    console.log('H5++++++++++++++++')
				    rechargeWechat({
				    	price: obj.money,
				    	from: obj.type,
				    	store_id: obj.store_id
				    })
				    	.then(e => {
				    		let da = e.data.data;
				    		obj.weichatObj.chooseWXPay({
				    			timestamp: da.timestamp,
				    			nonceStr: da.nonceStr,
				    			package: da.package,
				    			signType: da.signType,
				    			paySign: da.paySign,
				    			success: function(res) {
				    				uni.showToast({
				    					title: '充值成功',
				    					duration: 2000,
				    					position: 'top'
				    				});
				    			}
				    		});
				    		obj.payLoding = false;
				    	})
				    	.catch(e => {
				    		obj.payLoding = false;
				    		console.log(e);
				    	});
				    // #endif
				    // #ifdef MP
				    console.log('MP++++++++++++++++')
				    rechargeRoutine({
				    	price: obj.money,
				    	store_id: obj.store_id
				    })
				    	.then(e => {
				    		let da = e.data;
				    		wx.requestPayment({
				    			timeStamp: da.timestamp,
				    			nonceStr: da.nonceStr,
				    			package: da.package,
				    			signType: da.signType,
				    			paySign: da.paySign,
				    			success: function(res) {
				    				uni.redirectTo({
				    					url: '/pages/money/paySuccess?isshow=false'
				    				});
				    			}
				    		});
				    			
				    		obj.payLoding = false;
				    	})
				    	.catch(e => {
				    		obj.payLoding = false;
				    		console.log(e);
				    	});
				    // #endif
				}
				
			},
		}
		
		
	}
</script>

<style lang="scss" scoped>
	.store-info {
		padding: 46rpx 30rpx;
		justify-content: flex-start;
		align-items: center;
		.store-logo {
			width: 82rpx;
			height: 82rpx;
			border-radius: 50%;
			background: #eee;
			border-radius: 5px;
			margin-right: 17rpx;
		}
		.store-name {
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #000000;
		}
	}
	.money-box {
		font-size: 60rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #000000;
		padding: 30rpx 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		input {
			flex-grow: 1;
			padding-left: 20rpx;
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #000000;
			// display: inline-block;
		}
	}
	.sub {
		margin:138rpx auto 0;
		width: 685rpx;
		line-height: 93rpx;
		background: #901B21;
		border-radius: 5px;
		text-align: center;
		
		font-size: 36rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
	.disable {
		background-color: #999;
	}
	.place {
		font-size: 24rpx;
	}
</style>