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.
81 lines
2.5 KiB
81 lines
2.5 KiB
3 years ago
|
<template>
|
||
|
|
<view class="bindPhone">
|
||
|
|
<view class="phoneInput">
|
||
|
|
<input class="form-input" maxlength="11" placeholder-class="form-input-placeholder" v-model="bindForm.phone" placeholder="请输入手机号" />
|
||
|
|
</view>
|
||
|
|
<view class="phoneInput flex-between mat15">
|
||
|
|
<input class="form-input" maxlength="6" placeholder-class="form-input-placeholder" v-model="bindForm.code" placeholder="请输入验证码" />
|
||
|
|
<text class="code_hr"></text>
|
||
|
|
<text @click="getCode">{{codeCenter}}</text>
|
||
|
|
</view>
|
||
|
|
<view class="mat40">
|
||
|
|
<navigator url="/pages/user/user" open-type="switchTab">
|
||
|
|
<button class="cu-btn block bg-blue margin-tb-sm lg round" @click="bindPhoneClick">立即绑定</button>
|
||
|
|
</navigator>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default{
|
||
|
|
data(){
|
||
|
|
return{
|
||
|
|
bindForm: {
|
||
|
|
phone: '',
|
||
|
|
code: ''
|
||
|
|
},
|
||
|
|
codeCenter: '获取验证码',
|
||
|
|
bindPhoneDisabled: true,
|
||
|
|
totalTime: 60
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
//发送验证码
|
||
|
|
async getCode() {
|
||
|
|
if(!this.bindForm.phone) return uni.showToast({title: '请先输入手机号',icon: 'none'})
|
||
|
|
let pattern = /^1[3456789]\d{9}$/
|
||
|
|
if (!pattern.test(this.bindForm.phone)) return uni.showToast({title: '请输入正确的手机号',icon: 'none'})
|
||
|
|
let res = await this.$http.get('/api-hrms/hrms/user/info',{ phone: this.bindForm.phone })
|
||
|
|
this.codeCenter = this.totalTime + 's后重新发送';
|
||
|
|
let clock = window.setInterval(() => {
|
||
|
|
this.totalTime--;
|
||
|
|
this.codeCenter = this.totalTime + 's后重新发送';
|
||
|
|
if (this.totalTime < 0) {
|
||
|
|
window.clearInterval(clock);
|
||
|
|
this.codeCenter = '重新发送验证码';
|
||
|
|
this.totalTime = 60;
|
||
|
|
}
|
||
|
|
}, 1000);
|
||
|
|
},
|
||
|
|
// 绑定手机号码
|
||
|
|
async bindPhoneClick() {
|
||
|
|
if(!this.bindForm.phone) return uni.showToast({title: '请先输入手机号',icon: 'none'})
|
||
|
|
let pattern = /^1[3456789]\d{9}$/
|
||
|
|
if (!pattern.test(this.bindForm.phone)) return uni.showToast({title: '请输入正确的手机号',icon: 'none'})
|
||
|
|
if(!this.bindForm.code) return uni.showToast({title: '请先输入手机号验证码',icon: 'none'})
|
||
|
|
let res = await this.$http.get('/api-hrms/hrms/user/binding',this.bindForm)
|
||
|
|
uni.showToast({title: '绑定成功'})
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.bindPhone{
|
||
|
|
padding: 200rpx 90rpx 0 90rpx;
|
||
|
|
.phoneInput{
|
||
|
|
border: 2rpx solid #E6E6E6;
|
||
|
|
border-radius: 40rpx;
|
||
|
|
height: 80rpx;
|
||
|
|
padding: 0 40rpx;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
.code_hr{
|
||
|
|
width: 2rpx;
|
||
|
|
height: 40rpx;
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|