<template>
	<view :class="[AppTheme]" class="app">
		<view class="price-box">
			<text>支付金额</text>
			<text class="price">{{ payprice }}</text>
		</view>
		<view class="pay-type-list">
			<view class="type-item b-b" @click="changePayType(1)">
				<text class="icon yticon icon-weixinzhifu"></text>
				<view class="con">
					<text class="tit">微信支付</text>
					<text>推荐使用微信支付</text>
				</view>
				<label class="radio">
					<radio value="" :color="primary" :checked="payType == 1" />
				</label>
			</view>
			<view class="type-item" @click="changePayType(2)">
				<text class="icon yticon icon-erjiye-yucunkuan"></text>
				<view class="con">
					<text class="tit">余额支付</text>
					<text>可用余额 ¥{{ money }}</text>
				</view>
				<label class="radio">
					<radio value="" :color="primary" :checked="payType == 2" />
				</label>
			</view>
		</view>
		<text class="mix-btn bg-linear-gradient" @click="confirm">确认支付</text>
		<u-keyboard ref="uKeyboard" mode="number" random="true" autoChange="true" :show="show" @change="onChange"
			@backspace="onBackspace" :tooltip="false">
			<view>
				<view class="u-text-center u-padding-20 money">
					<text style="color: red;">{{ payprice }}</text>
					<text style="color: red;" class="u-font-20 u-padding-left-10">元</text>
					<view class="u-padding-10 close" data-flag="false" @tap="showPop(false)">
						<u-icon name="close" color="#333333" size="28"></u-icon>
					</view>
				</view>
				<view class="u-flex u-row-center">
					<u-code-input dot="true" :borderColor="primary" v-model="password"></u-code-input>
				</view>
			</view>
		</u-keyboard>
	</view>
</template>
<script>
	import wallApi from '@/api/wall/index.js';
	import cart from '@/api/cart/index.js';
	import api from '@/api/mall/index.js';
	import adoptApi from '@/api/home/index.js';
	import mineapi from '@/api/mine/index.js';
	export default {
		data() {
			return {
				primary:this.$theme.primary,
				settingFile: getApp().globalData.siteinfo,
				payType: 1,
				money: '',
				show: false,
				password: '',
				payprice: '',
				paypricetext: '',
				params: {
					systype: '',
				},
				params2: {
					// 支付方式
					paytype: 1, //为1是微信支付 2是支付宝支付
					rid: '',
					systype: '', //h5 或 app
					money: 1,
					type_pay: 0
				}
			};
		},
		computed: {},
		onLoad(options) {
			let params = JSON.parse(options.params);
			this.params = params
			this.params['systype'] = ''
			console.log(this.params);
			this.payprice = params.totalprice;
			this.params2.money = this.payprice
			this.paypricetext = this.totalprice + '元';
			this.payType = params.type_pay;
			wallApi.income({}).then(res => {
				if (res.status == 200) {
					this.money = res.data.money; //余额
				}
			});
		},

		methods: {
			// #ifdef H5
			wxPay(paydata) {
				WeixinJSBridge.invoke(
					'getBrandWCPayRequest', {
						'appId': paydata.appId, //公众号id名称，由商户传入
						'timeStamp': paydata.timeStamp, //时间戳     
						'nonceStr': paydata.nonceStr, //随机串     
						'package': paydata.package,
						'signType': paydata.signType, //微信签名方式：     
						'paySign': paydata.paySign //微信签名 
					},
					function(res) {
						if (res.err_msg === 'get_brand_wcpay_request:ok') {
							uni.showToast({
								title: '购买会员成功',
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 1000)
						} else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
							uni.showToast({
								icon: 'none',
								title: '已取消支付'
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: '支付失败'
							})
						}
					})
			},
			// #endif
			//选择支付方式
			changePayType(type) {
				this.payType = type;
				console.log(this.params);
				console.log(this.payType);
			},
			//确认支付
			confirm() {






				//判断后台是否开启实名认证，如果有则跳转去实名认证完毕后，否则跳转去设置支付密码
				api.getrecation().then(res => {
					
					if (res.data === 1) {
						//已开启实名认证,进行验证
						mineapi.vipIndex().then(res => {
							if (res.data.data.is_auth === 0) {
								//未认证，跳转认证页面
								uni.showToast({
									title: '未认证请先认证'
								});
								setTimeout(() => {
									uni.redirectTo({
										url: '/pagesD/pages/set/renzheng/renzheng'
									});
								}, 1000);
							} else if (res.data.data.is_auth === 1) {
								//审核中，显示一下
								uni.showToast({
									title: '资料正在审核中...'
								});
							} else if (res.data.data.is_auth === 2) {
								//审核通过，正常功能
								//开启支付键盘
								if (this.payType == 2) {
									this.show = true;
									this.password = '';
								} else {
									// #ifdef APP-PLUS
									console.log('进来了');
									if (this.payType == 1) {
										let orderInfo = JSON.stringify(this.params)
										this.params.systype = 'app'
										let payplatform = ''
										if (this.payType === 1 || this.payType === 2) {

											//paytype为1使用微信支付，为2使用支付宝支付
											// payplatform = this.params.paytype === 1 ? 'wxpay' : 'alipay'
											// this.params.paytype = 'wxpay'
											console.log(this.params);
											api.wxpayfooice(this.params).then(res => {
												
												if (res ==
													'此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。'
												) {
													uni.showToast({
														title: res,
														icon: 'error'
													}) //商户关闭提示
												}
												// this.params.paytype = 1
												
												if (res.status == 200) {
													uni.requestPayment({
														provider: payplatform,
														orderInfo: res.data,
														//微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
														success: function(res) {
															
															uni.showToast({
																title: '购买会员成功',
																icon: 'none'
															})
															setTimeout(() => {
																uni.navigateBack({
																	delta: 1
																})
															}, 1000)
														},
														fail: function(err) {
															console.log(err);
															uni.showToast({
																title: err
																	.errMsg,
																icon: 'none'
															})
														}
													})
												} else {
													// uni.showToast({
													// 	title: res.msg,
													// 	icon: 'none'
													// })
												}
											})
										} else {
											// paytype为3,使用余额支付
											// this.balancepayment(this.params)
											console.log('错误');
										}
									}

									// #endif
									// #ifdef H5
									// H5支付
									this.params.systype = 'h5'
									if (this.payType === 1) {
										//paytype为1使用微信支付
										console.log(this.params);
										api.wxpayfooice(this.params).then(res => {
											if (res ==
												'此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。'
											) {
												console.log('进来了');
												uni.showToast({
													title: res,
													icon: 'none'
												})
											}
											console.log(111);
											this.params.paytype = 1
											if (res.status == 200) {
												this.wxPay(res.data)
											} else {
												// uni.showToast({
												// 	icon: 'none',
												// 	title: res.msg
												// })
											}
										})
									}
									// #endif
									// #ifdef MP-WEIXIN
									this.goumai(this.payType);
									// #endif
								}
							} else {
								//审核驳回，重新提交认证
								uni.showToast({
									title: '认证审核驳回'
								});
								setTimeout(() => {
									uni.redirectTo({
										url: '/pages/index/index'
									});
								}, 1000);
							}
						});
					} else {
						//开启支付键盘
						if (this.payType == 2) {
							this.show = true;
							this.password = '';
						} else {
							// #ifdef APP-PLUS
							console.log('进来了');
							if (this.payType == 1) {
								let orderInfo = JSON.stringify(this.params)
								this.params.systype = 'app'
								let payplatform = ''
								if (this.payType === 1 || this.payType === 2) {

									//paytype为1使用微信支付，为2使用支付宝支付
									// payplatform = this.params.paytype === 1 ? 'wxpay' : 'alipay'
									// this.params.paytype = 'wxpay'
									console.log(this.params);
									api.wxpayfooice(this.params).then(res => {
										if (res ==
											'此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。') {
											console.log('进来了');
											uni.showToast({
												title: res,
												icon: 'none'
											})
										}
										// this.params.paytype = 1
										
										if (res.status == 200) {
											uni.requestPayment({
												provider: payplatform,
												orderInfo: res.data,
												//微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
												success: function(res) {
													
													uni.showToast({
														title: '购买会员成功',
														icon: 'none'
													})
													setTimeout(() => {
														uni.navigateBack({
															delta: 1
														})
													}, 1000)
												},
												fail: function(err) {
													console.log(err);
													uni.showToast({
														title: err.errMsg,
														icon: 'none'
													})
												}
											})
										} else {
											// uni.showToast({
											// 	title: res.msg,
											// 	icon: 'none'
											// })
										}
									})
								} else {
									// paytype为3,使用余额支付
									// this.balancepayment(this.params)
									console.log('错误');
								}
							}

							// #endif
							// #ifdef H5
							// H5支付
							this.params.systype = 'h5'
							if (this.payType === 1) {
								//paytype为1使用微信支付
								console.log(this.params);
								api.wxpayfooice(this.params).then(res => {
									
									if (res == '此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。') {
										console.log('进来了');
										uni.showToast({
											title: res,
											icon: 'none'
										})
									}
									this.params.paytype = 1
									if (res.status == 200) {
										this.wxPay(res.data)
									} else {
										// uni.showToast({
										// 	icon: 'none',
										// 	title: res.msg
										// })
									}
								})
							}
							// #endif
							// #ifdef MP-WEIXIN
							this.goumai(this.payType);
							// #endif
						}
					}
				});

			},
			onChange(val) {
				if (this.password.length < 6) {
					this.password += val;
				}
				if (this.password.length >= 6) {
					this.pay();
				}
			},
			onBackspace(e) {
				if (this.password.length > 0) {
					this.password = this.password.substring(0, this.password.length - 1);
				}
			},
			//支付键盘验证
			pay() {
				let that = this;
				uni.showLoading({
					title: '支付中'
				});
				cart.checkPayPassword({
					password: this.password
				}).then(res => {
					uni.hideLoading();
					if (res.status === 200) {
						this.goumai(this.payType);
					} else {
						uni.showToast({
							title: res.msg
						});
						if (res.msg === '未设置支付密码，现在进行设置!') {
							setTimeout(() => {
								this.$u.route('pages/set/changemima/changemima');
							}, 1000);
						}
					}
				});
			},
			goumai(pay, password) {
				let that = this;
				that.params.type_pay = pay;
				if (pay === 1) {
					wxpay(that.params);
				} else {
					money(that.params);
				}

				function wxpay(parms) {
					api.wxpayfooice(parms).then(res => {
						if (res == '此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。') {
							console.log('进来了');
							uni.showToast({
								title: res,
								icon: 'none'
							})
						}
						if (res.appId !== null || res.appId !== undefined) {
							/* 微信支付 */
							uni.requestPayment({
								provider: 'wxpay',
								timeStamp: res.timeStamp,
								nonceStr: res.nonceStr,
								package: res.package,
								signType: res.signType,
								paySign: res.paySign,
								success: function(res) {
									uni.showToast({
										title: '微信支付成功',
										icon: 'success',
										duration: 1000
									});
									uni.redirectTo({
										url: '/pagesB/pages/creatorder/landpaysuccess/landpaysuccess'
									});
								},
								fail: function(err) {
									uni.showToast({
										title: '支付失败',
										icon: 'error'
									});
									setTimeout(function() {
										uni.redirectTo({
											url: '/pagesB/pages/myland/myland'
										});
									}, 1000);
								}
							});
						} else {
							// uni.showToast({
							// 	title: res.msg,
							// 	icon: 'error'
							// });
						}
					});
				}

				function money(parms) {
					let that = this;
					api.wxpayfooice(parms).then(res => {
						if (res == '此商家的收款功能已被限制，暂无法支付。商家可以登录微信商户平台/微信支付商家助手小程序查看原因和解决方案。') {
							console.log('进来了');
							uni.showToast({
								title: res,
								icon: 'none'
							})
						}
						if (res.status === 1) {
							let parms2 = {
								order_info: JSON.stringify(res.data)
							};
							api.payfooice(parms2).then(res => {
								if (res.status === 1) {
									uni.showToast({
										title: '支付成功',
										icon: 'success',
										duration: 1000
									});
									uni.redirectTo({
										url: '/pagesB/pages/creatorder/apforpaysuccess/apforpaysuccess'
									});
								} else {
									uni.showToast({
										title: res.msg,
										icon: 'error'
									});
									setTimeout(function() {
										uni.redirectTo({
											url: '/pages/index/index'
										});
									}, 1000);
								}
							});
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'error'
							});
							setTimeout(function() {
								uni.redirectTo({
									url: '/pagesB/pages/myland/myland'
								});
							}, 1000);
						}
					});
				}
			},
			showPop(flag = true) {
				this.password = '';
				this.show = flag;
			}
		}
	};
