Skip to content

施宇 / icsales

Go to a project
Commit e3e21668 by 梁建民
Options

js

parent 570dca8b
Expand all
Inline Side-by-side
Showing with 597 additions and 51 deletions
Application/Home/View/Forget/index.html
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<body> <body>
<div class="person-bar lineBlock va-m"> <div class="person-bar lineBlock va-m">
<div class="person"> <div class="person">
<div class="wrap"> <div class="wrap layui-form">
<ul class="status"> <ul class="status">
<li class="lineBlock curr"> <li class="lineBlock curr">
<em class="va-m lineBlock"></em> <em class="va-m lineBlock"></em>
...@@ -24,14 +24,14 @@ ...@@ -24,14 +24,14 @@
<span class="va-m">设置成功</span> <span class="va-m">设置成功</span>
</li> </li>
</ul> </ul>
<div class="register layui-form" style="display: none"> <div class="register" id="verify" style="display: block">
<p class="tit"> <p class="tit">
<em class="va-m lineBlock"></em> <em class="va-m lineBlock"></em>
<span class="va-m">忘记密码</span> <span class="va-m">忘记密码</span>
</p> </p>
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconjuxing23 va-m"></i> <i class="iconfont iconjuxing23 va-m"></i>
<input type="text" class="w w1 va-m" placeholder="请输入手机号"> <input type="text" class="w w1 va-m" placeholder="请输入手机号" name="mobile">
<div class="sel lineBlock va-m"> <div class="sel lineBlock va-m">
<select name="interest"> <select name="interest">
<option value="0">中国 +86</option> <option value="0">中国 +86</option>
...@@ -39,34 +39,43 @@ ...@@ -39,34 +39,43 @@
</select> </select>
</div> </div>
</div> </div>
<!--验证码-->
<div class="input-wrap" id="verifiCode" style="display: none">
<i class="iconfont iconjuxing26 va-m"></i>
<input type="text" class="w w1 va-m" name="captcha" placeholder="请输入图形验证码"/>
<input type="hidden" class="w w1 va-m" name="captchaUuid" value=""/>
<img src="" alt="" width="100" height="30" class="lineBlock va-m codepic"/>
</div>
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconjuxing26 va-m"></i> <i class="iconfont iconjuxing26 va-m"></i>
<input type="text" class="w w1 va-m" placeholder="请输入手机号"> <input type="text" class="w w1 va-m" placeholder="请输入手机验证码" name="code">
<span class="lineBlock text va-m">发送验证码</span> <input type="button" name="codetext" class="lineBlock text va-m" value="发送验证码"/>
</div> </div>
<div class="btn-wrap"> <div class="btn-wrap">
<a href="javascript:;" class="btn">下一步</a> <a href="javascript:;" class="btn" id="resetPassword">下一步</a>
</div> </div>
</div> </div>
<div class="register layui-form" style="display: block"> <div class="register" id="rebuild" style="display: none">
<p class="tit"> <p class="tit">
<em class="va-m lineBlock"></em> <em class="va-m lineBlock"></em>
<span class="va-m">忘记密码</span> <span class="va-m">忘记密码</span>
</p> </p>
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconpassword va-m"></i> <i class="iconfont iconpassword va-m"></i>
<input type="password" class="w w1 va-m" placeholder="请输入密码"> <div class="pwd lineBlock">
<i class="iconfont iconjuxing27 va-m lineBlock"></i> <input type="password" class="w w1 va-m" placeholder="请输入密码" name="password">
</div>
<i class="iconfont iconiconxiantiaoshouji va-m lineBlock eyes"></i>
</div> </div>
<div class="btn-wrap"> <div class="btn-wrap">
<a href="javascript:;" class="btn">设置密码</a> <a href="javascript:;" class="btn" lay-submit lay-filter="resetPassword">设置密码</a>
</div> </div>
</div> </div>
<div class="success" style="display: none"> <div class="success" style="display: none">
<i class="ico"></i> <i class="ico"></i>
<p class="t1" style="margin-bottom: 10px;">恭喜您，密码设置成功</p> <p class="t1" style="margin-bottom: 10px;">恭喜您，密码设置成功</p>
<p class="t2" style="margin: 0 auto 60px;">为请保管好您的账户信息。</p> <p class="t2" style="margin: 0 auto 60px;">为请保管好您的账户信息。</p>
<a href="javascript:;" class="btn">返回首页</a> <a href="homeicsales/homes" class="btn">返回首页</a>
</div> </div>
</div> </div>
</div> </div>
...@@ -74,6 +83,16 @@ ...@@ -74,6 +83,16 @@
<b class="lineBlock emptys"></b> <b class="lineBlock emptys"></b>
<include file="public/foot"/> <include file="public/foot"/>
<script src="__PUBLIC__/js/person/forget.js"></script>
<script type="text/html" id="pwdHtml">
{{# if (d.flag== 1) { }}
<input type="text" class="w w1 va-m" placeholder="请输入密码" name="password" value="{{d.value}}">
{{# } else { }}
<input type="password" class="w w1 va-m" placeholder="请输入密码" name="password" value="{{d.value}}">
{{# } }}
</script>
</body> </body>
</html> </html>
\ No newline at end of file
Application/Home/View/Login/index.html
...@@ -48,35 +48,44 @@ ...@@ -48,35 +48,44 @@
</div> </div>
</div> </div>
<!--验证码登录--> <!--验证码登录-->
<div class="verify-code layui-form" style="display: none"> <form class="verify-code layui-form" style="display: none" onsubmit="return false">
<input type="hidden" name="code_type" value="2">
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconjuxing23 va-m"></i> <i class="iconfont iconjuxing23 va-m"></i>
<input type="text" class="w w1 va-m" placeholder="请输入手机号"> <input type="text" class="w w1 va-m" placeholder="请输入手机号" name="mobile">
<div class="sel lineBlock va-m"> <div class="sel lineBlock va-m">
<select name="interest"> <select>
<option value="0">中国 +86</option> <option value="0">中国 +86</option>
<option value="1">香港 +86</option> <option value="1">香港 +86</option>
</select> </select>
</div> </div>
</div> </div>
<!--验证码-->
<div class="input-wrap" id="verifiCode" style="display: none">
<i class="iconfont iconjuxing26 va-m"></i>
<input type="text" class="w w1 va-m" name="captcha" placeholder="请输入图形验证码"/>
<input type="hidden" class="w w1 va-m" name="captchaUuid" value=""/>
<img src="" alt="" width="100" height="30" class="lineBlock va-m codepic"/>
</div>
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconjuxing26 va-m"></i> <i class="iconfont iconjuxing26 va-m"></i>
<input type="text" class="w w1 va-m" placeholder="请输入手机号"> <input type="text" class="w w1 va-m" placeholder="请输入手机验证码" name="code">
<span class="lineBlock text va-m">发送验证码</span> <input type="button" name="codetext" class="lineBlock text va-m" value="发送验证码"/>
</div> </div>
<div class="btn-wrap"> <div class="btn-wrap">
<a href="javascript:;" class="btn">登录</a> <a href="javascript:;" class="btn" lay-submit lay-filter="verifyCode">登录</a>
</div> </div>
<div class="operate clr"> <div class="operate clr">
<a href="javascript:;" class="fl l">密码登录</a> <a href="passporticsales/login?flag=password" class="fl l">密码登录</a>
<p class="fr r"> <p class="fr r">
<span>还没账户？</span> <span>还没账户？</span>
<a href="passporticsales/register">免费注册</a> <a href="passporticsales/register">免费注册</a>
</p> </p>
</div> </div>
</div> </form>
<!--密码登录--> <!--密码登录-->
<div class="login layui-form"> <form class="login layui-form" onsubmit="return false">
<div class="input-wrap"> <div class="input-wrap">
<i class="iconfont iconjuxing23 va-m"></i> <i class="iconfont iconjuxing23 va-m"></i>
<input type="text" class="w w1 va-m" placeholder="请输入手机号" name="mobile"> <input type="text" class="w w1 va-m" placeholder="请输入手机号" name="mobile">
...@@ -99,19 +108,19 @@ ...@@ -99,19 +108,19 @@
<span class="va-m">验证码错误，请重新输入</span> <span class="va-m">验证码错误，请重新输入</span>
</div> </div>
<div class="pwd"> <div class="pwd">
<a href="javascript:;" class="fr">忘记密码？</a> <a href="passporticsales/forget" class="fr">忘记密码？</a>
</div> </div>
<div class="btn-wrap"> <div class="btn-wrap">
<a href="javascript:;" class="btn" lay-submit lay-filter="login">登录</a> <a href="javascript:;" class="btn" lay-submit lay-filter="login">登录</a>
</div> </div>
<div class="operate clr"> <div class="operate clr">
<a href="javascript:;" class="fl l">验证码登录</a> <a href="passporticsales/login?flag=verify" class="fl l">验证码登录</a>
<p class="fr r"> <p class="fr r">
<span>还没账户？</span> <span>还没账户？</span>
<a href="passporticsales/register">免费注册</a> <a href="passporticsales/register">免费注册</a>
</p> </p>
</div> </div>
</div> </form>
</div> </div>
</div> </div>
</div> </div>
......
dist/css/person.css
...@@ -202,6 +202,7 @@ body { ...@@ -202,6 +202,7 @@ body {
font-size: 16px; font-size: 16px;
color: #0d84d1; color: #0d84d1;
text-align: center; text-align: center;
background: none;
} }
.person .wrap .verify-code .btn-wrap { .person .wrap .verify-code .btn-wrap {
margin-top: 30px; margin-top: 30px;
......
dist/css/person.less
...@@ -240,6 +240,7 @@ body { ...@@ -240,6 +240,7 @@ body {
font-size: 16px; font-size: 16px;
color: #0d84d1; color: #0d84d1;
text-align: center; text-align: center;
background: none;
} }
} }
......
dist/js/global/api.js
...@@ -26,6 +26,14 @@ ...@@ -26,6 +26,14 @@
*/ */
authlogin: auth_url + '/auth/login', authlogin: auth_url + '/auth/login',
/** /**
* 重置密码
*/
resetPassword: auth_url + '/auth/resetPassword',
/**
* 手机验证码快捷登录
*/
authMobilelogin: auth_url + '/auth/mobile/login',
/**
* 获取图形验证码接口 * 获取图形验证码接口
*/ */
captchaInfo: auth_url + '/captchaInfo', captchaInfo: auth_url + '/captchaInfo',
......
dist/js/person/forget.js 0 → 100644
!function () {
window.ForgetController = {
isClick: false,
init: function () {
this.created(this).mounted(this).handleBind(this);
},
created: function (opt) {
return this;
},
mounted: function (opt) {
return this;
},
getCode: function (opt, type, params) {
var $verifiCode = $("#verifiCode"),
$code = $('input[name="code"]'),
$codetext = $('input[name="codetext"]'),
$codepic = $('.codepic');
if (type == 'captchaInfo') {
//获取验证码
IcController.getData(apis.captchaInfo, 'GET', null, function (res) {
if (res.captchaUrl) {
$verifiCode.find('img').attr('src', res.captchaUrl);
$verifiCode.find('input[name="captchaUuid"]').val(res.captchaUuid);
$verifiCode.show();
$verifiCode.find('input[name="captcha"]').focus();
}
});
} else if (type == 'mobile') {
//获取短信验证码
IcController.getData(apis.getRegistCode, 'POST', params, function (res) {
if (res.err_code == 0) {
$verifiCode.hide();
$code.focus();
//开始倒计时
var second = 60, timer = null;
timer = setInterval(function () {
second -= 1;
if (second > 0) {
$codetext.val(second + '秒');
$codetext.attr('disabled', "true");
} else {
clearInterval(timer);
$codetext.removeAttr('disabled');
$codetext.val('重新获取');
$codepic.trigger('click');
}
}, 1000);
} else {
layer.msg(res.err_msg);
}
});
}
},
calcForm: function (opt, type) {
var $mobile = $('input[name="mobile"]'),
$password = $('input[name="password"]'),
$code = $('input[name="code"]');
if (!$mobile.val() && type === 1) {
$mobile.parent('.input-wrap').addClass('error');
return false;
}
if (!$password.val() && type === 2) {
$password.parent().parent('.input-wrap').addClass('error');
return false;
}
//密码长度要大于6位，由数字和字母组成
var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
if (!reg.test($password.val()) && type === 2) {
$password.parent().parent('.input-wrap').addClass('error');
$(".error-text").show().find("span").text('密码长度要大于6位，由数字和字母组成');
return false;
}
if (!$code.val() && type === 1) {
$code.parent('.input-wrap').addClass('error');
return false;
}
$('.error').removeClass('error');
return true;
},
handleBind: function (opt) {
//发送验证码
$(document).on('click', 'input[name="codetext"]', function () {
var $verifiCode = $("#verifiCode"),
captchaUuid = $verifiCode.find('input[name="captchaUuid"]').val(),
captcha = $verifiCode.find('input[name="captcha"]').val(),
mobile = $('input[name="mobile"]').val();
//判断是否有图形验证码id
if (!captchaUuid) {
opt.getCode(opt, 'captchaInfo');
} else {
//获取短信验证码
var params = {
captchaUuid: captchaUuid,
captcha: captcha,
mobile: mobile,
code_type: 3
}
opt.getCode(opt, 'mobile', params);
}
});
//更新验证码
$(document).on('click', '.codepic', function () {
opt.getCode(opt, 'captchaInfo');
});
//手机号
$('input[name="mobile"]').on('input propertychange', function () {
var val = $(this).val();
if (val) {
$(this).parent('.input-wrap').removeClass('error');
}
});
//密码
$('input[name="password"]').on('input propertychange', function () {
var val = $(this).val();
if (val) {
$(this).parent().parent('.input-wrap').removeClass('error');
//符合密码长度要大于6位，由数字和字母组成
var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
if (reg.test(val)) {
$(".error-text").hide();
}
}
});
//手机验证码
$('input[name="code"]').on('input propertychange', function () {
var val = $(this).val();
if (val) {
$(this).parent('.input-wrap').removeClass('error');
}
});
//查看密码
$(".eyes").on('click', function () {
//兼容ie
var flag;
var self = this;
if ($(this).hasClass('iconiconxiantiaoshouji')) {
$(this).removeClass('iconiconxiantiaoshouji').addClass('iconjuxing27');
} else {
$(this).removeClass('iconjuxing27').addClass('iconiconxiantiaoshouji');
}
flag = $(this).hasClass('iconjuxing27') ? '1' : '2';
var data = {
value: $("input[name='password']").val(),
flag: flag
};
var getTpl = pwdHtml.innerHTML;
layui.laytpl(getTpl).render(data, function (html) {
$(".pwd").empty().html(html);
});
});
//验证手机号验证
$(document).on('click', '#resetPassword', function () {
if (opt.calcForm(opt, 1)) {
$(".status").find('li').eq(1).addClass('curr').siblings('li').removeClass('curr');
$("#verify").hide();
$("#rebuild").show();
}
});
//重设密码
layui.form.on('submit(resetPassword)', function (data) {
if (opt.calcForm(opt, 2)) {
$(data.elem).addClass("layui-btn-disabled");
if (!opt.isClick) {
opt.isClick = true;
var params = {
mobile: data.field.mobile,
code: data.field.code,
password: data.field.password
};
IcController.getData(apis.resetPassword, 'POST', params, function (res) {
if (res.err_msg == 0) {
$(".status").find('li').eq(2).addClass('curr').siblings('li').removeClass('curr');
$("#verify").hide();
$("#rebuild").hide();
$(".success").show();
} else if (res.err_code == 501) {
layer.msg(res.err_msg);
$(".status").find('li').eq(0).addClass('curr').siblings('li').removeClass('curr');
$("#verify").show();
$("#rebuild").hide();
opt.isClick = false;
$("#verifiCode").show();
$(data.elem).removeClass("layui-btn-disabled");
} else {
layer.msg(res.err_msg);
opt.isClick = false;
$(data.elem).removeClass("layui-btn-disabled");
}
});
}
}
});
return this;
},
}, $(function () {
ForgetController.init();
})
}();
\ No newline at end of file
dist/js/person/login.js
...@@ -6,6 +6,19 @@ ...@@ -6,6 +6,19 @@
}, },
created: function (opt) { created: function (opt) {
var params = Util.getRequest('flag');
switch (params) {
case 'verify':
$(".verify-code").show();
$(".login").hide();
}
return this; return this;
}, },
mounted: function (opt) { mounted: function (opt) {
...@@ -13,9 +26,84 @@ ...@@ -13,9 +26,84 @@
return this; return this;
}, },
calcForm: function (opt) { getCode: function (opt, type, params) {
var $mobile = $('input[name="mobile"]'),
$password = $('input[name="password"]'); var $verifiCode = $("#verifiCode"),
$code = $('input[name="code"]'),
$codetext = $('input[name="codetext"]'),
$codepic = $('.codepic');
if (type == 'captchaInfo') {
//获取验证码
IcController.getData(apis.captchaInfo, 'GET', null, function (res) {
if (res.captchaUrl) {
$verifiCode.find('img').attr('src', res.captchaUrl);
$verifiCode.find('input[name="captchaUuid"]').val(res.captchaUuid);
$verifiCode.show();
$verifiCode.find('input[name="captcha"]').focus();
}
});
} else if (type == 'mobile') {
//获取短信验证码
IcController.getData(apis.getRegistCode, 'POST', params, function (res) {
if (res.err_code == 0) {
$verifiCode.hide();
$code.focus();
//开始倒计时
var second = 60, timer = null;
timer = setInterval(function () {
second -= 1;
if (second > 0) {
$codetext.val(second + '秒');
$codetext.attr('disabled', "true");
} else {
clearInterval(timer);
$codetext.removeAttr('disabled');
$codetext.val('重新获取');
$codepic.trigger('click');
}
}, 1000);
} else {
layer.msg(res.err_msg);
}
});
}
},
calcForm: function (ele, type) {
var $mobile = $(ele).find('input[name="mobile"]'),
$password = $(ele).find('input[name="password"]'),
$code = $(ele).find('input[name="code"]');
if (!$mobile.val()) { if (!$mobile.val()) {
...@@ -25,7 +113,7 @@ ...@@ -25,7 +113,7 @@
} }
if (!$password.val()) { if (!$password.val() && type === 1) {
$password.parent().parent('.input-wrap').addClass('error'); $password.parent().parent('.input-wrap').addClass('error');
...@@ -36,7 +124,7 @@ ...@@ -36,7 +124,7 @@
//密码长度要大于6位，由数字和字母组成 //密码长度要大于6位，由数字和字母组成
var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/; var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
if (!reg.test($password.val())) { if (!reg.test($password.val()) && type === 1) {
$password.parent().parent('.input-wrap').addClass('error'); $password.parent().parent('.input-wrap').addClass('error');
...@@ -45,46 +133,94 @@ ...@@ -45,46 +133,94 @@
return false; return false;
} }
if (!$code.val() && type ===2) {
$code.parent('.input-wrap').addClass('error');
return false;
}
$('.error').removeClass('error'); $('.error').removeClass('error');
return true; return true;
}, },
handleBind: function (opt) { handleBind: function (opt) {
//发送验证码
$(document).on('click', 'input[name="codetext"]', function () {
var $verifiCode = $("#verifiCode"),
captchaUuid = $verifiCode.find('input[name="captchaUuid"]').val(),
captcha = $verifiCode.find('input[name="captcha"]').val(),
mobile = $('input[name="mobile"]').val();
//判断是否有图形验证码id
if (!captchaUuid) {
opt.getCode(opt, 'captchaInfo');
} else {
//获取短信验证码
var params = {
captchaUuid: captchaUuid,
captcha: captcha,
mobile: mobile,
code_type: 2
};
opt.getCode(opt, 'mobile', params);
}
});
//更新验证码
$(document).on('click', '.codepic', function () {
opt.getCode(opt, 'captchaInfo');
});
//手机号 //手机号
$('input[name="mobile"]').on('input propertychange', function () { $('input[name="mobile"]').on('input propertychange', function () {
var val = $(this).val(); var val = $(this).val();
if (val) { if (val) {
$(this).parent('.input-wrap').removeClass('error'); $(this).parent('.input-wrap').removeClass('error');
} }
}); });
//密码 //密码
$('input[name="password"]').on('input propertychange', function () { $('input[name="password"]').on('input propertychange', function () {
var val = $(this).val(); var val = $(this).val();
if (val) { if (val) {
$(this).parent().parent('.input-wrap').removeClass('error'); $(this).parent().parent('.input-wrap').removeClass('error');
//符合密码长度要大于6位，由数字和字母组成 //符合密码长度要大于6位，由数字和字母组成
var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/; var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/;
if (reg.test(val)) { if (reg.test(val)) {
$(".error-text").hide(); $(".error-text").hide();
} }
} }
}); });
//查看密码 //查看密码
...@@ -121,10 +257,10 @@ ...@@ -121,10 +257,10 @@
}); });
//注册提交 //密码提交
layui.form.on('submit(login)', function (data) { layui.form.on('submit(login)', function (data) {
if (opt.calcForm(data.form, 1)) {
if (opt.calcForm()) {
$(data.elem).addClass("layui-btn-disabled"); $(data.elem).addClass("layui-btn-disabled");
if (!opt.isClick) { if (!opt.isClick) {
...@@ -136,9 +272,47 @@ ...@@ -136,9 +272,47 @@
if (res.err_msg == 0) { if (res.err_msg == 0) {
//注入token //注入token
Util.setCookie('token', res.data.access_token,1,cookieHostname); Util.setCookie('token', res.data.access_token, 1, cookieHostname);
window.location.href = home_url + '/homes';
} else {
layer.msg(res.err_msg);
opt.isClick = false;
$(data.elem).removeClass("layui-btn-disabled");
}
});
}
} else {
}
});
//验证码提交
layui.form.on('submit(verifyCode)', function (data) {
if (opt.calcForm(data.form, 2)) {
$(data.elem).addClass("layui-btn-disabled");
if (!opt.isClick) {
opt.isClick = true;
IcController.getData(apis.authMobilelogin, 'POST', data.field, function (res) {
if (res.err_msg == 0) {
//注入token
Util.setCookie('token', res.data.access_token, 1, cookieHostname);
window.location.href = home_url + '/homes';
} else { } else {
layer.msg(res.err_msg); layer.msg(res.err_msg);
...@@ -155,7 +329,6 @@ ...@@ -155,7 +329,6 @@
} }
}); });
return this; return this;
}, },
}, $(function () { }, $(function () {
......
dist/js/person/register.js
...@@ -292,8 +292,6 @@ ...@@ -292,8 +292,6 @@
} }
}); });
} }
} else {
} }
}); });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment