<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/include/taglib.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link rel="stylesheet" href="/static/weChat/css/public.css">
    <link rel="stylesheet" href="/static/weChat/css/bai_basic.css">
    <link rel="stylesheet" href="/static/weChat/css/SG_area_select.css">
    <script src="/static/weChat/js/flexible.js"></script>
    <title>纸质保单、保函</title>
</head>
<body id="container">
<%--过度动画--%>
<div id="mask">
<div class="main">
    <div class="loading">
        <span></span>
        <span></span>
        <span></span>
        <span></span>
        <span></span>
    </div>
</div>
<div class="black-mask-my"></div>
</div>

<div class="arment-head">
    <div class="arment-left">
        <a href="/weixin/order/zzx/zzx_order_make_sure?ins_insurance_slip_id=${p.ins_insurance_slip_id}" >
            <img src="/static/weChat/images/arment-left.png"/>
        </a>
    </div>
    <p>纸质保单、保函</p>
</div>

<span id="lm-wsx">电子保单可在我的订单中下载，是否需要纸质保单、保函？</span>

<div class="paper-policy">
    <div class="policy-cont">
        <form id="defaultForm">
            <p id="need_insur_bill_div">
                <%--<input type="checkbox" id="need_insur_bill">--%>
                <%--<label class="fl-l"></label>--%>
                <span id="need_insur_bill_span" val="0">不需要</span>
            </p>
            <div class="policy">
                <h2>纸质保单、保函基本信息</h2>
                <ul>
                    <li>
                        <span>收件人姓名</span>
                        <div class="dfg">
                            <input  placeholder="请填写收件人姓名" class="valid_receiver_name myValid" name="receiver_name" id="receiver_name" >
                            <b></b>
                        </div>
                    </li>
                    <li>
                        <span>收件人手机</span>
                        <div class="dfg">
                            <input  placeholder="请填写收件人手机号" class="valid_receiver_mobile myValid" name="receiver_mobile" id="receiver_mobile">
                            <b></b>
                        </div>
                    </li>
                    <%--<li>--%>
                        <%--<span>所在城市</span>--%>
                        <%--<div class="dfg">--%>
                            <%--<input type="text" placeholder="请选择" readonly="readonly" class="city" id="selectBtn">--%>
                            <%--<b></b>--%>
                        <%--</div>--%>
                        <%--<div class="qqq" style="display: none">--%>
                            <%--<input type="text" id="a-province" name="reg_province" value="${row.applicant.reg_province}">--%>
                            <%--<input type="text" id="a-city" name="reg_city" value="${row.applicant.reg_city}">--%>
                            <%--<input type="text" id="a-area" name="reg_district" value="${row.applicant.reg_district}" >--%>
                        <%--</div>--%>
                    <%--</li>--%>
                    <li>
                        <span>收件人地址</span>
                        <div class="dfg">
                            <i id="ert" class="wert"></i>
                            <input type="hidden" class="valid_receiver_address_detail myValid" name="receiver_address_detail" id="data" >
                            <b></b>
                        </div>
                    </li>
                </ul>
            </div>
        </form>
    </div>
</div>

<div class="policy-save on">
    <a href="javascript:;" id="sure">确定</a>
</div>

<!--具体地址弹窗-->
<div class="business-select" id="address-cont">
    <h2>请填写具体地址</h2>
    <textarea></textarea>
    <div class="sure">
        <p class="ding">确定</p>
        <p class="xiao">取消</p>
    </div>
</div>

<!--是否需要纸质保单、保函-->
<div class="business-select" id="bill-model">
    <h2>请选择是否需要</h2>
    <ul>
        <li>
            <p  id="bill-model-no" val="0">不需要</p>
        </li>
        <li>
            <p  id="bill-model-yes" val="1">需要</p>
        </li>
    </ul>
</div>

<!--黑色蒙版-->
<div class="black-mask"></div>

</body>
<script src="/static/weChat/js/jquery-1.8.3.min.js"></script>

