90 lines
2.4 KiB
Vue
90 lines
2.4 KiB
Vue
<template>
|
|
<div>
|
|
<headerNav title="手机号登录"/>
|
|
<div>
|
|
<div style="padding-top: 70px;">
|
|
<van-cell-group>
|
|
<van-field
|
|
placeholder="请输入手机号"
|
|
@input="inputMobile"
|
|
/>
|
|
<van-field
|
|
center
|
|
placeholder="请输入短信验证码"
|
|
@input="inputCode"
|
|
>
|
|
<van-button slot="button" size="small" type="primary" @click="sendCode">发送验证码</van-button>
|
|
</van-field>
|
|
</van-cell-group>
|
|
<div style="margin: 10px;">
|
|
<van-button size="large" type="primary" style="height: 45px;line-height:45px;" @click="submit">登录</van-button>
|
|
</div>
|
|
<div>1. 新注册的手机号验证后自动创建账户</div>
|
|
<div>2. 默认验证码是 9999</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { doPassportMobileSendRegisterCode, doPassportMobileRegister } from '../../api/user';
|
|
import { Dialog } from 'vant';
|
|
import { setLoginToken } from '../../utils/cache';
|
|
|
|
export default {
|
|
|
|
data() {
|
|
return {
|
|
mobile: '',
|
|
code: '',
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
inputMobile: function (value) {
|
|
this.mobile = value;
|
|
},
|
|
inputCode: function (value) {
|
|
this.code = value;
|
|
},
|
|
sendCode: function() {
|
|
if (!this.mobile || this.mobile.length !== 11) {
|
|
Dialog.alert({
|
|
title: '系统提示',
|
|
message: '手机号码不正确',
|
|
});
|
|
return;
|
|
}
|
|
let response = doPassportMobileSendRegisterCode(this.mobile);
|
|
response.then(data => {
|
|
Dialog.alert({
|
|
title: '系统提示',
|
|
message: '发送验证码成功',
|
|
});
|
|
});
|
|
},
|
|
submit: function () {
|
|
let that = this;
|
|
let response = doPassportMobileRegister(this.mobile, this.code);
|
|
response.then(data => {
|
|
setLoginToken(data.accessToken, data.refreshToken);
|
|
Dialog.alert({
|
|
title: '系统提示',
|
|
message: '登陆成功',
|
|
beforeClose: function (action, done) {
|
|
done();
|
|
// TODO 芋艿,先暂时不做 callback
|
|
that.$router.push('/user/index');
|
|
}
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|