jucai/public/themes/default/views/mobile/app/auth/login_mobile.blade.php

@extends('mobile.module.layouts.content')

@push('meta')

@endpush

@push('css')
    <link href="{{ theme_asset('mobile/css/members.css') }}" rel="stylesheet">
@endpush

@push('js')
    <script type="text/javascript" src="{{ theme_asset('gt/gt.js') }}"></script>
    <script type="text/javascript" src="{{ theme_asset('gt/gt.handle.js') }}"></script>
    <script src="https://captcha.253.com/TCaptcha.js"></script>
@endpush

@section('content')
    <div class="qs-top-nav x2 list_height">
        <div class="n-cell" onclick="javascript:location.href='{{route($sub_site.'mobile.login')}}'">账号密码登录<div class="b-line"></div></div>
        <div class="n-cell active">手机动态码登录<div class="b-line"></div></div>
        <div class="clear"></div>
    </div>
    <div class="split-block"></div>
    <form method="post" id="form_mobile" action="{{route($sub_site.'mobile.login.mobile')}}" >
        {{csrf_field()}}
        <div class="loging-input-group">
            <div class="group-list mobile">
                <input id="mobile" name="mobile" type="text" class="l-input font14" placeholder="请输入手机号码" autocomplete="off">
                <a href="javascript:;" id="getVerfyCode" class="qs-btn qs-btn-inline qs-btn-medium qs-btn-border-gray font14 btn-getcode">获取验证码</a>
            </div>
            <div class="group-list verfy">
                <input id="code" name="code" type="text" class="l-input font14" placeholder="请输入验证码" autocomplete="off">
            </div>
        </div>
        <div class="l-tool-bar list_height">
            <div class="auto-loging">
                <div class="for-checkbox active" id="for-checkbox">下次自动登录</div>
            </div>
            <div class="for-pwd link_gray6"><a href="{{route($sub_site.'mobile.password.request')}}">忘记密码</a></div>
            <div class="clear"></div>
        </div>
        <div id="pop" style="display:none"></div>
        <input type="hidden" name="autoLogin" id="autoLogin" value="1" >
    </form>
    <div class="btn-spacing login-mobile"><a id="loginBtn" href="javascript:;" class="qs-btn qs-btn-blue font18">验证并登录</a></div>
    <div class="qs-center login-btn-group">
        <div class="login-btn-group-box">
            <a href="{{route($sub_site.'mobile.register.index')}}" class="qs-btn  qs-btn-medium qs-btn-border-orange font14" style="width: 2.45rem;">立即注册</a>
            <a href="{{route($sub_site.'mobile.login.company')}}" class="qs-btn  qs-btn-medium qs-btn-border-blue font14" style="width: 2.45rem;margin-left: .5rem">企业用户登录</a>
            <div class="clear"></div>
        </div>
    </div>
    <div class="qs-center coop-title">使用合作账号登录/注册</div>
    <div class="coop-group  qs-center" >
        <div class="coop-cell" id="other-thirdlogin">

        </div>
        <div class="clear"></div>
    </div>
@endsection


