zc100/template/pc/js/botstrap-step/scripts.js

jQuery(document).ready(function() {

    checkBrowserWidth();
    $(window).resize(checkBrowserWidth); // 当窗口大小改变时重新检查

    function checkBrowserWidth() {
        var browserWidth = $(window).width();
        if (browserWidth < 1001) {
            //alert('浏览器宽度小于600像素');
            $.backstretch("/template/pc/js/botstrap-step/bg2.png");
        }else{
            $.backstretch("/template/pc/js/botstrap-step/bg.jpg");
        }
    }

    /*
        Fullscreen background
    */
    //$.backstretch("/template/pc/js/botstrap-step/bg.jpg");

    $('#top-navbar-1').on('shown.bs.collapse', function(){
        $.backstretch("resize");
    });
    $('#top-navbar-1').on('hidden.bs.collapse', function(){
        $.backstretch("resize");
    });

    /*
        Form
    */
    $('.registration-form fieldset:first-child').fadeIn('slow');

    $('.registration-form input[type="text"], .registration-form input[type="password"], .registration-form textarea').on('focus', function() {
        $(this).removeClass('input-error');
    });

    // next step
    $('.registration-form .btn-next').on('click', function() {


        var a11 = $('#choose11').val();
        var a12 = $('#choose12').val();
        if(a11 == 0 || a12 == 0){
            $('#myModal .modal-body p').html('请选择您所在城市');
            $('#myModal').modal('show');
            return false;
        }

        //校验字段
        var a = $('#choose2').val();
        console.log(a);
        if(a == 0){
            $('#myModal .modal-body p').html('请选择申报专业');
            $('#myModal').modal('show');
            return false;
        }

        /*var b = $('#choose3').val();
        console.log(a);
        if(b == 0){
            $('#myModal .modal-body p').html('请选择申报等级');
            $('#myModal').modal('show');
            return false;
        }*/
        var b36 = $('#choose36').val();
        console.log(a);
        if(b36 < 0){
            $('#myModal .modal-body p').html('请选择申报专业');
            $('#myModal').modal('show');
            return false;
        }



        console.log($(this).index());
        //调用专业
        if($(this).index() == 4) {

            /*
            //隐藏查询表单
            $('#sele-box').hide();
            $('.ssl-box').hide();


            $('#loadingModal').modal('show');
            $.ajax({
                url: '/api/Diyajax/getZcZyList',
                method: 'POST',
                dataType: 'json', // 指定响应数据为JSON
                data: {
                    id: a
                },
                success: function (data) {
                    // 请求成功后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理返回的数据
                    console.log('Ajax response:', data);
                    console.log(data.data);
                    var html = '';
                    var html2 = '';
                    $.each(data.data, function (i, e) {
                        console.log(e);
                        html += '<p class="form-control-static" style="min-height:20px;padding-top:5px;padding-bottom:0px;"><label class="checkbox-inline"><input type="checkbox" name="zy[]" id="inlineCheckbox'+i+'" value="'+e.id+'"> '+e.title+'</label></p>';
                        html2 += '<span class="hjk">'+e.title+'</span>';
                    });

                    if(html == ''){
                        //隐藏
                        $('#zy_box').hide();
                        html = '暂无相关要求';
                    }
                    if(html2 == ''){
                        //隐藏
                        $('#zy_box').hide();
                        html2 = '暂无相关要求';
                    }

                    $('#zys').empty();
                    $('#zys').append(html);


                    $('#zys-list').empty();
                    $('#zys-list').append(html2);


                },
                error: function (xhr, status, error) {
                    // 请求失败后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理错误
                    console.error('Ajax error:', status, error);
                }
            });*/
        }

        //填完个人资料 点击下一步
        if($(this).index() == 10) {

            var b6 = $('#choose3').val();
            console.log(a);
            if(b6 == 0){
                $('#myModal .modal-body p').html('请选择申报等级');
                $('#myModal').modal('show');
                return false;
            }

            var b = $('#choose6').val();
            console.log(a);
            if(b == 0){
                $('#myModal .modal-body p').html('请选择年龄');
                $('#myModal').modal('show');
                return false;
            }
            var b = $('#choose5').val();
            console.log(a);
            if(b == 0){
                $('#myModal .modal-body p').html('请选择学历');
                $('#myModal').modal('show');
                return false;
            }
            var b = $('#choose7').val();
            console.log(a);
            if(b == 0){
                $('#myModal .modal-body p').html('请选择学校类型');
                $('#myModal').modal('show');
                return false;
            }

            var b33 = $('#choose33').val();
            console.log(a);
            if(b33 == 0){
                $('#myModal .modal-body p').html('请选择毕业时间');
                $('#myModal').modal('show');
                return false;
            }

            var xl = $('#choose5').val();

            //调用证书
            $('#loadingModal').modal('show');
            $.ajax({
                url: '/api/Diyajax/getZcZsList',
                method: 'POST',
                dataType: 'json', // 指定响应数据为JSON
                data: {
                    id: a,
                    xl: xl,
                },
                success: function (data) {
                    // 请求成功后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理返回的数据
                    console.log('Ajax response:', data);
                    console.log(data.data);
                    var html = '';



                    //赋值状态
                    var datac = $('#zss').attr('datac');
                    if(datac != '' && datac != '0,'){
                        var datac_arr = datac.split(',');
                    }else{
                        var datac_arr = [];
                    }

                    var datad = $('#zss').attr('datad');
                    if(datad != '' && datad != '0,'){
                        var datad_arr = datad.split(',');
                    }else{
                        var datad_arr = [];
                    }

                    console.log(datac_arr);
                    $.each(data.data, function (i, e) {

                        if (datac_arr.includes(String(e.id))) {
                            var status = 'checked';
                        } else {
                            var status = '';
                        }

                        var options = '';
                        for(i=1;i<=30;i++) {
                            if (datad_arr.includes(String(i))) {
                                var status2 = 'selected';
                            } else {
                                var status2 = '';
                            }
                            options += '<option value="'+i+'" '+status2+'>'+i+'年</option>';
                        }

                        console.log(e);
                        html += '<p class="form-control-static" style="min-height:20px;padding-top:5px;padding-bottom:0px;"><label class="checkbox-inline" style="margin-top: -4px;font-size: 15px;"><input type="checkbox" name="zs[]" id="inlineCheckbox' + i + '" value="' + e.id + '" '+status+'> ' + e.title + '</label><font style="margin-left:15px;"><select className="form-control-s" name="zsnx[]">'+options+'</select></font></p>';
                    });

                    if(html == ''){
                        html = '暂无相关要求（0.5s后自动进行下一步）';
                        //直接点击跳转下一步
                        //ajax异步是一个线程
                        //定时器也是一个独立线程
                        //ajax直接执行点击有问题 放到定时器里面即可
                        $('#zss').attr('data','no');
                        setTimeout(function() {
                            $('#jumpBtn').trigger('click');
                            //$('#jumpBtn').parent().parent().hide();
                        }, 500);  //大于400
                    }else{
                        $('#zss').attr('data','yes');
                    }
                    $('#zss').empty();
                    $('#zss').append(html);
                },
                error: function (xhr, status, error) {
                    // 请求失败后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理错误
                    console.error('Ajax error:', status, error);
                }
            });
        }

        if($(this).index() == 2) {
            //获取表单令牌 不能用接口直接过去 得用内部调用
            /*$('#loadingModal').modal('show');
            $.ajax({
                url: '/api/v1/api/get_token',
                method: 'POST',
                dataType: 'json', // 指定响应数据为JSON
                data: {},
                success: function (data) {
                    // 请求成功后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理返回的数据
                    console.log('Ajax response:', data);
                    console.log(data.data);

                    $('#token').val(data.value);
                },
                error: function (xhr, status, error) {
                    // 请求失败后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理错误
                    console.error('Ajax error:', status, error);
                }
            });*/
        }


        //继续下一屏切换
        var parent_fieldset = $(this).parents('fieldset');
        var next_step = true;

        parent_fieldset.find('input[type="text"], input[type="password"], textarea').each(function() {
            if( $(this).val() == "" ) {
                //$(this).addClass('input-error');
                //next_step = false;
            }
            else {
                //$(this).removeClass('input-error');
            }
        });

        if( next_step ) {
            parent_fieldset.fadeOut(400, function() {
                $(this).next().fadeIn();
            });
        }

    });

    // previous step
    $('.registration-form .btn-previous').on('click', function() {

        console.log($(this).index());
        if($(this).index() == 6){
            //隐藏查询表单
            $('#sele-box').show();
            //$('.ssl-box').show();
        }

        if($(this).index() == 4){
            //判断是否空证书
            var a = $('#zss').attr('data');
            if(a == 'no'){
                setTimeout(function() {
                    $('#jumpBtn2').trigger('click');
                    //$('#jumpBtn').parent().parent().hide();
                }, 500); //大于400
            }
        }

        //返回到填写个人信息
        //是否有选中的checkbox
        var zhengshu_str = '';
        var zhengshu_str2 = '';
        if($(this).index() == 1) {
            $('#zss input[type=checkbox]').each(function () {
                if ($(this).is(':checked')) {
                    // 至少有一个checkbox被选中
                    //zhengshu.push($(this).val());
                    zhengshu_str += $(this).val() + ',';
                    zhengshu_str2 += $(this).parent().parent().find('font select').val() + ',';
                } else {
                    // 没有任何checkbox被选中
                    //zhengshu.push("0");
                    zhengshu_str += '0,';
                    zhengshu_str2 += '0,';
                }
            });
            //写入到dom
            $('#zss').attr('datac',zhengshu_str);
            $('#zss').attr('datad',zhengshu_str2);
        }

        $(this).parents('fieldset').fadeOut(400, function() {
            $(this).prev().fadeIn();
        });
    });

    // submit
    $('.registration-form').on('submit', function(e) {

        /*$(this).find('input[type="text"], input[type="password"], textarea').each(function() {
            if( $(this).val() == "" ) {
                e.preventDefault();
                $(this).addClass('input-error');
            }
            else {
                $(this).removeClass('input-error');
            }
        });*/

        function isValidPhoneNumber(phoneNumber) {
            var regex = /^1[3-9]\d{9}$/; // 中国手机号码正则表达式，以1开头，第二位是3-9，后面跟着9位数字
            return regex.test(phoneNumber);
        }

        //开始手动验证
        var a = $('#per-name').val();
        var b = $('#per-phone').val();
        var c = $('#per-code').val();

        if(a == ''){
            $('#myModal .modal-body p').html('请输入您的称呼');
            $('#myModal').modal('show');
            return false;
        }
        if(b == ''){
            $('#myModal .modal-body p').html('请输入您的手机号码');
            $('#myModal').modal('show');
            return false;
        }
        console.log(isValidPhoneNumber(b));
        if(isValidPhoneNumber(b) === false){
            $('#myModal .modal-body p').html('请输入正确的手机号码格式');
            $('#myModal').modal('show');
            return false;
        }
        if(c == ''){
            $('#myModal .modal-body p').html('请输入验证码');
            $('#myModal').modal('show');
            return false;
        }

        //循环所有checkbox 重新构建数组
        //var zhengshu = [];
        var zhengshu = '';
        $('#zss input[type=checkbox]').each(function() {
            if ($(this).is(':checked')) {
                // 至少有一个checkbox被选中
                //zhengshu.push($(this).val());
                zhengshu += $(this).val()+',';
            } else {
                // 没有任何checkbox被选中
                //zhengshu.push("0");
                zhengshu += '0,';
            }
        });
        $('#zhengshu_val').val(zhengshu);

        //发送表单信息到后台
        $('#loadingModal .visually-hidden').html('获取结果中...');
        $('#loadingModal').modal('show');
        var formData = $('.registration-form').serializeArray();
        console.log(formData);

        //return false;
        $.ajax({
            url: '/api/Diyajax/insData',
            method: 'POST',
            dataType: 'json', // 指定响应数据为JSON
            data: formData,
            success: function(data) {
                // 请求成功后隐藏加载状态
                $('#loadingModal').modal('hide');
                // 处理返回的数据
                console.log('Ajax response:', data);

                $('#loadingModal .visually-hidden').html(data.msg);
                $('#loadingModal').modal('show');

                if(data.code == 0){
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                    }, 3000); // 5秒后取消定时器
                }else{
                    //重置表单数据
                    //$('.registration-form').reset();
                    $('.registration-form')[0].reset();
                    //成功
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                        //跳转到结果页
                        location.href = 'https://www.zc10000.com/cp?h='+data.data.code;
                    }, 1000); // 5秒后取消定时器
                }
            },
            error: function(xhr, status, error) {
                // 请求失败后隐藏加载状态
                $('#loadingModal').modal('hide');
                // 处理错误
                console.error('Ajax error:', status, error);
            }
        });
        return false;
    });


    /**
     * 获取验证码
     */
    /*$('#cx-rel-code').on('click',function (){

    });*/

    /**
     * 查询提交的事件
     */
    $('#cx-submit').on('click',function (){

        function isValidPhoneNumber(phoneNumber) {
            var regex = /^1[3-9]\d{9}$/; // 中国手机号码正则表达式，以1开头，第二位是3-9，后面跟着9位数字
            return regex.test(phoneNumber);
        }

        var a = $('#cx-code').val();
        if(a == ''){
            $('#myModal .modal-body p').html('请输入验证码');
            $('#myModal').modal('show');
            return false;
        }
        var b = $('#ffnp').val();
        if(isValidPhoneNumber(b) === false){
            $('#myModal .modal-body p').html('请输入正确的手机号码格式');
            $('#myModal').modal('show');
            return false;
        }
        var t = $('#times').val();

        //请求ajax
        $.ajax({
            url: '/api/Diyajax/cxCode',
            method: 'POST',
            dataType: 'json', // 指定响应数据为JSON
            data: {
                'code': a,
                'mobile': b,
            },
            success: function(data) {
                // 请求成功后隐藏加载状态
                $('#loadingModal').modal('hide');
                // 处理返回的数据
                console.log('Ajax response:', data);

                $('#loadingModal .visually-hidden').html(data.msg);
                $('#loadingModal').modal('show');

                if(data.code == 0){
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                    }, 3000); // 5秒后取消定时器
                }else{
                    //重置表单数据
                    $('#cx-code').val('');
                    //成功
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                        //跳转到结果页
                        location.href = 'https://www.zc10000.com/cp?p='+b+'&t='+t;
                    }, 2000); // 5秒后取消定时器
                }
            },
            error: function(xhr, status, error) {
                // 请求失败后隐藏加载状态
                $('#loadingModal').modal('hide');
                // 处理错误
                console.error('Ajax error:', status, error);
            }
        });


        $('.form-inline').trigger('click');
        return false;


    });




    // 获取长度为len的随机字符串
    function _getRandomString(len) {
        len = len || 32;
        var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; // 默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1
        var maxPos = $chars.length;
        var pwd = '';
        for (i = 0; i < len; i++) {
            pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
        }
        return pwd;
    }
    var timestamp = new Date().getTime();
    var times= timestamp + _getRandomString(32);
    console.log(times);
    $('#times').val(times);


    /**
     * 点击显示成功 示例
     */
    var browserWidth = $(window).width();
    if (browserWidth < 1001) {
        //手机端生效
        $('.but-success').removeClass('but-success2');
    }
    $('.but-success').click(function (){
        //$('.ssl-box').toggle();
        //.fadeOut();
        //.fadeIn();
        if($('.ssl-box').is(":hidden")){
            $('.ssl-box').fadeIn().show();
            $('.but-success').addClass('but-success2');
        }else{
            $('.ssl-box').fadeOut().hide();
            $('.but-success').removeClass('but-success2');
        }

        var browserWidth = $(window).width();
        if (browserWidth < 1001) {
            //手机端生效
            $('.but-success').removeClass('but-success2');
            $('.ssl-box').fadeOut().hide();
            $('#myModal').addClass('sss-box');
            /*$('#myModal .modal-title').html('详情');*/
            var html = $('.ssl-box').html();
            $('#myModal .modal-body p').html(html);
            $('#myModal').modal('show');
        }

    });


});