<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8" %>
<%@ include file="/WEB-INF/include/taglib.jsp" %>
<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">
    <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>
<form id="defaultForm">
<div class="arment-head">
    <div class="arment-left">
        <a href="/weixin/order/zzx/zzx_write_order1?ins_insurance_slip_id=${p.ins_insurance_slip_id}">
            <img src="/static/weChat/images/arment-left.png"/>
        </a>
    </div>
    <p>填写订单</p>
</div>
<div class="users-data eeded">
    <h2>被保险人信息</h2>
    <ul class="data">
        <li>
            <p id="p_p_1">被保险人</p>
            <div class="dfg">
                <input  placeholder="请填写全称" id="name_cn" name="name_cn" class="valid_name_cn myValid" value="${row.insurant.name_cn}"/>
                <b></b>
            </div>
        </li>
        <li>
            <p id="p_p_2">证件类型</p>
            <div class="dfg">
                <input id="id_type" name="id_type" value="${row.insurant.id_type}" type="hidden">
                <input id="id_type_show" readonly="true"  class="s-sl valid_id_type myValid" placeholder="请选择" >
                <b></b>
            </div>
        </li>
        <li>
            <p id="p_p_3">证件号</p>
            <div class="dfg">
                <input placeholder="根据证件类型填写证件号" class="valid_organization_code myValid"  id="organization_code" name="organization_code" value="${row.insurant.organization_code}"/>
                <b></b>
            </div>
        </li>
    </ul>

    <ul class="data">
        <li>
            <p>联系人</p>
            <div class="dfg">
                <input  placeholder="请填写联系人姓名" id="link_name" name="link_name" class="valid_link_name myValid" value="${row.insurant.link_name}"/>
                <b></b>
            </div>
        </li>
        <li>
            <p>手机号</p>
            <div class="dfg">
                <input type="text" placeholder="请填写联系人手机号" id="tel" name="link_tel" class="valid_tel myValid" value="${row.insurant.link_tel}"/>
                <b></b>
            </div>
        </li>
        <li>
            <p>详细地址</p>
            <div class="dfg">
                <i id="ert" class="wert"  >${row.insurant.reg_address}</i>
                <input id="address" style="display: none" class="valid_address myValid"  name="reg_address"value="${row.insurant.reg_address}"/>
                <b></b>
            </div>
        </li>
    </ul>
</div>
<div class="next-step">
    <span id="previous-step">上一步</span>
    <span class="ert">下一步</span>
</div>
</form>

<!--具体地址弹窗-->
<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="card">
    <h2>请选择证件类型</h2>
    <ul>
        <li>
            <p val="1">组织机构代码证</p>
        </li>
        <li>
            <p val="2">统一社会信用代码</p>
        </li>
        <li>
            <p val="7">营业执照</p>
        </li>
        <li>
            <p val="6">税务登记证</p>
        </li>
    </ul>
</div>

<!--是否返回弹窗-->
<div class="problem-popr">
    <img src="/static/weChat/images/problem.png" />
    <p>该订单未保存是否确认返回？</p>
    <div class="problem-bottom">
        <a href="javascript:;" id="problem-sure">确认</a>
        <a href="javascript:;" id="problem-cancel">取消</a>
    </div>
</div>


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

</body>
<script src="/static/weChat/js/jquery-1.8.3.min.js"></script>
<script src="/static/weChat/js/flexible.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 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>
    sr_height = parseInt($('#card').height()/2);
    $('#card').css({"margin-top":-sr_height+'px'});
    $('#id_type_show').click(function () {
        $('#card').show();
        $('.black-mask').show();
        $(this).blur();
    });
    $('#card ul li p').click(function () {
        $('#card ul li p').removeClass('on');
        $(this).addClass('on');
        var sd = $(this).text();
        $('#id_type_show').val(sd); //显示值
        $('#id_type').val($(this).attr("val")); //实际值
        $('#card').hide();
        $('.black-mask').hide();
        $(".valid_id_type").trigger("change");
    });

    //详细地址
    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();
        $('#address').val(ert);
        $('#ert').text(ert);
        $('.black-mask').hide();
        $(".valid_address").trigger("change");
    });

    //点击返回是否确认返回
    p_height = parseInt($('.problem-popr').height()/2);
    $('.problem-popr').css({"margin-top":-p_height+'px'});

    $('#previous-step').click(function () {
        $('.problem-popr').show();
        $('.black-mask').show();
    });

    $('#problem-sure').click(function () { //确认按钮
        $('.problem-popr').hide();
        $('.black-mask').hide();
        location.href="/weixin/order/zzx/zzx_write_order1?ins_insurance_slip_id=${p.ins_insurance_slip_id}";
    });
    $('#problem-cancel').click(function () { //返回按钮
        $('.problem-popr').hide();
        $('.black-mask').hide();
    });
</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_name_cn").bind("blur keyup",function(){//被保险人名称
        var r1 = isWrong($(this).val().trim()=="",this,"请输入被保险人名称"); if(!r1) return r1;
        var r2 = isWrong(!/^[\u4e00-\u9fa5\s,a-zA-Z,\（\）]{6,50}$/.test($(this).val()),this,"请输入6-50个中英文字母");
    });
    $(".valid_id_type").bind("change",function(){ //证件类型
        var r1 = isWrong($(this).val().trim()=="",this,"请选择证件类型"); if(!r1) return r1;
    });
    $(".valid_organization_code").bind("blur keyup",function(){ //证件号码
        var r1 = isWrong($(this).val().trim()=="",this,"请输入证件号码"); if(!r1) return r1;
        var id_type = $('#id_type').val();
        var flag = false;
        if(id_type == '7'){//营业执照
            flag = !/^[a-zA-Z0-9]{15,18}$/.test($(this).val());
        }else if(id_type == '6'){//税务登记证
            flag = !/^[a-zA-Z0-9]{15,18}$/.test($(this).val());
        }else if(id_type == '2'){//统一社会信用代码
            flag = !/^[a-zA-Z0-9]{18}$/.test($(this).val());
        }else {//组织机构代码证
            flag = !/^[a-zA-Z0-9]{9}$/.test($(this).val());
        }
        var r2 = isWrong(flag,this,"请根据实际证件填写正确的号码"); if(!r2) return r2;
    });
    $(".valid_link_name").bind("blur keyup",function(){ //联系人名
        var r1 = isWrong($(this).val().trim()=="",this,"请输入联系人名"); if(!r1) return r1;
        var r2 = isWrong(!/^[\u4e00-\u9fa5a-zA-Z]{1,12}$/.test($(this).val()),this,"请输入1-12个中英文");
    });
    $(".valid_tel").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_email").bind("blur keyup",function(){ //电子邮件
        var r1 = isWrong($(this).val().trim()=="",this,"请输入邮箱"); if(!r1) return r1;
        var r3 = isWrong($(this).val().length>20,this,"要求20个字符长度以内"); if(!r3) return r3;
        var r2 = isWrong(!/^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/.test($(this).val()),this,"请输入正确的email格式");
    });
    $(".valid_address").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个字符长度");
    });

    //提交保存
    $('.next-step .ert').click(function () {
        allright=true;
        $(".myValid").each(function(){ $(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_role_inpolicy_id = "${row.insurant.ins_role_inpolicy_id}";
            p.ins_mail_policy_id = "${row.ins_mail_policy.ins_mail_policy_id}";
            p.ins_insurance_slip_id = "${p.ins_insurance_slip_id}";
            $("#mask").show();
            g_ajax("/weixin/order/save/insurant",p,function(json){
                if (json.success == true) {
                    window.location.href="/weixin/order/zzx/zzx_write_order3?ins_insurance_slip_id="+json.msg;
                } else {
                    $("#mask").hide();
                    layer.open({content:json.msg,btn: '我知道了'})
                }
            },true);
        }else{
            layer.open({content:"请认真填写表单，再点击下一步",btn: '我知道了'})
        }
    });

    <%--var row = JSON.parse('${fns:toJson(row)}');--%>
//    g_ajax("/weixin/order/getByID",{},function(json){  row = json});
//    console.log(row);
    var id_type={"7":"营业执照","6":"税务登记证","1":"组织机构代码证","2":"统一社会信用代码"}, show="";
    if('${row.applicant.role_type}' == '1'||'${row.product_code}'.indexOf('ZZX-PAC')>-1||'${row.product_code}'.indexOf('ZZX-YA')>-1){
        var it = '${row.insurant.id_type}'; if(it == '') it = '${row.applicant.id_type}';
        var nc = '${row.insurant.name_cn}'; if(nc == '') nc = '${row.applicant.name_cn}';
        var oc = '${row.insurant.organization_code}'; if(oc == '') oc = '${row.applicant.organization_code}';
        var ln = '${row.insurant.link_name}'; if(ln == '') ln = '${row.applicant.link_name}';
        var lt = '${row.insurant.link_tel}'; if(lt == '') lt = '${row.applicant.link_tel}';
        var ra = '${row.insurant.reg_address}'; if(ra == '') ra = '${row.applicant.reg_address}';

        if(it!='') show=id_type[it];
        $("#id_type_show").val(show);
        $("#id_type").val(it);

        $('#name_cn').val(nc);
        $('#organization_code').val(oc);
        $('#link_name').val(ln);
        $('#tel').val(lt);
        $('#ert').html(ra);
        $('#address').val(ra);
    }else{
        if('${row.insurant.id_type}'!='') show=id_type['${row.insurant.id_type}'];
        $("#id_type_show").val(show);
    }
    if('${row.applicant.role_type}'=='2'&&'${row.product_code}'.indexOf('ZZX-ZA')>-1) {
        $('#p_p_1').html('参展商名称');
        $('#p_p_2').html('参展商证件类型');
        $('#p_p_3').html('参展商证件号码');
    }

    $(document).ready(function () {
        <%--g_ajax("/weixin/order/detail/debug/",{ins_insurance_slip_id:'${p.ins_insurance_slip_id}'},function(json){--%>
            <%--console.log(json);--%>
        <%--},true);--%>
        $("#mask").hide();
    })
</script>
</html>