You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
137 lines
3.6 KiB
137 lines
3.6 KiB
<template>
|
|
<view class="box">
|
|
<view><uni-easyinput prefixIcon="phone-filled" v-model="mobile" @blur="onInput" placeholder="请输入手机号"></uni-easyinput></view>
|
|
<view style="margin-top: 10px;"><uni-easyinput prefixIcon="contact-filled" v-model="pucode" placeholder="请输入用户编号"></uni-easyinput></view>
|
|
<view class="input">
|
|
<uni-easyinput v-model="snsCode" placeholder="请输入内容" style="width: 100px;margin-right: 10px;"></uni-easyinput>
|
|
<button class="mini-btn" type="primary" size="mini" @click="toCode" :disabled="num > 0"> {{ num > 0 ? `${num}秒后重新获取` : '获取验证码' }}</button>
|
|
</view>
|
|
<view><button type="primary" style="width: 180px;margin-top: 20px;" @click="register">绑定手机号</button></view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import API from '@/common/js/api.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
mobile:'',
|
|
pucode:'',
|
|
snsCode:'',
|
|
intervalId: null,
|
|
num: 0,
|
|
styles:{
|
|
width:'100px'
|
|
}
|
|
}
|
|
},
|
|
onLoad() {
|
|
if (!uni.getStorageSync('phone')){
|
|
uni.showToast({title: '请先绑定手机号',icon: 'none'});
|
|
}
|
|
// 从本地存储中获取倒计时值
|
|
const savedNum = localStorage.getItem('countdownNum');
|
|
if (savedNum) {
|
|
this.num = parseInt(savedNum, 10);
|
|
if (this.num > 0) {
|
|
this.intervalId = setInterval(this.countDownTimer, 1000);
|
|
}
|
|
}
|
|
},
|
|
beforeDestroy() {
|
|
// 清除定时器
|
|
clearInterval(this.intervalId);
|
|
uni.removeStorageSync('countdownNum');
|
|
},
|
|
methods: {
|
|
countDownTimer() {
|
|
if (this.num > 0) {
|
|
this.num --;
|
|
localStorage.setItem('countdownNum', this.num);
|
|
} else {
|
|
clearInterval(this.intervalId);
|
|
localStorage.setItem('countdownNum', this.num);
|
|
}
|
|
},
|
|
toCode(){
|
|
if(!this.mobile){
|
|
uni.showToast({title: '请输入手机号',icon: 'none'});
|
|
return
|
|
}
|
|
const phonePattern = /^1[3-9]\d{9}$/;
|
|
if (!phonePattern.test(this.mobile)) {
|
|
uni.showToast({
|
|
title: '您输入的手机号格式有误',
|
|
icon: 'none'
|
|
});
|
|
return
|
|
}
|
|
|
|
this.num = 60; // 设置倒计时总时间
|
|
localStorage.setItem('countdownNum', this.num);
|
|
this.intervalId = setInterval(this.countDownTimer, 1000);
|
|
let data = {mobile:this.mobile}
|
|
API.sendSms(data, res => {
|
|
uni.showToast({title: res.msg,icon: 'none'});
|
|
})
|
|
},
|
|
// 限制手机号
|
|
onInput(event) {
|
|
this.mobile = event.detail.value
|
|
},
|
|
register(){
|
|
if(!this.mobile){
|
|
uni.showToast({title: '请输入手机号',icon: 'none'});
|
|
return
|
|
}
|
|
if(!this.pucode){
|
|
uni.showToast({title: '请输入用户编号',icon: 'none'});
|
|
return
|
|
}
|
|
if(!this.snsCode){
|
|
uni.showToast({title: '请输入短信验证码',icon: 'none'});
|
|
return
|
|
}
|
|
const phonePattern = /^1[3-9]\d{9}$/;
|
|
if (!phonePattern.test(this.mobile)) {
|
|
uni.showToast({
|
|
title: '您输入的手机号格式有误',
|
|
icon: 'none'
|
|
});
|
|
return
|
|
}
|
|
|
|
const url = '/wechat/wechat/savePuCode'
|
|
let data = {
|
|
mobile:this.mobile,
|
|
pucode:this.pucode,
|
|
snsCode:this.snsCode
|
|
}
|
|
API.request(url,data, res => {
|
|
if(res.code==1){
|
|
uni.setStorageSync('AccessToken', res.data.token);
|
|
uni.setStorageSync('phone', this.mobile);
|
|
uni.showToast({title: '手机号绑定成功',icon: 'none'})
|
|
setTimeout(()=>{
|
|
uni.navigateTo({
|
|
url:"/pages/index/index"
|
|
})
|
|
},1000)
|
|
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.box{
|
|
padding: 40px;
|
|
}
|
|
.input{
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 10px;
|
|
}
|
|
</style>
|
|
|