<template>
	<view>
		<!-- 自定义导航栏 -->
		<view class="navBarBox">
			<!-- 状态栏占位 -->
			<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
			<!-- 真正的导航栏内容 -->
			<view class="navBar">
				<view>绑定账号</view>
			</view>
		</view>
		<view style="margin-top: 30rpx;">
			<view class="inputRow">
				<!-- 	<image src="../../static/baseIcon/username.png" mode="aspectFill" class="drawableLeft"></image> -->
				<input type="number" maxlength="11" @input="phoneText" placeholder="请输入手机号" class="input" />
				<SendCodeItem :phoneNum="page.mobile" url="/v1/wxuser/sendVerificationCode" @click="send"
					ref="wxCodeItem"></SendCodeItem>
			</view>
		</view>


		<!-- 	<view class="inputRow">
			<image src="../../static/baseIcon/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>

		<view v-show="!isShow">
			<view style="display: flex;flex-direction: column;justify-content: center;width: 100%;margin-top: 50px;">
				<text style="width: 100%;text-align: center;font-size: 35px;color: #f00;">抱歉！</text>
				<text style="margin: 20px; text-align: center;font-size: 30px;color: #f00;">您的平台应用未被授权，请联系工作人员。</text>
			</view>

		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				isShow: true,
				// 状态栏高度
				statusBarHeight: 0,
				// 导航栏高度
				navBarHeight: 82 + 11,
				page: {
					mobile: '',
					openid: '',
					code: '',
					unionid: ""
				}
			};
		},

		//第一次加载时调用
		created() {
			//获取手机状态栏高度
			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
		},
		onShow() {
			/*  #ifdef  MP-WEIXIN */
			wx.hideHomeButton();
			/* #endif */
		},
		onLoad(options) {
			console.log('=======', options)
			this.page.openid = options.openid
			this.page.unionid = options.unionid
			console.log('this.page', this.page)

		},
		methods: {
			next() {
				var mobileLength = this.page.mobile.length;
				var codeLength = this.page.code.length;
				if (mobileLength == 0) {
					uni.showToast({
						icon: 'error',
						title: '手机号不能为空'
					})
					return;
				}

				let _this = this
				console.log('1111', _this.page)
				_this.$api.wxBindMobile(_this.page).then((resp) => {
					// if (resp.success) {
					console.log('1111', resp)

					getApp().globalData.sid = resp
					// getApp().globalData.token = resp.token
					// getApp().globalData.sid = resp.sid
					// getApp().globalData.mobile = resp.mobile
					// getApp().globalData.isLogin = true

					// _this.WritePreference("sysUserSid", res.data)
					// _this.WritePreference("isLogin", true)
					// getApp().globalData.isLogin = true
					// getApp().globalData.sysUserSid = res.data

					uni.switchTab({
						url: '/pages/card/card'
					})

					// uni.switchTab({
					// 	url: '/pages/home/WorkFragment'
					// });
				}).catch(e => {
					console.log('eeeee', e)
					// uni.showModal({
					// 	title: '温馨提示',
					// 	content: '您的平台应用未被授权，请联系工作人员。',
					// 	showCancel: false,
					// 	success: function(res) {
					// 		if (res.confirm) {

					// 		} else {
					// 			console.log('点击了取消')
					// 		}
					// 	}
					// })

				})


				// 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.mobile = e.detail.value;
			},
			send(e) { //发送验证码
				console.log(e);
				this.isShow = e.success
				console.log("this.isShow", this.isShow);

			},
			codeText(e) {
				//验证码
				this.page.code = e.detail.value;
			}
		}
	};
</script>

<style lang="scss">
	.navBarBox {
		background: #007AFF;
	}

	.navBarBox .statusBar {}

	.navBarBox .navBar {
		padding-top: 15px;
		padding-bottom: 13px;
		display: flex;
		font-size: 13px;
		flex-direction: row;
		color: #ffffff;
		justify-content: center;
		align-items: center;
	}

	.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: #007AFF;
		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>