xiaoyu
164 lines
6.6 KiB
PHP
164 lines
6.6 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><?=$_title?></title>
|
|
<link rel="stylesheet" href="/css/h5/market/sylive/h5.css?20221106">
|
|
<link rel="stylesheet" href="https://qs.liche.cn/web/javascript/swiper/css/swiper.min.css">
|
|
<script type="text/javascript" src="https://qs.liche.cn/web/javascript/jquery.3.4.1.min.js"></script>
|
|
<script type="text/javascript" src="https://qs.liche.cn/web/javascript/vue.2.6.10.min.js"></script>
|
|
<script type="text/javascript" src="https://qs.liche.cn/web/javascript/mDialog.js"></script>
|
|
<script type="text/javascript" src="https://qs.liche.cn/web/javascript/swiper/js/swiper.min.js"></script>
|
|
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
|
|
</head>
|
|
<body class="bg-fff">
|
|
<div id="app" ref="app">
|
|
<div class="container relative bg-repeat-y bg-size-fullwidth bg-pos-center" style="background-image:url(https://qs.liche.cn/web/images/project/H5-ShiYu/loginbg.jpg?v=221008)">
|
|
<div class="absolute box-middle left-0 right-0 pl40 pr40 pb220">
|
|
<div class="pb50 color-fff">
|
|
<div class="font-64">您好！</div>
|
|
<div class="mt20 font-36">欢迎来到私域直播</div>
|
|
</div>
|
|
<div class="bg-fff pl50 pr50 pt60 pb60 ulib-r20">
|
|
<div class="text-center font-56">登录</div>
|
|
<div class="relative mt40 bg-f6 ulib-r10">
|
|
<input class="wp100 pt30 pb30 pl20 pr20 bg-f6 border-none font-32 ulib-r10" type="tel" v-model="telPhone" placeholder="请输入手机号" />
|
|
</div>
|
|
<div class="relative mt30 pr120 bg-f6 ulib-r10">
|
|
<input class="wp100 pt30 pb30 pl20 pr20 bg-f6 border-none font-32 ulib-r10" type="number" oninput="if(value.length>4)value=value.slice(0,4)" v-model="vCode" placeholder="请输入验证码" />
|
|
<div class="absolute right-0 box-middle mr30 bg-f6 font-32 color-1a1a1a" @click="getcode()">{{codeTx}}</div>
|
|
</div>
|
|
<!--
|
|
<div class="mt30 fn-clear font-28">
|
|
<div class="fn-fl">
|
|
<label>
|
|
<input type="checkbox" class="checkbox-input" v-model="rememberMe" />
|
|
<span>记住账号</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
-->
|
|
<button class="mt40 wp100 bg-1a1a1a border-none pt30 pb30 font-32 color-fff ulib-r10" @click="submit()">登录</button>
|
|
</div>
|
|
</div>
|
|
<div class="absolute bottom-0 left-0 right-0 pl40 pr40 pb80 text-center color-fff">
|
|
<!-- <div class="font-22">联系我们</div>-->
|
|
<div class="mt10 font-28">Powered by haodian.cn</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
telPhone:'',
|
|
vCode:'',
|
|
codeState:true,
|
|
codeTx:'获取验证码',
|
|
isSubmiting: false,
|
|
rememberMe: true,
|
|
},
|
|
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() {
|
|
if (!this.codeState) return;
|
|
if (!/^1[3456789]\d{9}$/.test(this.telPhone)) {
|
|
//alert('请输入正确手机号')
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: "请输入正确手机号"
|
|
});
|
|
} else {
|
|
//按钮倒计时
|
|
var that = this;
|
|
$.post('/h5/market/sylive/login/get_code',{'mobile':this.telPhone},function (response){
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: response.msg
|
|
});
|
|
if(response.code==200){
|
|
that.countDownTime(91)
|
|
}
|
|
},'json')
|
|
}
|
|
},
|
|
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
|
|
$.post('/h5/market/sylive/login',{'mobile':this.telPhone,'code':this.vCode,'remember':this.rememberMe},function (response){
|
|
if(response.code==200){
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: response.msg,
|
|
onClose:function(){
|
|
window.location = "/h5/market/sylive/login/userinfo"
|
|
}
|
|
});
|
|
}else{
|
|
mDialog.msg({
|
|
duration: 250,
|
|
pause: 2000,
|
|
content: response.msg
|
|
});
|
|
}
|
|
},'json')
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
})
|
|
|
|
</script>
|
|
<?=$this->load->view('h5/market/sylive/hidden_wx_share')?>
|
|
</body>
|
|
</html>
|
|
|