<?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>
<!--<link href="<?/*= STATIC_URL */?>/css/ssq.css" rel="stylesheet">-->
<?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">
                    <div id="result" class="success">
                        <h1><i class="fa fa-check"></i>申请成功，请等待审核</h1>
                        <p>申请结果会以邮件形式通知您,谢谢！</p>
                        <p>页面<span style="color: red">5</span>秒后跳转</p>
                    </div>
                    <div id="req">
                        <p>填写基本信息</p>
                        <div class="form-group"><label>代理商姓名 *</label>
                            <input name="name" type="text" placeholder="您的姓名" class="form-control" value="<?= $data['name']?>" readonly>
                        </div>
                        <div class="form-group"><label>代理商地址（需与您的身份证地址一致） *</label>
                            <input name="address" type="text" placeholder="您的联系地址" class="form-control" value="<?= $data['address']?>">
                        </div>
                        <div class="form-group"><label>电话号码 *</label>
                            <input name="mobile" type="text" placeholder="您的电话号码" class="form-control" value="<?= $data['mobile']?>">
                        </div>
                        <div class="form-group"><label>电子邮箱 *</label>
                            <input id="email" name="email" type="text" placeholder="您的电子邮箱" class="form-control" value="<?= $data['email']?>">
                        </div>
                        <div class="form-group"><label>推荐人ID *</label>
                            <input name="rid" type="text" placeholder="您的推荐人ID" class="form-control" value="<?= $login ?>" readonly>
                        </div>
                        <div class="form-inline">
                            <div class="form-group"><label>返佣标准 *</label>
                                <p>
                                forex:<input style="width: 16%" name="forex" type="text" class="form-control">美金
                                metal:<input style="width: 16%" name="metal" type="text" class="form-control">美金
                                cfd:<input style="width: 16%" name="cfd" type="text" class="form-control">美金
                                </p>
                                <p>
                                黄金:<input style="width: 16%" name="gold" type="text" class="form-control">美金
                                白银:<input style="width: 16%" name="silver" type="text" class="form-control">美金
                                外佣:<input style="width: 16%" name="wy" type="text" class="form-control">美金
                                </p>
                            </div>
                        </div>
                        <hr>
                        <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>

                        <div class="form-group">
                            <label>开户银行 *</label>
                            <select name="bank_name" class="form-control select22">
                                <option value="">请选择</option>
                                <option value="102">工商银行</option>
                                <option value="103">农业银行</option>
                                <option value="104">中国银行</option>
                                <option value="105">建设银行</option>
                                <option value="308">招商银行</option>
                                <option value="301">交通银行</option>
                                <option value="305">民生银行</option>
                                <option value="302">中信银行</option>
                                <option value="303">光大银行</option>
                                <option value="309">兴业银行</option>
                                <option value="4031000">北京银行</option>
                                <option value="306">广发银行</option>
                                <option value="304">华夏银行</option>
                                <option value="403">邮储银行</option>
                                <option value="310">浦发银行</option>
                                <option value="4105840">平安银行</option>
                                <option value="4012900">上海银行</option>
                                <option value="4233310">杭州银行</option>
                                <option value="316">浙商银行</option>
                                <option value="4504520">青岛银行</option>
                                <option value="4083320">宁波银行</option>
                                <option value="4341100">天津银行</option>
                                <option value="4478210">兰州银行</option>
                                <option value="4243010">南京银行</option>
                                <option value="4296510">成都银行</option>
                                <option value="322">上海农商银行</option>
                                <option value="4021000">北京农村商业银行</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <div class="form-inline"><label>开户支行信息 *</label>
                                <div class="clearfix">
                                    <div id="distpicker5" class="pull-left">
                                        <div class="form-group">
                                            <label class="sr-only" for="province"></label>
                                            <select class="form-control" id="province" name="bank_province"></select>
                                        </div>
                                        <div class="form-group">
                                            <label class="sr-only" for="city"></label>
                                            <select class="form-control" id="city" name="bank_city"></select>
                                        </div>
                                        <div class="form-group">
                                            <label class="sr-only" for="district"></label>
                                            <select class="form-control" id="district" name="bank_district"></select>
                                        </div>
                                    </div>
                                    <div class="form-group pull-left">
                                        <input name="bank_branch" type="text" placeholder="支行名称" class="form-control">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group"><label>银行卡账号 *</label>
                            <input name="bank_card_no" type="text" placeholder="您的银行卡账号" class="form-control">
                        </div>

                        <div class="form-group"><label>收款人 *</label>
                            <input name="collect_name" type="text" placeholder="您的收款人姓名" class="form-control">
                        </div>

                        <div class="form-group"><label>Swift代码 *</label>
                            <input name="bank_swift_code" type="text" placeholder="您的swift代码" class="form-control">
                            <a href="http://www.swiftcode.cn" target="_blank" tabindex="-1">点我查询银行swift代码</a>
                        </div>

                        <div class="form-group">
                            <label> <input name="agree1" type="checkbox" class="i-checks">
                                我已阅读和同意<a href="<?= STATIC_URL ?>/upload/TheBrokerAgreement.pdf" target="_blank">《The Broker Agreement》</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 class="col-sm-5">
                    <div class="sm">
                        <div class="qrcode" id="qrcode"></div>
                        <h3>标注 * 号的为必填项</h3>
                        <h3>请仔细阅读<a href="<?= STATIC_URL ?>/upload/TheBrokerAgreement.pdf" target="_blank">《The Broker Agreement》</a></h3>
                        <h3>申请结果会以邮件形式通知您,谢谢！</h3>
                    </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 src="<?= STATIC_URL ?>/ui/js/distpicker/distpicker.data.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/distpicker/distpicker.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/distpicker/main.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);
        }
    }

    $(document).ready(function () {
        $("#form").validate({
            rules: {
                "card0": {
                    required: true
                },
                "card1": {
                    required: true
                },
                "name": {
                    required: true
                },
                "address": {
                    required: true
                },
                "mobile": {
                    required: true
                },
                "email": {
                    required: true,
                    email: true,
                    // remote: "<?= Url::to(['checkemailexist']) ?>"
                },
                "rid": {
                    required: true
                },
                "forex": {
                    required: true
                },
                "metal": {
                    required: true
                },
                "gold": {
                    required: true
                },
                "silver": {
                    required: true
                },
                "cfd": {
                    required: true
                },
                "wy": {
                    required: true
                },
                "bank_name": {
                    required: true
                },
                "bank_province": {
                    required: true
                },
                "bank_city": {
                    required: true
                },
                "bank_branch": {
                    required: true
                },
                "bank_card_no": {
                    required: true
                },
                "collect_name": {
                    required: true
                },
                "bank_swift_code": {
                    required: true
                },
                "agree1": {
                    required: true
                }
            }
        });
    });
    $("#submit").on("click", function () {
        var formData = new FormData($("#form")[0]);
        if ($("#form").valid()) {
            $.ajax({
                type: "POST",
                url: "<?= Url::to(['ib-complete-save']) ?>",
                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, "提示");
                        setTimeout(location.href="<?= Url::to(['/ib/dashboard']) ?>", 5000);
                    } else {
                        toastr.error(data.msg, "提示");
                    }
                },
                complete: function (XMLHttpRequest, textStatus) {
                },
                error: function () {
                }
            });
        }
    });
</script>
<?php $this->endBlock(); ?>
