hire-wx-houxuanren/pagesD/pay.vue

<template>
	<view class="page">
		<view class="top .u-flex-col u-col-center" style="justify-content: center;">
			<view class="font">
				实际金额
			</view>
			<view class="money">
				<text>￥</text>
				<text style="font-size: 76rpx;">{{money}}</text>
			</view>
		</view>
		<view class="">

			<view class="pay1">请选择支付方式</view>
			<view class="u-flex u-row-between" style="margin-top: 64rpx;">
				<view class="u-flex">
					<image style="width: 40rpx;height: 40rpx;" src="/pagesD/static/images/wxpay.png" mode=""></image>
					<view class="" style="margin-left: 20rpx;">微信支付</view>
				</view>
				<view class="">
					<u-radio-group v-model="radiovalue1">
						<u-radio name="1">
						</u-radio>
					</u-radio-group>
				</view>
			</view>

		</view>
		<view class=""
			style="position: fixed;left: 0;bottom: 0;padding: 16rpx 32rpx;width: 750rpx;box-sizing: border-box;">
			<view class="pay" style="" @click="tobuy">
				立即支付
			</view>
			<view class="safe-area-inset-bottom"></view>
		</view>
	</view>
</template>

<script>
	import {
		pay
	} from "@/units/inquire.js"
	export default {
		data() {
			return {
				money: 0,
				id: '',
				radiovalue1: '1'
			};
		},
		onLoad(options) {
			this.money = options.money
			this.id = options.id
		},
		methods: {
			tobuy() {
				uni.showLoading({
					mask: true,
					title: "请稍后"
				})
				pay({
					id: this.id,
					paytype: 'wechat',
					apptype: 'miniapp'
				}).then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						var that = this
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: res.data.data.response.timeStamp,
							nonceStr: res.data.data.response.nonceStr,
							package: res.data.data.response.package,
							signType: res.data.data.response.signType,
							paySign: res.data.data.response.paySign,
							success: function(res) {
								console.log('success:' + JSON.stringify(res));
								that.$u.toast('支付成功')
								setTimeout(() => {
									uni.redirectTo({
										url: "/pagesD/order-info?id=" + that.id
									})
									// uni.navigateBack()
								})
								// this.getdata()
							},
							fail: function(err) {
								console.log('fail:' + JSON.stringify(err));
								// setTimeout(() => {
								// 	// uni.navigateTo({
								// 	// 	url: "/pagesD/order-info?id=" + this.id
								// 	// })
								// 	uni.navigateBack()
								// })
							}
						});
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.pay {
		height: 88rpx;
		background: #0C66C2;
		border-radius: 12rpx;
		line-height: 88rpx;
		text-align: center;
		// padding: 22rpx 0;
		box-sizing: border-box;
		font-size: 32rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}

	.page {
		padding: 0 52rpx;
	}

	.top {
		height: 350rpx;
	}

	.font {
		font-size: 32rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #222222;
	}

	.money {
		font-size: 44rpx;
		font-family: JDZhengHT, JDZhengHT;
		font-weight: 400;
		color: #222222;
	}

	.pay1 {
		font-size: 32rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #222222;
	}
</style>