yql/pages/set/bindWx.vue

<template>
	<view class="login-container">
		<view class="login-logo">
			<image src="../../static/login/wxlogin.png" alt=""></image>
		</view>
		<view class="login-form">
			<view class="" style="height: 30rpx;">
				
			</view>
			<button :class="['landing',checkIn ? 'landing_true' : 'landing_false']" :disabled="checkIn ? false : true"
				class="zai-btn" @tap="subReg">绑定</button>
		</view>
	</view>
</template>

<script>
	import uniPopup from '../../components/uni-popup/uni-popup.vue';
	import uniPopupConfirm from '../../components/uni-popup/uni-popup-confirm.vue';
	import _get from "../../common/_get";
	import _data from "../../common/_data";
	export default {
		data() {
			return {
				miaoqiang: 'tests',
				popuMsg: '恭喜您注册成功,是否立即更改资料?',
				showPassword: true,
				showText: true,
				second: 60,
				form: {
					phone: '',
					password: '',
					code_coerce:1,
					sms_code: '',
					type: 'REGISTER'
				},
				close_icon: true
			}
		},
		components: {
			uniPopup,
			uniPopupConfirm
		},
		onLoad() {

		},
		onShow() {
			console.log(this.form.mobileCode);
			let _this = this;
			_get.getSysConfig({}, function(res) {
				// console.log('111111111111111111111',res.user_regiter_code_status)
				if (res.user_regiter_sms_status == 1) {
					_this.form.mobileCode = 1
				} else {
					_this.form.mobileCode = 0
				}
				if(res.user_regiter_code_status == 1){
					_this.form.code_coerce = 1
				}else {
					_this.form.code_coerce = 0
				}
			})
		},
		computed: {
			checkIn() {
				return true
			}
		},
		methods: {
			backLogin() {
				uni.navigateBack({

				})
			},
			goTerms() {
				uni.navigateTo({
					'url': '/pages/in/terms'
				})
			},
			goPrivacy() {
				uni.navigateTo({
					'url': '/pages/in/privacy'
				})
			},
			goPath() {
				uni.navigateTo({
					'url': '/pages/in/web'
				})
			},
			close() {
				let _this = this;
				uni.reLaunch({
					url: '../chat/index',
					success: function() {
						_this.$refs.popup.close();
					}
				});
			},
			confirm(e) {
				let _this = this;
				uni.redirectTo({
					url: '/pages/my/details',
					success: function() {
						_this.$refs.popup.close();
					}
				});
			},
			isPoneAvailable($poneInput) {
				let myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
				if (!myreg.test($poneInput)) {
					return false;
				} else {
					return true;
				}
			},
			getCode() {
				let _this = this;
				if (this.form.phone.trim() == '') {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					});
					return false;
				}

				if (!this.isPoneAvailable(this.form.phone.trim())) {
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					});
					return false;
				}
				_get.getSms({
					mobile: this.form.phone,
					type: 'REGISTER'
				}, function(res) {
					console.log(22222)
					_this.cutDown();
				}, function(res) {
					console.log(1111)
					uni.showToast({
						title: res.msg,
						duration: 2000,
						icon: 'none'
					});
				})
			},
			cutDown(val) { //倒计时
				//获取验证码
				this.showText = false;
				var interval = setInterval(() => {
					let times = --this.second;
					times = times < 0 ? 0 : times;
					this.second = times < 10 ? '0' + times : times //小于10秒补 0
				}, 1000)
				setTimeout(() => {
					clearInterval(interval)
					this.second = 60;
					this.showText = true;
				}, 60000)
			},
			subReg() {
				let _this = this;
				uni.login({
				  provider: 'weixin',
				  success: function (loginRes) {
				    console.log('loginRes.authResult',loginRes.authResult);
				    // 获取用户信息
				    uni.getUserInfo({
				      provider: 'weixin',
				      success: function (infoRes) {
				        console.log('用户昵称为：' + JSON.stringify(infoRes.userInfo) );
						// console.log();
						_this.$httpSend({
							path: "/im/user/app_bangding",
							data: {
								openId: infoRes.userInfo.openId,
								nickName: infoRes.userInfo.nickName,
								gender: infoRes.userInfo.gender,
								unionId: infoRes.userInfo.unionId,
								avatarUrl: infoRes.userInfo.avatarUrl
							},
							success_action: true,
							success(res) {
								console.log(JSON.stringify(res.data));
								uni.showToast({
									title: '绑定成功',
									duration: 1000,
								});
								setTimeout(()=> {
									uni.switchTab({
										url:'/pages/my/index'
									});
								},1500)
							}
						});
				      }
				    });
				  }
				})
			}

		}
	}
