add_information.html 7.9 KB
<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>学考无忧-个人信息</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/reset.css" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/log.css" />
</head>

<body>
<div class="log_top_second">
    <!-- 顶部 -->
    <div class="ad_top" style="background-color:white;">
        <a href="javascript:history.back(-1)">
            <img class="ad_topImg" src="__TMPL__/public/assets/images/left.png" alt="" />
        </a>
        <h1>个人信息</h1>
    </div>
</div>
<div class="log_two_input">
    <div class="log_two_input_one">
        <div class="log_two_input_title">
            姓名
        </div>
        <div class="log_two_input_contant">
            <input type="text" placeholder="请输入姓名" id="name" />
        </div>
    </div>
    <div class="log_two_input_one">
        <div class="log_two_input_title">
            手机号
        </div>
        <div class="log_two_input_contant">
            <input style="width:3rem" type="text" placeholder="请输入手机号" maxlength="11" name="phone" id="phone" />
        </div>
        <div class="log_two_input_btn">
            <input type="button" class="btn" id="code" value="获取验证码" onclick="codeButton()">
        </div>
    </div>
    <div class="log_two_input_one">
        <div class="log_two_input_title">
            输入验证码
        </div>
        <div class="log_two_input_contant">
            <input type="text" placeholder="请输入验证码" id="mycode" />
        </div>
    </div>
    <div class="log_two_input_one">
        <div class="log_two_input_title">
            身份证号
        </div>
        <div class="log_two_input_contant">
            <input type="text" placeholder="请输入身份证号" id="id_num" />
        </div>
    </div>
</div>
<div class="log_two_picture">
    <div class="log_two_picture_title">
        上传证件照
    </div>
    <div class="log_two_picture_img">
        <div class="log_two_pi_one">
            <div class="log_two_pi_one_icon">
                <img src="__TMPL__/public/assets/images/jiahao.png" id="img0" alt="" />
            </div>
            <div class="log_two_pi_one_p">
                正面
            </div>
            <div class="input_file">
                <input type="file" id="img1_file" />
            </div>
        </div>
        <div class="log_two_pi_one log_two_pi_two">
            <div class="log_two_pi_one_icon">
                <img src="__TMPL__/public/assets/images/jiahao.png" id="img1" alt="" />
            </div>
            <div class="log_two_pi_one_p">
                反面
            </div>
            <div class="input_file">
                <input type="file" id="img2_file" />
            </div>
        </div>
    </div>
    <div class="log_two_picture_state">
        <div class="log_two_ps_one">
            拍照示范
        </div>
        <div class="log_two_ps_two">
            <img src="__TMPL__/public/assets/images/88.png" alt="" class="img1" />
            <img src="__TMPL__/public/assets/images/89.png" alt="" class="img2" />
        </div>
        <div class="log_two_ps_three">
            请稳定拍摄,保证照片中的<span>证件完整</span>,字体清晰,亮度均匀,可以高通过率
        </div>
    </div>
</div>
<!-- 保存 -->
<!--<div class="log_two_bottom_btn" onclick="auditadd()">
    保存
</div>-->
<button class="log_two_bottom_btn" onclick="auditadd()" >保存</button>
<script src="__TMPL__/public/assets/js/jquery.js"></script>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/uploadfile.js"></script>
<script>
    /**
     *保存提交审核信息
     */
    function auditadd(){
        if($('#name').val() == ''){
            alert('姓名不能为空');
        }else if($('#phone').val() == ''){
            alert('手机号不能为空');
        }else if($('#mycode').val() == ''){
            alert('验证码不能为空');
        }else if($('#id_num').val() == ''){
            alert('身份证号不能为空');
        }else{
            $('.log_two_bottom_btn').text('提交中').attr('disabled',true);
            name = $('#name').val();
            phone = $('#phone').val();
            code = $('#mycode').val();
            id_num = $('#id_num').val();
            img0 = $('#img0')[0].src;
            img1 = $('#img1')[0].src;
            $.post("{:url('Personalcenter/add_audit')}",{name:name,phone:phone,code:code,id_num:id_num,img0:img0,img1:img1},function(data){
            if(data == 3){
                $('.log_two_bottom_btn').text('提交').attr('disabled',false);
                alert('验证码错误');
            }else if(data == 2){
                $('.log_two_bottom_btn').text('提交').attr('disabled',false);
                alert('提交失败');
            }else if(data == 1){
                window.location.href = "{:url('Personalcenter/personal_center')}";
            }
            });
        }
    }
</script>
<script>
    // 上传图片
    //上传图片
    $(function() {
        $("#img1_file").on("change", function() {
            var img_size = $(this).get(0).files[0].size;
            if(img_size > 1024000) {
                alert("上传图片过大,请上传小于1M的图片");
            } else {
                $.ajaxFileUpload({
                    url: "{:url('/')}", //用于文件上传的服务器端请求地址
                    secureuri: false, //是否需要安全协议,一般设置为false
                    fileElementId: 'personal-photo', //文件上传域的ID
                    dataType: 'json', //返回值类型 一般设置为json
                    success: function(data) { //服务器成功响应处理函数
                        console.log(data.msg);
                    }
                });
            }
        });

        $("#img2_file").on("change", function() {
            var img_size = $(this).get(0).files[0].size;
            if(img_size > 1024000) {
                alert("上传图片过大,请上传小于1M的图片");
            } else {
                $.ajaxFileUpload({
                    url: '/portal/login/updateAvatar', //用于文件上传的服务器端请求地址
                    secureuri: false, //是否需要安全协议,一般设置为false
                    fileElementId: 'personal-photo', //文件上传域的ID
                    dataType: 'json', //返回值类型 一般设置为json
                    success: function(data) { //服务器成功响应处理函数
                        console.log(data);
                    }
                });
            }
        });
    });

    //短信验证码
    function codeButton() {
        phone = $("input[name='phone']").val();
        if(phone == ''){
            alert('手机号不能为空');
        }else{
            $.post("{:url('Personalcenter/send_message')}",{phone:phone},function(data){
                if(data){
                    var code = $("#code");
                    code.attr("disabled", "disabled");
                    setTimeout(function() {
                        code.css("opacity", "0.8");
                    }, 1000)
                    var time = 60;
                    var set = setInterval(function() {
                        code.val("(" + --time + ")秒后重新获取");
                    }, 1000);
                    setTimeout(function() {
                        code.attr("disabled", false).val("重新获取验证码");
                        clearInterval(set);
                    }, 60000);
                }else{
                    alert('发送失败!');
                }
            });
        }

    }
</script>
</body>

</html>