CRM/normandcrm/crm/backend/views/account/open.php

<?php
/* @var $this \yii\web\View */
use yii\helpers\Url;

$this->title = '真实账户申请';
?>
<?php $this->beginBlock('header_script'); ?>
<style>
    .cover {
        width: 100%;
        height: 190px;
    }

    .fileinput-button {
        position: relative;
        display: inline-block;
        overflow: hidden;
        width: 100%;
        height: 190px;
        text-align: center;
        border: 1px solid #DDD;
    }

    .fileinput-button .s {
        margin-top: 60px;
        font-size: 40px;
    }

    .fileinput-button input {
        position: absolute;
        right: 0px;
        top: 0px;
        opacity: 0;
        -ms-filter: 'alpha(opacity=0)';
        font-size: 100em;
    }

    .success {
        display: none;
        margin: 100px 0px;
        text-align: center;
    }

    .success h1 {
        color: #1ab394;
    }

    .wx {
        margin: 50px;
        text-align: center;
    }

    .icheckbox_square-green label.error {
            position: absolute;
    white-space: nowrap;
    top: 0;
    left: 280px;
    }

    .icheckbox_square-green input.error {
        background-color: #FBE3E4;
    }
</style>
<?php $this->endBlock(); ?>
<div class="ibox">
    <div class="ibox-title">
        <h2>真实账户申请</h2>
    </div>
    <div class="ibox-content">
        <form id="form">
            <div class="row">
                <div class="col-sm-7 b-r">
                    <div id="result" class="success">
                        <h1><i class="fa fa-check"></i>申请成功，请等待审核</h1>
                        <p>申请结果会以邮件形式通知您,谢谢！</p>
                    </div>
                    <div id="req">
                        <p>上传身份证照片</p>
                        <div class="row">
                            <div class="col-sm-6">
                                <img class="cover" id="cover0" src="<?= STATIC_URL ?>/ui/img/id_cover0.jpg">
                            </div>
                            <div class="col-sm-6">
                                <div class="fileinput-button">
                                    <i class="s fa fa-plus"></i>
                                    <p>选择身份证正面</p>
                                    <input name="card0" type="file" onchange="readFile0(this)"/>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-sm-6">
                                <img class="cover" id="cover1" src="<?= STATIC_URL ?>/ui/img/id_cover1.jpg">
                            </div>
                            <div class="col-sm-6">
                                <div class="fileinput-button">
                                    <i class="s fa fa-plus"></i>
                                    <p>选择身份证反面</p>
                                    <input name="card1" type="file" onchange="readFile1(this)"/>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <p>填写基本信息</p>
                        <div class="form-group"><label>姓名 *</label>
                            <input name="name" type="text" placeholder="您的姓名" class="form-control">
                        </div>
                        <div class="form-group"><label>身份证号码 *</label>
                            <input name="id_card" type="text" placeholder="您的身份证号码" class="form-control">
                        </div>
                        <div class="form-group">
                            <label>电子邮箱 *</label>
                            <div class="clearfix">
                                <input style="width:60%;" id="email" name="email" type="text" placeholder="您的电子邮箱" class="form-control pull-left">
                                <div style="width:30%;" id="sendMail" onclick="sendMail()" class="pull-right btn btn-default">
                                    获取验证码
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>邮箱验证码 *</label>
                            <input name="vcode" type="text" placeholder="您的邮箱验证码" class="form-control">
                        </div>
                       <!--<div class="form-group">
                            <label>手机号码 *</label>
                            <input  id="mobile" name="mobile" type="text" placeholder="您的手机号码" class="form-control ">
                        </div>-->

                        <input type="hidden" name="level" value="100">

                        <div class="form-group">
                            <label>推荐人ID* </label>
							<?php if ($login) { ?>
                            <input name="rid" type="text" placeholder="您的推荐人ID" class="form-control" value="<?= $login ?>" readonly>
							<?php }else{ ?>
							 <input name="rid" type="text" placeholder="您的推荐人ID" class="form-control" value="" >
							<?php } ?>
                        </div>
                        <div class="form-group"><label>地址（需与您的身份证地址一致） *</label> 
                            <input name="address" type="text" placeholder="您的联系地址" class="form-control">
                        </div>
                        <div class="form-group">
                            <label> <input name="agree1" type="checkbox" class="i-checks">
                                我已阅读和同意<a href="<?= STATIC_URL ?>/upload/客户协议与风险披露声明书.pdf" target="_blank">《客户协议与风险披露声明书》</a>
                            </label>
                        </div>
                        <div class="form-group">
                            <label> <input name="agree2" type="checkbox" class="i-checks">
                                我已阅读和同意<a href="<?= STATIC_URL ?>/upload/免责声明.pdf" target="_blank">《免责声明》</a>
                            </label>
                        </div>
                        <div class="form-group">
                            <button id="submit" class="btn btn-lg btn-primary" type="button">
                                <strong>提交申请</strong>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<?php $this->beginBlock('footer_script'); ?>
