lccsw
144 lines
4.9 KiB
PHP
144 lines
4.9 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>东风EV</title>
|
|
<link rel="stylesheet" href="/static/css/login.css">
|
|
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/jquery.3.4.1.min.js"></script>
|
|
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/vue.2.6.10.min.js"></script>
|
|
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/mDialog.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app" class="login relative">
|
|
<div class="absolute login-con">
|
|
<div class="inpu-bg">
|
|
<input class="wp100 int-sty font-16" type="tel" v-model="telPhone" placeholder="请输入手机号" />
|
|
</div>
|
|
<div class="mt20 inpu-bg pr120 relative">
|
|
<input class="wp100 int-sty font-16" type="number" v-model="vCode" placeholder="请输入验证码" />
|
|
<button class="absolute right-0 box-middle mr15 bg-none border-none font-16 color-00e9ff" :disabled="!codeState" @click="getcode()">{{codeTx}}</button>
|
|
</div>
|
|
|
|
<button class="mt30 lgbtn font-36 color-00e9ff" @click="submit()">登 录</button>
|
|
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
telPhone:'',
|
|
vCode:'',
|
|
codeState:true,
|
|
codeTx:'获取验证码',
|
|
isSubmiting: false,
|
|
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
mounted() {
|
|
var Timer;
|
|
},
|
|
beforeDestroy() {
|
|
|
|
},
|
|
methods: {
|
|
|
|
countDownTime(time) {
|
|
let that = this;
|
|
if (time > 1) {
|
|
time--;
|
|
this.codeState = false;
|
|
this.codeTx = time + "s后重新获取";
|
|
Timer = setTimeout(function() {
|
|
that.countDownTime(time);
|
|
}, 1000)
|
|
} else {
|
|
clearTimeout(Timer);
|
|
that.codeState = true;
|
|
that.codeTx = "获取验证码";
|
|
}
|
|
},
|
|
|
|
getcode() {
|
|
var that = this
|
|
if (!/^1[3456789]\d{9}$/.test(this.telPhone)) {
|
|
//alert('请输入正确手机号')
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: "请输入正确手机号"
|
|
});
|
|
|
|
} else {
|
|
$.ajax({
|
|
'url': '/login/get_code',
|
|
'method': 'post',
|
|
'type': 'json',
|
|
'data': {mobile: this.telPhone},
|
|
success: function (data) {
|
|
//按钮倒计时
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: data.msg
|
|
});
|
|
if(data.code){
|
|
that.countDownTime(61)
|
|
}
|
|
}
|
|
})
|
|
}
|
|
},
|
|
|
|
submit() {
|
|
if (this.isSubmiting) return;
|
|
if (!/^1[3456789]\d{9}$/.test(this.telPhone)) {
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: "请输入正确手机号"
|
|
});
|
|
}else if (!this.vCode) {
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: "请输入验证码"
|
|
});
|
|
}else{
|
|
this.isSubmiting = true
|
|
var that = this;
|
|
$.ajax({
|
|
'url': '/login/post',
|
|
'method': 'post',
|
|
'type': 'json',
|
|
'data': {'mobile': this.telPhone,'code':that.vCode,'need_code':'login'},
|
|
success: function (data) {
|
|
if(data.code){
|
|
window.location.href = '/';
|
|
}else{
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: data.msg
|
|
});
|
|
}
|
|
that.isSubmiting = false;
|
|
}
|
|
})
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
})
|
|
</script>
|
|
</body>
|
|
|
|
</html> |