ppl/pages/lanhu_register/index.vue

<template>
	<view>
		<view style="background: #fff;margin: auto;border-radius: 5%;padding: 50rpx 80rpx;">
			<view>
				<picker @change="bindPickerChange" :value="index" :range="array">
					<view class="text_2 jiantou" style="color: #000;line-height: 90rpx;padding-left: 40rpx;">
						{{array[index]}}
					</view>
				</picker>
			</view>
			<view><input class="text_2" placeholder="请输入昵称" v-model="data.nick_name" /></view>
			<view><input class="text_2" placeholder="请输入手机号码" v-model="data.mobilephone" /></view>
			<view class="text_2"><input class="text_2" placeholder="短信验证码" v-model="data.yzm"
					style="float: left;width:150rpx;" />
				<view class="yzm" v-show="showTime == false" @click="yan">获取</view>
				<view class="yzm" v-show="showTime == true"> {{time}}</view>
			</view>
			<view><input class="text_2" password="true" type="safe-password" placeholder="请输入登录密码"
					v-model="data.mobilepwd" /></view>
			<view><input class="text_2" password="true" type="safe-password" placeholder="请再输入一次登录密码"
					v-model="data.mobilepwd1" /></view>
			<view><input class="text_2" password="true" type="safe-password" placeholder="请输入支付密码"
					v-model="data.paypwd" /></view><button class="text_6" @click="onClick_1">确认注册</button><button
				class="text_7" @click="onClick_2">
				<image src="../../static/anzhuo.png" style="width: 48rpx;height: 54rpx;"><text>下载app</text>
			</button>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				constants: {},
				data: {
					pid: '0',
					nick_name: '',
					mobilephone: '',
					mobilepwd: '',
					mobilepwd1: '',
					paypwd: '',
					yzm: '',
					zd: '请选择战队'
				},
				array: ['请选择战队',
					'西南区',
					'西北区',
					'华东区',
					'华南区',
					'华中区'
				],
				index: 0,
				time: 60,
				showTime: false
			}
		},
		onLoad(option) {
			// console.log(option);
			if (option.pid > 0) {
				// console.log('option');
				this.data.pid = option.pid;
				// console.log(this.data.pid);
			}
		},
		methods: {
			dao() {
				var that = this
				var data = setTimeout(function() {
					that.time--; //console.log(that.time);
					that.dao();
				}, 1000)
				if (that.time == 0) {
					this.time = 60;
					that.showTime = false;
					clearTimeout(data);
				}
			},
			yan() {
				var myreg = /^[1][3,4,5,7,8,9][0 - 9] {9}$ /;
				var that = this;
				if (this.data.mobilephone == '') {
					uni.showToast({
						icon: 'none',
						duration: 800,
						title: '请先输入手机号'
					})
				} else {
					this.dao();
					this.showTime = true;
					var data = new Object();
					data.tel = this.data.mobilephone;
					this.$api.MhPostModel(data, "sms/yzm").then(res => {}).catch(
						err => {});
				}
			},
			bindPickerChange: function(e) {
				this.index = e.detail.value;
				this.data.zd = this.array[this.index];
			},
			onClick_1() {
				var data = new Object();
				data.sjh = this.data.mobilephone;
				data.mm = this.data.mobilepwd;
				data.pid = this.data.pid;
				data.nichen = this.data.nick_name;
				data.zd = this.data.zd;
				data.paypwd = this.data.paypwd;
				data.yzm = this.data.yzm;
				if (!data.sjh || !data.mm || !data.nichen || !data.paypwd || !data.yzm || data.zd == '请选择战队') {
					uni.showToast({
						title: "请输入完整信息后注册",
						icon: "none"
					});
					return;
				}

				if (data.zd == '请选择战队') {
					uni.showToast({
						title: "请选择战队",
						icon: "none"
					});
					return;
				}

				this.$api.MhPostModel(data, "user/reg").then(res => {

					// console.log('user/reg信息', JSON.stringify(res));
					if (res.data.code != 1) {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						});
						return;
					}
					uni.showToast({
						title: '注册成功',
						icon: 'none'
					});
					setTimeout(function() {
						uni.navigateTo({
							url: '/pages/lanhu_login/index'
						});
					}, 2000);

				}).catch(err => {
					// console.log('request fail', JSON.stringify(err));
				});
			},
			onClick_2() {
				location.href = "https://aixiangcheng.qicaihong.info/down";
			}
		}
	};
</script>
<style lang="css">
	page {
		background: url(../../static/loginbg.png) #fff no-repeat;
		background-size: 100% auto;
		background-position: top;
		padding: 0;
		height: auto;
		margin: 0;
		padding-top: 480rpx;
	}

	.text_2 {
		background: #f5f5f8;
		font-size: 28rpx;
		height: 90rpx;
		line-height: 90rpx;
		padding-left: 20rpx;
		margin-bottom: 30rpx;
		border-radius: 10rpx;
	}

	.yzm {
		float: right;
		margin-right: 30rpx;
		background: #98a737;
		height: 60rpx;
		line-height: 60rpx;
		margin-top: 15rpx;
		padding: 0 20rpx;
		border-radius: 10rpx;
		font-size: 28rpx;
		color: #fff;
	}

	.text_6 {
		background-image: linear-gradient(#829c52, #59723b);
		color: #fff;
		border: 0;
		font-size: 28rpx;
		height: 90rpx;
		line-height: 90rpx;
	}

	.text_7 {
		margin-top: 30rpx;
		background: #fff;
		border: #59723b solid 1rpx;
		font-size: 28rpx;
		height: 90rpx;
		line-height: 90rpx;
		color: #59723b;
	}

	.text_7 image {
		display: inline-block;
		vertical-align: middle;
		padding-bottom: 15rpx;
	}

	.text_7 text {
		display: inline-block;
		margin-left: 20rpx;
	}

	.jiantou {
		background: url(../../static/jiantou.png) #f5f5f8 no-repeat;
		background-position: 98% center;
		background-size: 50rpx;
	}
</style>