11

pages/login/reg.vue

@@ -0,0 +1,149 @@
+<template>
+	<login-template title="手机注册">
+		<jl-input type="number" v-model="phone" placeholder="请输入手机号" />
+		<code-input ref="code" v-model="code" :getCode="getCaptcha" @key-change="keyChange" @confirm="goSetCode"></code-input>
+		<view v-if="loading" class="btn nocheck">发送中</view>
+		<view v-else-if="validate" class="btn" @click="goSetCode">获取验证码</view>
+		<view v-else class="btn nocheck">获取验证码</view>
+		
+		<view class="changeLogintype">
+			<navigator open-type="navigateBack">返回登录</navigator>
+		</view>
+	</login-template>
+</template>
+
+<script>
+	import {
+		isMobile
+	} from '@/untils/validate.js'
+	import codeInput from './codeInput.vue'
+	import {
+		accountsendValidate,
+		getCaptcha,
+		validateCode,
+		reg
+	} from '@/api/reg.js'
+	import loginTemplate from './template.vue'
+	import jlInput from '@/components/jl-input/main.vue'
+	import {mapGetters} from 'vuex'
+	export default {
+		components: {
+			jlInput,
+			codeInput,
+			loginTemplate
+		},
+		data() {
+			return {
+				loading: false,
+				phone: '',
+				code: '',
+				key: '',
+				sms: '',
+				defCount:5,//默认发送验证码次数
+			}
+		},
+		onLoad(options) {
+			// 获取短信验证码
+			uni.$off('accountsendValidate')
+			uni.$on('accountsendValidate', (cb) => {
+				accountsendValidate(this.phone, this.key, this.code).then(() => {
+					cb()
+				}).catch((res) => {
+					uni.navigateBack()
+					uni.showToast({
+						title: res.message,
+						icon: 'none'
+					});
+					this.$refs.code.refushCode()
+				})
+			})
+			// 设置密码页抬头
+			uni.$off('passwordGetTitle')
+			uni.$on('passwordGetTitle', (cb) => {
+				cb('创建密码')
+			})
+			// 短信验证码输入完毕
+			uni.$off('setSMS')
+			uni.$on('setSMS', (sms) => {
+				validateCode(this.phone, sms).then(res => {
+					this.sms = sms
+					uni.hideKeyboard()
+					uni.navigateTo({
+						url: `./setPassword`
+					})
+				})
+			})
+			// 设置密码
+			uni.$off('setPassword')
+			uni.$on('setPassword', ({
+				password,
+				cb
+			}) => {
+				reg(this.phone, password, this.sms).then(() => {
+					cb()
+					uni.navigateBack({
+						delta: 3
+					})
+					setTimeout(() => {
+						uni.showToast({
+							title: '注册成功',
+							icon: 'none'
+						});
+					}, 1000)
+				})
+			})
+		},
+		methods: {
+			goLogin(success) {
+				uni.redirectTo({
+					url: './login',
+					success
+				})
+			},
+			goSetCode(e) {
+				if(!this.userChecked){
+					uni.showToast({
+						title:'请先阅读并同意《服务及隐私协议》',
+						icon:'none'
+					})
+				}
+				else{
+					this.loading = true;
+					accountsendValidate(this.phone, this.key, this.code).then((res) => {
+						if(res.data.code==200){
+							let count=res.data.data;
+							this.$store.dispatch('UpdateUserSendTimes',count);
+							if(count>=1 && count<=5){
+									uni.navigateTo({
+										url: `./setCode?phone=${this.phone}&count=${count}`
+									})
+								
+								
+							}
+						
+						}
+						this.loading=false;
+					}).catch(() => {
+						this.loading = false;
+						this.$refs.code.refushCode()
+					})
+				}
+			},
+			keyChange(val) {
+				this.key = val
+			},
+			isMobile,
+			getCaptcha
+		},
+		computed: {
+			...mapGetters(['userChecked']),
+			validate() {
+				return isMobile(this.phone) && this.code
+			}
+		}
+	}
+</script>
+
+<style>
+	@import "./css";
+</style>