zhibo/pages_user/user/pay.vue

<template>
	<view class="content">
		<view class="top">
			<view class="inner">
				<view class="pay">
					<view class="title">
						<text class="name">付款给 芳华佳选</text>
						<text class="desc">微信收款</text>
					</view>
					<view class="pay-money">
					 	<view class="pay-money-title">支付金额</view>
					 	<view class="money">
					 		<text class="fh">¥</text>
					 		<input v-model="money"  class="uni-input"  @input="testMoney" type="digit" focus   />
					 	</view>
						<textarea class="desc" placeholder="请填写备注说明" maxlength="20" v-model="desc" />
					</view>
				</view>
			</view>
			<view class="btn-box">
				<view class="btn" @click="pay()">确认支付</view>
			</view>
		</view>
		<view class="ad">
			<ad unit-id="adunit-a018415a6deb69e8"></ad>
		</view>

	</view>
</template>

<script>
	import {payment,checkpayment} from '@/api/payment'
	export default {
		data() {
			return {
				companyUserId:null,
				companyId:null,
				desc:"",
				money:null,
				wxPay: true,
				checkTimer: null, // 轮询定时器 ID
				maxRetryCount: 10, // 最大轮询次数（可选）
				retryCount: 0      // 当前轮询次数（可选）
			}
		},
		onLoad: function(options) {
		 //   if (options.hasOwnProperty('q') && options.q) {
		 //   	// 通过下面这步解码，可以拿到url的值
		 //   	const url = decodeURIComponent(options.q)
		 //   	this.url=url;
		 //   	// // 对url中携带的参数提取处理
		 //   	const obj = this.utils.urlToObj(url)
			// console.log(obj)
		 //   	this.companyId=obj.companyId;
			// this.companyUserId=obj.companyUserId;
		 //   }
			this.companyId=options.companyId;
		 	this.companyUserId=options.companyUserId;
			if (this.checkTimer) {
			    clearInterval(this.checkTimer);
			    this.checkTimer = null;
			  }
		},
		onShareAppMessage(res) {
			return {
				title: '芳华佳选-收款',
				path: `/pages_user/user/pay?companyId=`+this.companyId+"&companyUserId="+this.companyUserId
			}
		},
		methods: {
			testMoney(e){
				let that = this;
				let price = e.detail.value
				if (price.indexOf(".") == 0) {
					//'首位小数点情况'
					price = price.replace(/[^$#$]/g, "0.");
					price = price.replace(/\.{2,}/g, ".");
				}
				price = price.match(/^\d*(\.?\d{0,2})/g)[0] || null;
				  //重新赋值给input
				this.$nextTick(() => {
					this.money = price;
				});

			},
			pay(){
				if(this.money==null){
					uni.showToast({
						icon:'none',
						title: "请输入支付金额"
					});
					return;
				}
				uni.login({
					success: res => {
						console.log(res)
						this.payment(res.code);
					}
				});
			},
			payment(code){
				var data = {payMoney:this.money,remark:this.desc,code:code,companyId:this.companyId,companyUserId:this.companyUserId};
				var that=this;
				uni.showLoading();
				payment(data).then(
					res => {
						if(res.code==200){
							 console.log(1111,res);
							 var result=res.result;
              wx.navigateToMiniProgram({
                appId: 'wx1b63de1096c46cde', // 收银台小程序 AppId 固定值
                path: '/pages/pay/pay', // 收银台小程序 固定路径
                extraData: {
                  orderNo: result.orderNo,
                  orderAmt: result.orderAmt,
                  platMerCstNo: result.platMerCstNo,
                  platMerCstName: result.platMerCstName,
                  businessCstNo: result.businessCstNo,
                  licenseCode: result.licenseCode,
                },
                envVersion: 'release', // 开发版 develop，体验版 trial,正式环境传 release
                success(res) {
                  uni.showLoading({
                    title:"查询支付结果中..."
                  })
				 // 启动定时器并保存 ID
				   that.checkTimer = setInterval(() => {
							 const data = { payCode: result.payCode };
							 checkpayment(data).then(res => {
							   if (res.code == 200) {
								   console.log(res)
								   // uni.showLoading({
								   //   title:"查询支付结果中..."
								   // })
								 if (res.status == 1) {
								   // 跳转前清除定时器
								   
								   clearInterval(that.checkTimer);
								   uni.redirectTo({
									  url: './success'
								   });
								 }
								 // else{
									//  setTimeout(()=>{
									// 	 clearInterval(that.checkTimer);
									// 	 	uni.showToast({
									// 	 		icon:'none',
									// 	 		title: "用户未支付",
									// 	 	});
									//  },10000)
								 // }
							   }
							 });
				   }, 4000);
                  console.log(res)
// 接口调用成功的回调函数
                },
                fail(res) {
					if (that.checkTimer) clearInterval(that.checkTimer);
// 接口调用失败的回调函数
                }
              })
							 // uni.requestPayment({
							 // 	provider: 'wxpay',
							 // 	timeStamp: res.result.timeStamp,
							 // 	nonceStr: res.result.nonceStr,
							 // 	package: res.result.packageValue,
							 // 	signType: res.result.signType,
							 // 	paySign: res.result.paySign,
							 // 	success: function(res) {
							 // 		uni.hideLoading();
								// 	uni.showToast({
								// 		icon:'success',
								// 		title: "支付成功",
								// 	});
								// 	uni.navigateTo({
								// 		url:'./success'
								// 	})
							 // 	},
							 // 	fail: function(err) {
							 // 		console.log('fail:' + JSON.stringify(err));
							 // 		uni.hideLoading();
							 // 	}
							 // });
						}else{
							uni.showToast({
								icon:'none',
								title: res.msg,
							});
						}
					},
					rej => {}
				);

			}
		}
	}
</script>

<style lang="scss">
	page{
		height: 100%;
		background-color: #f0eff4;
	}
	.content{
		height: 100%;
		display: flex;
		flex-direction: column;
		.top{
			flex:1;
			padding: 20rpx;
			.inner{
				width: 100%;
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				justify-content: center;
				.pay{
					width: 100%;
					box-shadow: 1px 1px 5px #e6e6e6;
					background: #FFFFFF;
					border-radius: 5upx;
					display: flex;
					flex-direction: column;
					align-items: flex-start;
					.title{
						display: flex;
						flex-direction: column;
						align-items: flex-start;
						width: 100%;
						background-color: #f7f7f7;
						padding: 30rpx 0rpx;
						.name{
							padding: 15rpx 30rpx;
							font-size: 32rpx;
						}
						.desc{
							color: #989898;
							padding: 15rpx 30rpx;
							font-size: 25rpx;
						}
					}
					.pay-money
					{
						padding: 30rpx 0rpx;
						 width: 100%;
						 background: #FFFFFF;
						 border-radius: 5upx;
						 display: flex;
						 flex-direction: column;
						 align-items: flex-start;
						 .pay-money-title{
						 	padding: 15rpx 30rpx;
						 	font-size: 32rpx;
						 }
						 .money{
							 font-size: 42rpx;
							 padding: 15rpx 30rpx;
							 display: flex;
							 flex-direction: row;
							 align-items: flex-start;
							 input{
								 margin-left: 15rpx;
							 }
						 }
						 .desc{
							 width: 100%;
							 padding: 30rpx 30rpx;
							 border-top: 1rpx solid #e6e6e6;
						 }
						 textarea {
							 height:50rpx;
							 line-height: 50rpx;
						 }
					}
				}


			}
			.btn-box{
				padding: 30rpx 0rpx;
				height: 121upx;
				display: flex;
				align-items: center;
				justify-content: center;
				.btn{
					width: 91.73%;
					height: 88upx;
					line-height: 88upx;
					font-size: 30upx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #FFFFFF;
					text-align: center;
					background: #2BC7B9;
					border-radius: 44upx;
				}
			}
		}
		.ad{
			margin: 0rpx 0rpx 60rpx;
		}
	}

</style>