@section('script')

    @include('mobile.module.widgets.thirdlogin')
    <script>
        $(function () {
            var is_need_geetest=0;//全局,是否使用极验.
            var login_type=1;//登录模式,1用户账号登录,2用户手机登录,3企业登录.
            var gt_call_back=function(captchaObj) {
                captchaObj.onReady(function () {
                    //极验加载完成
                });
                captchaObj.onSuccess(function () {
                    ajax_login(login_type,captchaObj);

                });
                captchaObj.onError(function () {
                    show_error(login_type,"请先进行验证");
                });
                captchaObj.onClose(function () {
                    show_error(login_type,"请先进行验证");
                });
                $('.login-account').on('click', function () {
                    // var usernameValue = $.trim($('input[name=account]').val());
                    // var passwordValue = $.trim($('input[name=password]').val());
                    // if (usernameValue == '') {
                    //     qsToast({type:2,context: '请输入账户名/手机号/邮箱'});
                    //     return false;
                    // }
                    // if (passwordValue == '') {
                    //     qsToast({type:2,context: '请输入密码'});
                    //     return false;
                    // }
                    login_type=1;
                    //clean_message();
                    if (is_need_geetest==1){
                        captchaObj.bindForm("#form_account");
                        captchaObj.verify();
                    }
                    else{
                        ajax_login(login_type,captchaObj);
                    }

                });

                $('.login-mobile').on('click', function () {
                    var usernameValue = $.trim($('input[name=mobile]').val());
                    var passwordValue = $.trim($('input[name=code]').val());
                    if (usernameValue == '') {
                        qsToast({type:2,context: '请输入手机号'});
                        return false;
                    }
                    if (passwordValue == '') {
                        qsToast({type:2,context: '请输入验证码'});
                        return false;
                    }
                    login_type=2;
                    //clean_message();
                    if (is_need_geetest==1){
                        captchaObj.bindForm("#form_mobile");
                        captchaObj.verify();
                    }
                    else{
                        ajax_login(login_type,captchaObj);
                    }
                });

                $('.login-company').on('click', function () {
                    login_type=3;
                    //clean_message();
                    if (is_need_geetest==1){
                        captchaObj.bindForm("#form_company");
                        captchaObj.verify();
                    }
                    else{
                        ajax_login(login_type,captchaObj);
                    }
                });
            };

            //gt_init(gt_call_back);//初始化极验

            var mobile_captcha_flag = false;
            var mobile_captcha_callback = function(res){
                if(res.hasOwnProperty('errorMessage')){
                    alert(res.errorMessage)
                }
                if(res.ret == 0){
                    mobile_captcha_flag = true;
                    console.log('行为验证通过');
                    $("#ticket1").val(res.ticket);
                    $("#bizState1").val(res.bizState);
                    $("#randstr1").val(res.randstr);
                    submit_data={
                        "mobile":$("input[name='mobile']").val(),
                        "type":"login",
                        "ticket": res.ticket,
                        "bizState": res.bizState,
                        "randstr": res.randstr
                    };
                    $.ajax({
                        type: 'post',
                        url: '{{route('sms.send')}}',
                        data: submit_data,
                        beforeSend:function () {
                            // console.log('请求开始');
                            // $(".errinfo").text("");
                            // $(".errinfo").removeClass("errinfo");

                        },
                        complete:function() {
                            console.log('请求结束');
                        },
                        success: function (data) {
                            // console.log(data);
                            qsToast({type:2,context: '验证码已发送，请注意查收'});
                            settime();
                        },
                        error: function (errorData) {
                            // console.log(errorData);
                            if (countdown == 60) {
                                $('#getVerfyCode').removeClass('qs-btn-border-disabled');
                                $('#getVerfyCode').text('获取验证码');
                            }
                            var response=$.parseJSON(errorData.response);
                            if (errorData.status==422) {//验证错误
                                $.each(response.errors,function (key,val) {
                                    qsToast({type:2,context: val[0]});
                                    return false;
                                });
                            }
                            else if(errorData.status==400) {//业务错误
                                qsToast({type:2,context: response.message});
                                //is_need_geetest=response.errors.is_need_geetest;
                            }
                        }
                    });
                }else{
                    console.log('用户主动关闭验证码')
                }
                console.log('callback:', res);
            }

            var mobile_captcha = new TencentCaptcha('196587903', mobile_captcha_callback, {});
            $('.btn-getcode').on('click', function () {
                var mobile = $.trim($('input[name=mobile]').val());
                if (mobile == '') {
                    qsToast({type:2,context: '请输入手机号码'});
                    return false;
                }
                if ($('#getVerfyCode').hasClass('qs-btn-border-disabled')) {
                    return false;
                }
                mobile_captcha.show();

            });

            $('.login-mobile').on('click', function () {
                login_type=2;

                if (mobile_captcha_flag){
                    ajax_login(2);
                }
                else{
                    alert('验证码组件异常')
                }
            });

            $(".input-login").keydown(function(ev){
                ev = ev || window.event;
                var code = (ev.keyCode || ev.which);
                if (code == 10 || code == 13) {
                    $(this).closest("form").find(".btn-group").click();
                }
            });

            // 自动登录
            $('#for-checkbox').on('click', function() {
                $(this).toggleClass('active');
                if ($(this).hasClass('active')) {
                    $('#autoLogin').val('1');
                } else {
                    $('#autoLogin').val('0');
                }
            })
            {{--$('.btn-getcode').on('click', function () {--}}
            {{--    var mobile = $.trim($('input[name=mobile]').val());--}}
            {{--    if (mobile == '') {--}}
            {{--        qsToast({type:2,context: '请输入手机号码'});--}}
            {{--        return false;--}}
            {{--    }--}}
            {{--    if ($('#getVerfyCode').hasClass('qs-btn-border-disabled')) {--}}
            {{--        return false;--}}
            {{--    }--}}
            {{--    $('#getVerfyCode').addClass('qs-btn-border-disabled');--}}
            {{--    $('#getVerfyCode').text('发送中...');--}}
            {{--    submit_data={--}}
            {{--        "mobile":mobile,--}}
            {{--        "type":"login"--}}
            {{--    };--}}
            {{--    $.ajax({--}}
            {{--        type: 'post',--}}
            {{--        url: '{{route('sms.send')}}',--}}
            {{--        data: submit_data,--}}
            {{--        beforeSend:function () {--}}
            {{--           // console.log('请求开始');--}}


            {{--        },--}}
            {{--        complete:function() {--}}
            {{--            //console.log('请求结束');--}}
            {{--        },--}}
            {{--        success: function (data) {--}}
            {{--           // console.log(data);--}}
            {{--            qsToast({type:2,context: '验证码已发送，请注意查收'});--}}
            {{--            settime();--}}
            {{--        },--}}
            {{--        error: function (errorData) {--}}
            {{--           // console.log(errorData);--}}
            {{--            if (countdown == 60) {--}}
            {{--                $('#getVerfyCode').removeClass('qs-btn-border-disabled');--}}
            {{--                $('#getVerfyCode').text('获取验证码');--}}
            {{--            }--}}
            {{--            var response=$.parseJSON(errorData.response);--}}
            {{--            if (errorData.status==422) {//验证错误--}}
            {{--                $.each(response.errors,function (key,val) {--}}
            {{--                    qsToast({type:2,context: val[0]});--}}
            {{--                    return false;--}}
            {{--                });--}}
            {{--            }--}}
            {{--            else if(errorData.status==400) {//业务错误--}}
            {{--                qsToast({type:2,context: response.message});--}}
            {{--                is_need_geetest=response.errors.is_need_geetest;--}}
            {{--            }--}}
            {{--        }--}}
            {{--    });--}}
            {{--});--}}


            function ajax_login(type, captchaObj) {
                if (type==1) {
                    $.ajax({
                        type: 'post',
                        url: $("#form_account").attr('action'),
                        data: $("#form_account").serialize(),
                        beforeSend:function () {
                            //console.log('请求开始');
                            clean_message();
                            $('.login-account').addClass("btn-disabled").prop('disabled', true);
                            $('.login-account').val("登录中...");

                        },
                        complete:function() {
                            //console.log('请求结束');
                            $('.login-account').val("登录");
                            $('.login-account').removeClass("btn-disabled").prop('disabled', false);

                        },
                        success: function (data) {
                            //console.log(data);
                            qsToast({type:2,context: "登录成功, 正在跳转..."});
                            location.href=data.data.redirect_url+'?token='+data.data.token;;
                        },
                        error: function (errorData) {
                            //console.log(errorData);
                            var response=$.parseJSON(errorData.response);
                            if (is_need_geetest==1){
                                captchaObj.reset();
                            }
                            if (errorData.status==422) {//验证错误
                                $.each(response.errors,function (key,val) {
                                    qsToast({type:2,context: val[0]});
                                    return false;
                                });
                            }
                            else if(errorData.status==400) {//业务错误
                                qsToast({type:2,context: response.message});
                                is_need_geetest=response.errors.is_need_geetest;
                            }
                        }
                    });
                }
                else if (type==2) {
                    $.ajax({
                        type: 'post',
                        url: $("#form_mobile").attr('action'),
                        data: $("#form_mobile").serialize(),
                        beforeSend:function () {
                            //console.log('请求开始');
                        },
                        complete:function() {
                            //console.log('请求结束');
                        },
                        success: function (data) {
                            //console.log(data);
                            qsToast({type:2,context: "登录成功, 正在跳转..."});
                            location.href=data.data.redirect_url+'?token='+data.data.token;;
                        },
                        error: function (errorData) {
                            var response=$.parseJSON(errorData.response);
                            // if (is_need_geetest==1){
                            //     captchaObj.reset();
                            // }
                            if (errorData.status==422) {//验证错误
                                $.each(response.errors,function (key,val) {
                                    qsToast({type:2,context: val[0]});
                                    return false;
                                });
                            }
                            else if(errorData.status==400) {//业务错误
                                qsToast({type:2,context: response.message});
                                //is_need_geetest=response.errors.is_need_geetest;
                            }
                        }
                    });
                }
                else if (type==3){
                    $.ajax({
                        method: 'post',
                        url: $("#form_company").attr('action'),
                        data: $("#form_company").serialize(),
                        beforeSend:function () {
                            //console.log('请求开始');
                            clean_message();
                            $('.login-company').addClass("btn-disabled").prop('disabled', true);
                            $('.login-company').val("登录中...");

                        },
                        complete:function() {
                            //console.log('请求结束');
                            $('.login-company').val("登录");
                            $('.login-company').removeClass("btn-disabled").prop('disabled', false);

                        },
                        success: function (data) {
                            //console.log(data);
                            $("#message_company").addClass("successinfo");
                            $("#message_company").text("登录成功, 正在跳转...");
                            location.href=data.data.redirect_url+'?token='+data.data.token;;
                        },
                        error: function (errorData) {
                            //console.log(errorData);
                            if (is_need_geetest==1){
                                captchaObj.reset();
                            }
                            if (errorData.status==422) {//验证错误
                                $.each(errorData.responseJSON.errors,function (key,val) {
                                    $("#"+key).addClass("errinfo");
                                    $("#"+key).text(val[0]);
                                });
                            }
                            else if(errorData.status==400) {//业务错误
                                $("#message_company").addClass("errinfo");
                                $("#message_company").text(errorData.responseJSON.message);
                                is_need_geetest=errorData.responseJSON.errors.is_need_geetest;
                            }
                        }
                    });
                }
            };


        });
        // 倒计时
        var countdown = 60;
        function settime() {
            if (countdown == 0) {
                $('#getVerfyCode').removeClass('qs-btn-border-disabled');
                $('#getVerfyCode').text('获取验证码');
                countdown = 60;
                return;
            } else {
                $('#getVerfyCode').addClass('qs-btn-border-disabled');
                $('#getVerfyCode').text('重新发送' + countdown + '秒');
                countdown--;
            }
            setTimeout(function() {
                settime()
            },1000)
        }

        $('.gohome').on('click', function () {
            location.href="{{route($sub_site.'home')}}";
        });

    </script>
@endsection