150 lines
3.4 KiB
Vue
150 lines
3.4 KiB
Vue
|
<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>
|