<template>
	<view>

		<RefreshView ref="mescrollRef" :hasBack="true" text="绑定手机号" :useDownScroll="false" :useUpScroll="false">

			<view style="margin-top: 30rpx;">
				<view class="inputRow">
					<image src="../../static/img/login/username.png" mode="aspectFill" class="drawableLeft"></image>
					<input type="number" maxlength="11" @input="phoneText" placeholder="请输入手机号" class="input" />
					<SendCodeItem :phoneNum="page.phone" url="aos/v1/aosUser/sendCodeFromWxBindMobile" @click="send" ref="wxCodeItem"></SendCodeItem>
				</view>
			</view>


			<view class="inputRow">
				<image src="../../static/img/login/code.png" mode="aspectFill" class="drawableLeft"></image>
				<input type="number" @input="codeText" maxlength="6" placeholder="请输入验证码" class="input" />
			</view>

			<view class="btn" @click="next">
				<text class="btnText">绑定手机</text>
			</view>

		</RefreshView>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				page: {
					phone: '',
					sysUserWxAuthSid: '',
					code: ''
				}
			};
		},
		onLoad(options) {
			this.page.sysUserWxAuthSid = options.sysUserWxAuthSid
			console.log('=======', options)
			console.log('=======', options.sysUserWxAuthSid)
		},
		methods: {
			next() {
				var phoneLength = this.page.phone.length;
				var codeLength = this.page.code.length;
				if (phoneLength == 0) {
					this.Toast("请输入手机号")
					return;
				}
				if (codeLength == 0) {
					this.Toast("验证码不能为空")
					return;
				}
				let _this = this
				this.HTTP({
					url: 'aos/v1/aosUser/wxBindMobile',
					data: {
						mobile: this.page.phone,
						sysUserWxAuthSid: this.page.sysUserWxAuthSid,
						code: this.page.code
					},
					method: 'POST',
					paramsType: "JSON",
					loading: true
				}).then((res) => {
					console.log('=======', res)
					if (res.code == 200) {
						// 保存
						_this.WritePreference("sysUserSid", res.data)
						_this.WritePreference("isLogin", true)
						getApp().globalData.isLogin = true
						getApp().globalData.sysUserSid = res.data
						console.log('=======1111111111111111111111111111111sdfasdf;kjasdfjkasdklfkasdjf;asdddddddddddddd',res)
						// $emit 触发事件  （主要返回给webviwew页面）
						// uni.$emit('login', res.data.memberSid)
						uni.navigateBack({
							delta: 10
						});

					}
				});


			},
			phoneText(e) {
				//手机号
				this.page.phone = e.detail.value;
			},
			send(e) { //发送验证码
				console.log(e);
			},
			codeText(e) {
				//验证码
				this.page.code = e.detail.value;
			}
		}
	};
</script>

<style lang="scss">
	.inputRow {
		display: flex;
		margin-left: 30rpx;
		margin-right: 30rpx;
		margin-bottom: 10rpx;
		margin-top: 10rpx;
		padding-bottom: 10rpx;
		border-bottom: 0.1px #F1F1F1 solid;
		align-items: center;

		.input {
			margin-left: 20rpx;
			height: 70rpx;
			flex: 1;
			font-size: 32rpx;
		}

		.drawableLeft {
			width: 40rpx;
			height: 40rpx;
			margin: 20rpx;
		}
	}

	.btn {
		display: flex;
		width: 90%;
		height: 80rpx;
		flex-direction: column;
		background-color: $uni-base-color;
		margin-top: 80rpx;
		margin-left: auto;
		margin-right: auto;
		align-items: center;
		justify-content: center;
		border-radius: 10rpx;

		.btnText {
			color: #ffffff;
			font-size: 33rpx;
		}
	}
</style>