<script src="<?= STATIC_URL ?>/ui/js/jquery-qrcode-0.14.0.min.js"></script>
<script>
    jQuery('#qrcode').qrcode({
        render: 'image',
        correctLevel: 0,
        text: '<?= Url::current([], true) ?>',
        size: 200,
        background: '#FFF'
    });
    function readFile0(obj) {
        var file = obj.files[0];
        if (!/image\/\w+/.test(file.type)) {
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function (e) {
            $("#cover0").attr("src", this.result);
        }
    }
    function readFile1(obj) {
        var file = obj.files[0];
        if (!/image\/\w+/.test(file.type)) {
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function (e) {
            $("#cover1").attr("src", this.result);
        }
    }
    var wait = 120;
    function time() {
        if (wait == 0) {
            $("#sendMail").html("获取验证码");
            wait = 120;
        } else {
            $("#sendMail").html(wait + "秒后重试");
            wait--;
            setTimeout(function () {
                time()
            }, 1000)
        }
    }
    function sendMail() {

        //对邮箱的格式进行验证
        var emailvalue = $("#email").val();
        var reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
		if(!reg.test(emailvalue)){
            toastr.error('邮箱格式不正确', "提示");
            return;
		}

        if ($("#email").val()) {
            $.ajax({
                type: "POST",
                url: "<?= Url::to(['sendmail']) ?>",
                data: {
                    email: $("#email").val()
                },
                dataType: "json",
                beforeSend: function () {
                },
                success: function (data) {
                    if (data.isSuccess) {
                        time();
                    } else {
                        toastr.error(data.msg, "提示");
                    }
                },
                complete: function (XMLHttpRequest, textStatus) {
                },
                error: function () {
                }
            });
        } else {
            return;
        }
    }
    $(document).ready(function () {
        $("#form").validate({
            rules: {
                "card0": {
                    required: true
                },
                "card1": {
                    required: true
                },
                "name": {
                    required: true
                },
                "id_card": {
                    required: true
                },
                "email": {
                    required: true,
                    email: true,
                    remote: "<?= Url::to(['checkemailexist']) ?>"
                },
                "vcode": {
                    required: true
                },
                "level": {
                    required: true
                },
                "address": {
                    required: true
                },
                "rid": {
                    required: true
                },
                "agree1": {
                    required: true
                },
                "agree2": {
                    required: true
                }
            }
        });
    });
    $("#submit").on("click", function () {
        var formData = new FormData($("#form")[0]);
        if ($("#form").valid()) {
            $.ajax({
                type: "POST",
                url: "<?= Url::to(['opensave']) ?>",
                data: formData,
                dataType: "json",
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                beforeSend: function () {
                },
                success: function (data) {
                    if (data.isSuccess) {
                        $("#req").hide();
                        $("#result").show();
                        //toastr.success(data.msg, "提示");
                    } else {
                        toastr.error(data.msg, "提示");
                    }
                },
                complete: function (XMLHttpRequest, textStatus) {
                },
                error: function () {
                }
            });
        }
    });
</script>
<?php $this->endBlock(); ?>