<script src="/static/weChat/js/jquery.formHelper.js"></script>
<script src="/static/weChat/common/layer_mobile/layer.js"></script>
<link rel="stylesheet" href="/static/weChat/common/layer_mobile/need/right.css"/>
<script src="/static/weChat/js/weixin_g.js"></script>

<script src="/static/weChat/js/basic.js"></script>
<script src="/static/weChat/js/iscroll.js"></script>
<script src="/static/weChat/js/SG_area_select-two.js"></script>
<script>

    s_rheight = parseInt($('#bill-model').height()/2);
    $('#bill-model').css({"margin-top":-s_rheight+'px'});

    //    折叠
    $('.paper-policy .policy-cont p').click(function () {
        $('#bill-model').show();
        $('.black-mask').show();
    });

    $('#bill-model ul li p').click(function () {
        $('#bill-model ul li p').removeClass('on');
        $(this).addClass('on');
        var sdf = $(this).text();
        $('#need_insur_bill_div span').text(sdf);
        var set = $(this).attr('val');
        $('#need_insur_bill_div span').attr("val",set);
        if(set==0){
            $('#defaultForm .policy').slideUp();
        }else if(set==1){
            $('#defaultForm .policy').slideDown();
        }
        $('#bill-model').hide();
        $('.black-mask').hide();
    });

    //具体地址填写
    var se_height = parseInt($('#address-cont').height()/2);
    $('#address-cont').css({"margin-top":-se_height+'px'});

    $('#ert').click(function () {
        var df = $('#ert').text();
        $('#address-cont').show();
        $('#address-cont textarea').val(df).focus();
        $('.black-mask').show();
    });
    $('#address-cont .sure p.xiao').click(function () {
        $('#address-cont').hide();
        $('.black-mask').hide();

    });
    $('#address-cont .sure p.ding').click(function () {
        $('#address-cont').hide();
        var ert = $('#address-cont textarea').val();
        $('#data').val(ert);
        $('#ert').text(ert);
        $('.black-mask').hide();
        $(".valid_receiver_address_detail").trigger("change");
    });

    //    城市选择
    $('#selectBtn').on('click', function () {
        $.areaSelect();
        $('.title-min .query').on('click', function () {
            $('#selectBtn').val('');
            $(".popups-box").show().animate({bottom: '-500px'}, function () {
                $('.sg-mask').css('display', 'none');
                $('.sg-mask').remove();
            });
        });

        $('.title-min .submit').on('click', function () {
            if ($('#wrapper2 ul li').hasClass('minISClick')) {
                $('#selectBtn').val($('#hasCheck').val());
                $(".popups-box").show().animate({bottom: '-500px'}, function () {
                    $('.sg-mask').css('display', 'none');
                    $('.sg-mask').remove();
                })

                $('#a-province').val($('#wrapper0 ul li.minISClick input').val());
                $('#a-city').val($('#wrapper1 ul li.minISClick input').val());
                $('#a-area').val($('#wrapper2 ul li.minISClick input').val());
            }
        })
    });
