221 lines
9.2 KiB
PHP
221 lines
9.2 KiB
PHP
@extends('web.layouts.base')
|
|
@section('content')
|
|
<!-- 分区 -->
|
|
<div class="sectionwrap">
|
|
<div class="section" id="login">
|
|
<div class="colormask">
|
|
<div class="loginwrap">
|
|
<div class="viewbox">
|
|
<div class="username">
|
|
<span class="text_hint" id="username_hint">用户名</span>
|
|
<input type="text" class="inputbox" name="username" value="" onpropertychange="checkUser(this)" oninput="checkUser(this)">
|
|
<span class="icon_circle">
|
|
<i class="fa fa-user"></i>
|
|
</span>
|
|
</div>
|
|
<div class="password">
|
|
<span class="text_hint" id="password_hint">密码</span>
|
|
<input type="password" class="inputbox" name="password" value="">
|
|
<span class="icon_circle">
|
|
<i class="fa fa-lock"></i>
|
|
</span>
|
|
</div>
|
|
<span class="next_btn transition" data="0">
|
|
<i class="fa fa-chevron-right" change="fa fa-chevron-right"></i>
|
|
</span>
|
|
</div>
|
|
<div class="welcome" style="display:none">
|
|
<p><i class="fa fa-coffee fa-2x"></i> 欢迎回来, 请稍后...</p>
|
|
</div>
|
|
<div class="login-prompt">错误提示!</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
@section('foot_js')
|
|
<script type="text/javascript">
|
|
var partner = "/partner/index.html";
|
|
var client = "/client/index.html";
|
|
var loginurl='{{ route('web.regist.post') }}';
|
|
|
|
function checkUser() {
|
|
checkStatus = true;
|
|
}
|
|
|
|
var checkStatus = false;
|
|
|
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
|
|
$('.gwc-celan').hide();
|
|
/*设置首页Warp高度*/
|
|
$("div.wraper, div.sectionwrap, div.section, div.colormask").height('100%');
|
|
|
|
|
|
|
|
/*用户名输入框获取焦点效果*/
|
|
$("input[name=username]").focus(function() {
|
|
$(this).css({ 'margin-top': '9px' });
|
|
$("#username_hint").animate({
|
|
top: "12px",
|
|
fontSize: "14px"
|
|
}, 200);
|
|
});
|
|
$("input[name=username]").blur(function() {
|
|
var userName = $(this).val();
|
|
if (userName == "") {
|
|
$(this).css({ 'margin-top': '0' });
|
|
$("#username_hint").animate({
|
|
top: "24px",
|
|
fontSize: "16px"
|
|
}, 200);
|
|
}
|
|
});
|
|
|
|
|
|
/*密码输入框获取焦点效果*/
|
|
$("input[name=password]").focus(function() {
|
|
$(this).css({ 'margin-top': '9px' });
|
|
$("#password_hint").animate({
|
|
top: "12px",
|
|
fontSize: "14px"
|
|
}, 200);
|
|
});
|
|
$("input[name=password]").blur(function() {
|
|
var userName = $(this).val();
|
|
if (userName == "") {
|
|
$(this).css({ 'margin-top': '0' });
|
|
$("#password_hint").animate({
|
|
top: "24px",
|
|
fontSize: "16px"
|
|
}, 200);
|
|
}
|
|
});
|
|
$('input[type=password],input[name=username]').keydown(function(e) {
|
|
if (e.keyCode == 13) {
|
|
$("span.next_btn").click();
|
|
}
|
|
});
|
|
|
|
|
|
|
|
function focusinput(name) {
|
|
$("div.viewbox").animate({ left: "-20px" }, 150, function() {
|
|
$(this).animate({ left: "20px" }, 150, function() {
|
|
$(this).animate({ left: "-10px" }, 100, function() {
|
|
$(this).animate({ left: "10px" }, 100, function() {
|
|
$(this).animate({ left: "0px" }, 100, function() {
|
|
$("input[name=" + name + "]").focus();
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
|
|
if ($("input[name=username]").val() != '') {
|
|
$("input[name=username]").focus();
|
|
$("input[name=username]").css({ 'margin-top': '9px' });
|
|
$("#username_hint").animate({
|
|
top: "12px",
|
|
fontSize: "14px"
|
|
}, 200);
|
|
};
|
|
|
|
/*点击下一步为空效果*/
|
|
$("span.next_btn").click(function() {
|
|
var _this = $(this);
|
|
var _class = _this.find('i.fa').attr('class');
|
|
var _change = _this.find('i.fa').attr('change');
|
|
var data = _this.attr("data") * 1;
|
|
var userName = $("input[name=username]").val();
|
|
var passWord = $("input[name=password]").val();
|
|
if (data == 0) {
|
|
if (userName == '') {
|
|
focusinput('username');
|
|
} else {
|
|
_this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
_this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
$("span.next_btn").attr("data", 1);
|
|
$("div.username").animate({ left: "400px" });
|
|
$("div.password").animate({ left: "0px" }, function() {
|
|
$("input[name=password]").focus();
|
|
|
|
if ($("input[name=password]").val() != '') {
|
|
$("input[name=password]").focus();
|
|
$("input[name=password]").css({ 'margin-top': '9px' });
|
|
$("#password_hint").animate({
|
|
top: "12px",
|
|
fontSize: "14px"
|
|
}, 200);
|
|
};
|
|
|
|
});
|
|
|
|
}
|
|
}
|
|
if (data == 1) {
|
|
if (passWord == '') {
|
|
focusinput('password');
|
|
} else {
|
|
_this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
//_this.animate({ right: "-100px" }, 100);
|
|
_this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
$("div.password").animate({ left: "400px" }, function() {
|
|
|
|
});
|
|
$.post(loginurl, {
|
|
password: passWord,
|
|
nickname:userName,
|
|
_token:"{{ csrf_token() }}"
|
|
}, function (data) {
|
|
var _class = _this.find('i.fa').attr('class');
|
|
var _change = _this.find('i.fa').attr('change');
|
|
if (data.error==0) {
|
|
_this.animate({right: "-100px"},100);
|
|
_this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
$("div.password").animate({left: "400px"}, function(){
|
|
$("div.viewbox").animate({
|
|
width: "360px",
|
|
height: "90px",
|
|
opacity: "0",
|
|
left: '-20px'
|
|
}, function(){
|
|
if(data.error==0)
|
|
{
|
|
$("div.welcome").fadeIn();
|
|
$("input[name=username]").val('');
|
|
$("input[name=password]").val('');
|
|
setTimeout(function(){
|
|
window.location.href = "{{ route('web.user.index') }}";
|
|
}, 2000);
|
|
}
|
|
|
|
|
|
});
|
|
});
|
|
} else {
|
|
// _this.find('i.fa').attr('class', _change).attr('change', _class);
|
|
$("input[name=password]").val('');
|
|
$('.login-prompt').text(data.msg).stop(false).fadeIn().delay(2000).fadeOut();
|
|
$("div.password").animate({ left: "-400px" }, function() {
|
|
|
|
});
|
|
|
|
//focusinput('password');
|
|
focusinput('username');
|
|
};
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
|
|
});
|
|
</script>
|
|
@endsection |