<template>
	<view class="page">
		<view class="content">
			<view class="title-wrap flex align-center">
				<image :src='STATIC_URL+"45.png"' mode=""></image>
				<text>收款商家: {{name}}</text>
			</view>
			<view class="input-wrap">
				<input type="digit" placeholder="请输入支付金额" v-model="money" @input="handleInputMoney">
			</view>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<view class="btn" @click="handlePay1" v-if="is_bangding==1">确定支付</view>

		<uni-popup ref="popup" type="bottom" border-radius="10px 10px 0 0">
			<view v-if="is_bangding==0" style="height: 40vh;display: flex;align-items: center;">
				<view style="margin-top: 100rpx;">
					<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="btn1">一键登录</button>

				</view>
			</view>
		</uni-popup>
		<!-- #endif -->
		<!-- #ifndef MP-WEIXIN -->
		<view class="btn" @click="handlePay">确定支付</view>

		<!-- #endif -->
	</view>
</template>
<script>
	import {
		LOGIN_PAGE_URL
	} from '@/common/config.js'
	export default {
		components: {},


		data() {
			return {
				id: '',
				name: '',
				money: '',
				isSubmit: false,
				loginCode: '',
				openid: '',
				is_bangding: 1,
				userinfo: {}
			};
		},
		watch: {},
		onLoad(options) {
			this.init()
			this.id = options.id || ''
			this.name = options.name || ''
			if (options.q) {
				let queryAll = decodeURIComponent(options.q);
				// let queryAll = 'https://yuerzx.magic-house.cn/mp?action=scan&invite_code=IC00177';
				if (queryAll.indexOf('/store?store_id=') != -1) {
					let params = queryAll.split("?")[1];
					let params1 = params.split("&")[0];
					let params2 = params.split("&")[1];
					let pair = params1.split("=")[1] ? params1.split("=")[1] : '';
					let name = params2.split("=")[1] ? params2.split("=")[1] : '';
					if (pair && name) {
						this.id = pair
						this.name = name
					} else {
						this.$message.info('暂不能识别此二维码');
						return
					}
				} else {
					this.$message.info('暂不能识别此二维码');
					return
				}
			}

		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {

		},
		onHide() {

		},
		onResize() {

		},
		onPullDownRefresh() {

		},
		onReachBottom(e) {

		},
		onPageScroll(e) {

		},
		methods: {
			init() {
				console.log(90909090123)
				let self = this
				uni.login({
					provider: 'weixin', //使用微信登录
					success: function(loginRes) {
						console.log(loginRes.code);
						self.loginCode = loginRes.code
						self.$api.post(global.apiUrls.post67ac5d9302006, {
								code: loginRes.code

							})
							.then(res => {
								if (res.data.code == 1) {
									console.log(res.data.data, 909090123)
									self.openid = res.data.data.openid
									self.is_bangding = res.data.data.is_bangding
									if (self.is_bangding == 0) {
										self.$refs.popup.open('top')
									} else {
										self.userinfo = res.data.data.userinfo
										// self.$store.commit('updateUserInfo', res.data
										// 	.data.userinfo);
										// global.token = res.data.data.userinfo.user_token
										// global.userInfo = res.data.data.userinfo
										// uni.setStorageSync('USER_INFO', res.data.data
										// 	.userinfo)
										// uni.setStorageSync('USER_TOKEN', res.data.data
										// 	.userinfo.user_token)
										// self.handle()
									}

								}

							})
							.catch(err => {

							})
					}
				});
			},
			getPhoneNumber(e) {
				// if (!this.money || this.money - 0 <= 0) return this.$message.info('请输入正确的支付金额')
				let self = this
				if (e.detail.errMsg == "getPhoneNumber:ok") { //点击了“允许”按钮，
					self.$api.post(global.apiUrls.post67ac3a198d7bd, {
							openid: self.openid,
							code: e.detail.code,
						})
						.then(res => {
							if (res.data.code == 1) {
								self.userinfo = res.data.data.userinfo
								self.$refs.popup.close()
								self.is_bangding = 1
								self.$store.commit('updateUserInfo', res.data
									.data.userinfo);
								global.token = res.data.data.userinfo.user_token
								global.userInfo = res.data.data.userinfo
								uni.setStorageSync('USER_INFO', res.data.data
									.userinfo)
								uni.setStorageSync('USER_TOKEN', res.data.data
									.userinfo.user_token)

								// self.handle()

							} else {

							}

						})
						.catch(err => {

						})
				}
			},
			handlePay1() {
				let self = this
				if (!this.money || this.money - 0 <= 0) return this.$message.info('请输入正确的支付金额')
				// if (self.is_bangding == 0) {
				// 	self.$message.info('您还没有绑定手机号,请点击按钮绑定手机号')
				// } else {
				self.$store.commit('updateUserInfo', self.userinfo);
				global.token = self.userinfo.user_token
				global.userInfo = self.userinfo
				uni.setStorageSync('USER_INFO', self.userinfo)
				uni.setStorageSync('USER_TOKEN', self.userinfo.user_token)
				self.handle()
				// }

			},

			handle() {
				if (this.isSubmit) return false;
				this.isSubmit = true;
				this.$api.post(global.apiUrls.scanPay, {
						store_id: this.id,
						money: this.money
					})
					.then(res => {
						if (res.data.code == 1) {
							uni.redirectTo({
								url: `/pages/dpxq/immediatePayment/immediatePayment?state=5&sn=${res.data.data.order_sn}&money=${this.money}&time=${res.data.data.surplus_time}`
							})

						} else {
							this.isSubmit = false;
							this.$message.info(res.data.msg)
						}

					})
					.catch(err => {
						this.isSubmit = false;
						console.log("err: ", err);
					})
			},
			handlePay() {

				if (!global.token) {
					uni.navigateTo({
						url: LOGIN_PAGE_URL
					})
					return false
				}
				if (!this.money || this.money - 0 <= 0) return this.$message.info('请输入正确的支付金额')
				if (this.isSubmit) return false;
				this.isSubmit = true;
				this.$api.post(global.apiUrls.scanPay, {
						store_id: this.id,
						money: this.money
					})
					.then(res => {
						if (res.data.code == 1) {
							uni.redirectTo({
								url: `/pages/dpxq/immediatePayment/immediatePayment?state=5&sn=${res.data.data.order_sn}&money=${this.money}&time=${res.data.data.surplus_time}`
							})
							// order_sn  postPayOrder
							// this.$api.post(global.apiUrls.postPayOrder, {order_sn: res.data.data.order_sn})
							// 	.then(res => {
							// 		if (res.data.code == 1) {
							// 		} else {
							// 			this.$message.info(res.data.msg)
							// 		}

							// 	})
							// 	.catch(err => {
							// 		console.log("err: ", err);
							// 	})
						} else {
							this.isSubmit = false;
							this.$message.info(res.data.msg)
						}

					})
					.catch(err => {
						this.isSubmit = false;
						console.log("err: ", err);
					})
			},
			handleInputMoney(e) {
				console.log(e);
				let change_money = this.money;
				change_money = change_money.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
				change_money = change_money.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
				change_money = change_money.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
				change_money = change_money.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
				if (change_money.indexOf(".") < 0 && change_money != "") { //以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
					change_money = parseFloat(change_money);
				} else if (change_money.indexOf(".") == 0) { //首为小数点，补全
					if (change_money.length > 1) {
						change_money = `0${change_money}`
					} else {
						change_money = change_money.replace(/[^$#$]/g, "0.");
						change_money = change_money.replace(/\.{2,}/g, ".");
					}

				}
				setTimeout(() => { //这个一定要定时器
					this.money = change_money
				}, 50)
			},
		}
	};
</script>
<style lang="scss" scoped>
	.page {
		width: 100vw;
		height: 100vh;
		background-color: #f6f7f9;
	}

	.content {
		padding: 32rpx 32rpx;
		box-sizing: border-box;
		background-color: #fff;

		.title-wrap {
			image {
				width: 32rpx;
				height: 28rpx;
			}

			text {
				margin-left: 24rpx;
				font-size: 28rpx;
				color: #333;
				font-weight: bold;
			}
		}

		.input-wrap {
			margin-top: 32rpx;
			width: 100%;
			height: 90rpx;
			border-radius: 8rpx;
			border: 1px solid #FF9300;

			input {
				padding: 0 32rpx;
				width: 100%;
				height: 100%;
				font-size: 30rpx;
			}
		}
	}

	.btn {
		position: fixed;
		bottom: 48rpx;
		left: 32rpx;
		width: 686rpx;
		height: 80rpx;
		background: #FF9300;
		border-radius: 50rpx;
		opacity: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		color: #fff;
	}

	.btn1 {

		width: 686rpx;
		height: 80rpx;
		background: #FF9300;
		border-radius: 50rpx;
		opacity: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		color: #fff;
	}
</style>