</script>

<style scoped lang="scss">
	.uni-input-placeholder {
		color: #ccc !important;
	}

	input[type="password"]::-ms-reveal {
		display: none;
	}

	.login-icon {
		image {
			width: 40rpx;
			height: 40rpx;
		}
	}

	.login-nav-bar {
		height: 44px;
		display: flex;
		align-items: center;
		position: absolute;
		justify-content: flex-start;
		left: 0;
		top: 0;
		/* #ifdef APP-PLUS */
		top: var(--status-bar-height);

		/* #endif */
		.arrow-back {
			width: 44rpx;
			height: 44rpx;
			margin-left: 20rpx;
		}
	}


	.login-container {
		background-color: #ffffff;
		height: 100vh;
		width: 100vw;
		padding: 0 60rpx;
		position: relative;
		box-sizing: border-box;
		// background-image: url(@/static/login/bg.png);
		background-repeat: no-repeat;
		background-size: 100% auto;

		.login-form {
			display: flex;
			flex-direction: column;

			.login-bottom {
				display: flex;
				justify-content: center;
				align-items: center;
				height: 100rpx;

				.login-random {
					text-decoration: none;
					color: #999;
					font-size: 14px;
				}

				.tips {
					font-size: 12px;
					color: #b5746c;
					height: 60rpx;
					line-height: 60rpx;
					text-align: center;
					// width: 100%;
				}
			}

			.login-btn {
				width: 100%;
				height: 100rpx;
				border-radius: 50px;
				background-color: #2da2fd;
				color: #fff;
				font-size: 16px;
				display: flex;
				justify-content: center;
				align-items: center;
				margin-top: 100rpx;
			}

			.form-item {
				display: flex;
				height: 100rpx;
				align-items: center;
				border-bottom: 1px solid #eee;

				.item-lable {
					font-size: 16px;
					color: #333;
					width: 180rpx;
				}

				.item-input {
					border: none;
					outline: none;
					background: none;
					font-size: 16px;
					color: #000;
					height: 100%;
					flex: 1;
				}
			}
		}

		.login-title {
			padding-top: 250rpx;
			font-size: 24px;
			font-weight: bold;
			padding-bottom: 150rpx;
		}
		.login-logo{
			padding-top: 200rpx;
			padding-bottom: 80rpx;
			text-align: center;
		}
		.login-logo image{
			width: 150rpx;
			height: 150rpx;
		}
	}

	.zai-viewl {
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.zai-box {
		padding: 0 100upx;
		position: relative;
	}

	.zai-logo {
		width: 160upx;
		width: 160upx;
		height: 160upx;
		margin-top: 114upx;
	}

	.zai-title {
		position: absolute;
		top: 0;
		line-height: 360upx;
		font-size: 68upx;
		color: #fff;
		text-align: center;
		width: 100%;
		margin-left: -100upx;
	}

	.zai-form {
		margin-top: 150upx;
	}

	.form-code {
		margin-top: 30upx;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}

	.form-code .code {
		height: 100%;
		border-radius: 50px;
		text-align: center;
		font-size: 14px;
		background: #ff65a3;
		color: #ffffff;
	}

	.zai-input {
		background: #e2f5fc;
		margin-top: 30upx;
		border-radius: 100upx;
		padding: 20upx 40upx;
		font-size: 36upx;
	}

	.code-input {
		background: #e2f5fc;
		border-radius: 100upx;
		padding: 20upx 40upx;
		font-size: 36upx;
		width: 40%;
	}

	.input-placeholder,
	.zai-input {
		color: #94afce;
	}

	.zai-label {
		text-align: center;
		font-size: 30upx;
		color: #666;
		height: 120rpx;
		display: flex;
		align-items: center;
		text-align: left;
	}

	.zai-btn {
		background: #2da2fd;
		border: 0;
		border-radius: 50rpx;
		font-size: 16px;
		color: #fff;
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.zai-btn:after {
		border: 0;
	}

	/*按钮点击效果*/
	.zai-btn.button-hover {
		transform: translate(1upx, 1upx);
	}

	.zai-footer {
		display: flex;
		justify-content: center;
		align-items: center;
		color: #a7b6d0;
		padding-top: 10px;
	}
</style>