</script>
<script>


    //统一验证
    var allright=true ;
    function isWrong(el,obj, msg){
        if(el){
            $(obj).nextAll("b").remove();
            if(msg!="") $(obj).after("<b style='display:block'>"+msg+"</b>");
            allright=false;
            return false;
        }else{
            $(obj).nextAll("b").remove();
            return true;
        }
    }
    function clearErr(obj){
        $(obj).nextAll("b").remove();
    }

    $(".valid_receiver_name").bind("blur keyup",function(){ //投保人名称
        var r1 = isWrong($(this).val().trim()=="",this,"必填项不可为空"); if(!r1) return r1;
        var r2 = isWrong(!/^[\u4e00-\u9fa5a-zA-Z]{2,12}$/.test($(this).val()),this,"要求2-12个中英文字母");
    });
    $(".valid_receiver_mobile").bind("blur keyup",function(){ //联系电话 手机
        var r1 = isWrong($(this).val().trim()=="",this,"必填项不可为空"); if(!r1) return r1;
        var r2 = isWrong(!/^\d{11}$/.test($(this).val()),this,"要求11位手机号码");
    });
    $(".valid_receiver_address_detail").bind("change",function(){ //具体地址
        var r1 = isWrong($(this).val().trim()=="",this,"必填项不可为空"); if(!r1) return r1;
        var r2 = isWrong( !($(this).val().length<=50 && $(this).val().length>=5),this,"要求5-50个字符长度");
    });


    $('#sure').click(function () {
        allright=true;
        $(".myValid").each(function(){
            if ($(this).parent().is(":hidden")) return;
            $(this).trigger("blur"); $(this).trigger("change");
        }); //校验表单
        console.log(allright);
        if(allright){
            if("${row.order_status}"!=""){
                if("${row.order_status}"!="1" && "${row.order_status}"!="2"){
                    layer.open({content:"订单已生效不可以修改",btn: '我知道了'}); return;
                }
            }
            var p  = $("#defaultForm").serializeJson();
            p.ins_mail_policy_id = "${row.ins_mail_policy.ins_mail_policy_id}";
            p.ins_insurance_slip_id = "${p.ins_insurance_slip_id}";
            p.need_receipt = '${row.ins_mail_policy.need_receipt}';
            //是否需要发票，发票类型的设置
            var val  = $("#need_insur_bill_span").attr("val");
            if(val=="0"){
                p.need_insur_bill=0;
            }else if(val=="1"){
                p.need_insur_bill=1;
            }

            $("#mask").show();
            g_ajax("/weixin/order/save/insMailPolicy",p,function(json){
                if (json.success == true) {
                    location.href =  "/weixin/order/zzx/zzx_order_make_sure?ins_insurance_slip_id=${p.ins_insurance_slip_id}";
                } else {
                    $("#mask").hide();
                    layer.open({content:json.msg,btn: '我知道了'})
                }
            },true);
        }else{
            layer.open({content:"请认真填写表单，再点击下一步",btn: '我知道了'})
        }
    });


    //debug
    $(document).ready(function () {
        g_ajax("/weixin/order/detail/debug/",{ins_insurance_slip_id:'${p.ins_insurance_slip_id}'},function(json){
            console.log(json);
            //联系人名
            if(json.ins_mail_policy!=undefined && json.ins_mail_policy.receiver_name!=undefined){
                $("#receiver_name").val(json.ins_mail_policy.receiver_name);
            }else if(json.applicant!=undefined && json.applicant.link_name!=undefined){
                $("#receiver_name").val(json.applicant.link_name);
            }

            //手机
            if(json.ins_mail_policy!=undefined && json.ins_mail_policy.receiver_mobile!=undefined){
                $("#receiver_mobile").val(json.ins_mail_policy.receiver_mobile);
            }else if(json.applicant!=undefined && json.applicant.link_tel!=undefined){
                $("#receiver_mobile").val(json.applicant.link_tel==undefined?"":json.applicant.link_tel);
            }

            //邮寄地址
            if(json.ins_mail_policy!=undefined && json.ins_mail_policy.receiver_address_detail!=undefined){
                $("#data").val(json.ins_mail_policy.receiver_address_detail);
                $("#ert").html(json.ins_mail_policy.receiver_address_detail);
            }else{
                var s = (json.area==undefined?"":json.area)+"  "+ (json.applicant.reg_address==undefined?"":json.applicant.reg_address);
                $("#data").val(s);
                $("#ert").html(s);
            }

            if(json.ins_mail_policy!=undefined){
                if(json.ins_mail_policy.need_insur_bill!=undefined){
                    if(json.ins_mail_policy.need_insur_bill=="1"){
                        $("#bill-model-yes").trigger("click");
                    }else{
                        $("#bill-model-no").trigger("click");
                    }
                }


            }
            $("#mask").hide();
        },false);
    })

</script>
</html>