</script>
<style lang="scss">
	/deep/.u-code-input {
		justify-content: space-evenly;
	}

	.app {
		width: 100%;
	}

	.u-tooltip-tips {
		font-size: 50rpx !important;
		padding: 25rpx 10rpx !important;
	}

	.u-tooltip {
		align-items: center;
	}

	.u-tooltips-submit {
		font-size: 35rpx !important;
	}

	.u-tooltip-cancel {
		font-size: 35rpx !important;
	}

	.money {
		font-size: 65rpx;
		position: relative;
		text-align: center;
		margin: 25rpx 0;

		.close {
			position: absolute;
			top: 20rpx;
			right: 20rpx;
			line-height: 28rpx;
			font-size: 28rpx;
		}
	}

	.tips {
		color: #909399;
		text-align: center;
		margin: 15rpx 0;
	}

	.price-box {
		background-color: #fff;
		height: 265upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 28upx;
		color: #909399;

		.price {
			font-size: 50upx;
			color: #303133;
			margin-top: 12upx;

			&:before {
				content: '￥';
				font-size: 40upx;
			}
		}
	}

	.pay-type-list {
		margin-top: 20upx;
		background-color: #fff;
		padding-left: 60upx;

		.type-item {
			height: 120upx;
			padding: 20upx 0;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding-right: 60upx;
			font-size: 30upx;
			position: relative;
		}

		.icon {
			width: 100upx;
			font-size: 52upx;
		}

		.icon-erjiye-yucunkuan {
			color: #fe8e2e;
		}

		.icon-weixinzhifu {
			color: #36cb59;
		}

		.icon-alipay {
			color: #01aaef;
		}

		.tit {
			font-size: $font-lg;
			color: $font-color-dark;
			margin-bottom: 4upx;
		}

		.con {
			flex: 1;
			display: flex;
			flex-direction: column;
			font-size: $font-sm;
			color: $font-color-light;
		}
	}

	.mix-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 630upx;
		height: 80upx;
		margin: 80upx auto 30upx;
		font-size: $font-lg;
		color: #fff;
		border-radius: 10upx;
	}
</style>
