<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="decorator" content="base"/>
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" type="text/css" href="${ctxPlugin}/static/css/reset.css" />
    <style>
        html{
            background-color: #fff;
        }
        .hide{
            display: none;
        }
        td .layui-form-select{
            width: 150px;
            margin-right: 15px;
            float: left;
        }
        .load-icon{background: url('${ctxPlugin}/static/img/shili_img.png') center center no-repeat; width: 12px; height: 12px; display: inline-block; border-radius: 50%;
            vertical-align: text-bottom;transform: translate(0px, -1px);margin-right: 2px;}

        .w-130{width: 110px;}
        .w-130+.layui-input-block{margin-left: 120px;}
    </style>
</head>
<body>
<div class="layui-form">
    <div class="layui-card">
        <div class="layui-card-body pt-20 pb-40">
            <div class="layui-col-xs12 form-box">
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">电站编码：</label>
                    <div class="layui-input-block ">
                        <select name="powerStationCode" id="powerStationCode" lay-verify="required" lay-filter="powerStationCode" lay-search>
                            <option value="">请选择</option>
                            <c:forEach items="${entryS}" var="entry">
                                <option data-id="${entry.columns.id}" data-projectName="${entry.columns.project_name}"
                                        data-traderName="${entry.columns.trader_name}" data-projectCompanyName="${entry.columns.project_company_name}"
                                        data-filingType="${entry.columns.filing_type}" data-createTime="${entry.columns.create_time}"
                                        data-tenantName="${entry.columns.tenant_name}" data-mobile="${entry.columns.mobile}"
                                        data-idCode="${entry.columns.id_code}" data-province="${entry.columns.province}"
                                        data-city="${entry.columns.city}" data-area="${entry.columns.area}"
                                        data-street="${entry.columns.street}" data-address="${entry.columns.address}"
                                        value="${entry.columns.power_station_code}" >${entry.columns.power_station_code}</option>
                            </c:forEach>
                        </select>
<%--                        <div id="stationCode"></div>--%>
                        <input type="text"  name="entryId" lay-verify="entryId" class="layui-input hide" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">产品名称：</label>
                    <div class="layui-input-block ">
                        <input type="text"  name="projectName" class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">代理商：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="traderName" class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">项目公司：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="projectCompanyName"  class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">备案类型：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="filingType" class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">创建时间：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="createTime" class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">业主姓名：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="tenantName"  class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">联系电话：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="mobile"  class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">身份证号：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="idCode" class="layui-input" value="" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs8">
                    <label class="layui-form-label w-130">安装地址：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="address" class="layui-input" value="" disabled>
                    </div>
                </div>
            </div>
        </div>
        <div class="clear-both">
            <p class="layui-elem-quote" style="margin: 0px 0px 0px 10px">投保信息</p>
            <div class="layui-form mt-20 pr-20">
                <div class="layui-col-xs12 form-box">
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>保险名称：</label>
                        <div class="layui-input-block ">
                            <select name="insuranceId" id="insuranceId" lay-verify="insuranceId" lay-filter="insuranceId"  lay-search>
                                <option value="">请选择</option>
                                <c:forEach var="ins" items="${insuranceList}">
                                    <option data-companyName="${ins.columns.company_name}" data-insuranceType="${ins.columns.type}" data-policyholder="${ins.columns.policyholder}" data-insurant="${ins.columns.insurant}" value="${ins.columns.id}" >${ins.columns.name}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130">保险类型：</label>
                        <div class="layui-input-block ">
                            <input type="text" name="insuranceType"  placeholder="请输入" class="layui-input" value="" disabled>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130">保险公司：</label>
                        <div class="layui-input-block ">
                            <input type="text"  name="insuranceCompanyName" placeholder="请输入" class="layui-input" value="" disabled>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130">投保人：</label>
                        <div class="layui-input-block ">
                            <input type="text" name="policyholder" placeholder="请输入" class="layui-input" value="" disabled>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs8">
                        <label class="layui-form-label w-130">被保人：</label>
                        <div class="layui-input-block ">
                            <input type="text" name="insurant" placeholder="请输入" class="layui-input" value="" disabled>
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs12 form-box">
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>保险编号：</label>
                        <div class="layui-input-block ">
                            <input type="text"  name="number" autocomplete="off" lay-verify="number" placeholder="请输入" class="layui-input" value="">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>投保金额：</label>
                        <div class="layui-input-block ">
                            <input type="text"  name="insuranceMoney" autocomplete="off" lay-verify="insuranceMoney"  placeholder="请输入" class="layui-input" value="">
                            <span class="pos-a h-32 lh-32 layui-span-unit">元</span>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>保费：</label>
                        <div class="layui-input-block ">
                            <input type="text"  name="price" autocomplete="off" lay-verify="price"  placeholder="请输入" class="layui-input" value="">
                            <span class="pos-a h-32 lh-32 layui-span-unit">元</span>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>保险开始日期：</label>
                        <div class="layui-input-block ">
                            <input type="text" name="startTime" autocomplete="off" lay-verify="startTime"   class="layui-input" id="timeMin" placeholder="请选择" value="">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-xs4">
                        <label class="layui-form-label w-130"><i class="red">*</i>保险结束日期：</label>
                        <div class="layui-input-block ">
                            <input type="text" name="endTime" autocomplete="off" lay-verify="endTime"  class="layui-input" id="timeMax" placeholder="请选择" value="">
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs12 form-box over-auto mb-50">
                    <div class="layui-inline layui-col-xs12">
                        <label class="layui-form-label w-130">保单：</label>
                        <div class="layui-input-block ">
                            <div class="display-flex">
                                <a class="upload-txt hide" id="showA" target="_blank" href="${commonStaticImgPath}${insurance.columns.down_url}">查看</a>
                                <a href="javascript:;" class="upload-txt ml-30" id="uploader">【上传】</a>
                            </div>
                        </div>
                        <div class="red" style="padding-left: 75px;">仅支持pdf格式文件</div>
                        <input type="text" class="hide" name="downUrl" lay-verify="downUrl" value=""/>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="operate-footer">
        <button type="button" lay-submit lay-filter="confirm" id="confirm" class="layui-btn">提交</button>
        <button type="button" class="layui-btn layui-btn-primary " onclick="closeDiv();" >关闭</button>
    </div>
</div>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/data.js"></script>
<script src="${ctxPlugin}/lib/xm-select.js"></script>
<script type="text/javascript">
    //初始数据
    var $form;
    var form;
    var $;
    layui.use(['form', 'table', 'upload', 'jquery','laydate'], function () {
        $ = layui.jquery;
        form = layui.form;
        upload = layui.upload;
        laydate = layui.laydate;
        $form = $('form');

        var timeMin = laydate.render({
            elem: '#timeMin'
            ,done: function(value, date){
                //更新结束日期的最小日期
                timeMax.config.min = lay.extend({}, date, {
                    month: date.month - 1
                });
            }
        });
        var timeMax = laydate.render({
            elem: '#timeMax'
            ,done: function(value, date){
                //更新开始日期的最大日期
                timeMin.config.max = lay.extend({}, date, {
                    month: date.month - 1
                });
            }
        });

        form.verify({
            entryId:function(value,item){
                if(!$.trim(value)){
                    return "电站不能为空,请选择电站！";
                }
            },
            insuranceId:function(value,item){
                if(!$.trim(value)){
                    return "保险名称不能为空,请选择保险名称！";
                }
            },
            number:function(value,item){
                if(!$.trim(value)){
                    return "编号不能为空,请输入保险编号！";
                }
            },
            insuranceMoney:function(value,item){
                if(!$.trim(value)){
                    return "保险金额不能为空,请输入保险金额！";
                }
            },
            price:function(value,item){
                if (!$.trim(value)) {
                    return "保费不能为空,请输入保费！";
                }
            },
            startTime:function(value,item){
                if(!$.trim(value)){
                    return "开始日期不能为空,请选择开始日期！";
                }
            },
            endTime:function(value,item){
                if(!$.trim(value)){
                    return "结束日期不能为空,请选择结束日期！";
                }
            },
            downUrl:function(value,item){
                if(!$.trim(value)){
                    return "保单不能为空,请上传保单！";
                }
            }
        });

        //执行实例
        upload.render({
            elem: '#uploader' //绑定元素
            ,accept:'file'
            ,exts:'pdf'
            , url: '${ctx}/common/uploadFile' //上传接口
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {

                });
            }
            , done: function (res) {
                console.log(res.path);
                //上传完毕回调
                $("input[name='downUrl']").val(res.path);
                $("#showA").attr("href", "${commonStaticImgPath}" + res.path);
                $("#showA").removeClass("hide");
            }
            , error: function () {
                //请求异常回调
            }
        });

        form.on('submit(confirm)', function (data) {
            $.ajax({
                url: '${ctx}/customerEntry/insurance/doAdd',
                method: 'post',
                data: JSON.stringify(data.field) ,
                dataType: 'JSON',
                contentType:"application/json",
                success: function (res) {
                    if (res.code == "200") {
                        parent.layer.msg("保存成功", {time: 2000});
                        closeDiv();
                        parent.table.reload('test');
                    } else {
                        layer.msg(res.errMsg, {time: 1000});
                    }
                },
                error: function (data) {
                }
            });
        });

        form.on('select(insuranceId)', function (data) {
            var companyName = $(data.elem).find("option:selected").attr("data-companyname");
            var insuranceType = $(data.elem).find("option:selected").attr("data-insuranceType");
            var policyholder = $(data.elem).find("option:selected").attr("data-policyholder");
            var insurant = $(data.elem).find("option:selected").attr("data-insurant");
            // 0.财产 1.商业 2.交强 3.其他',
            if(insuranceType=='0'){
                $("input[name='insuranceType']").val("财产险");
            }else if(insuranceType=='1'){
                $("input[name='insuranceType']").val("商业险");
            }else if(insuranceType=='2'){
                $("input[name='insuranceType']").val("交强险");
            }else if(insuranceType=='3'){
                $("input[name='insuranceType']").val("其他");
            }
            $("input[name='insuranceCompanyName']").val(companyName);
            $("input[name='policyholder']").val(policyholder);
            $("input[name='insurant']").val(insurant);
        });

        form.on('select(powerStationCode)', function (data) {
            var entryId = $(data.elem).find("option:selected").attr("data-id");
            var projectName = $(data.elem).find("option:selected").attr("data-projectName");
            var traderName = $(data.elem).find("option:selected").attr("data-traderName");
            var projectCompanyName = $(data.elem).find("option:selected").attr("data-projectCompanyName");
            var filingType = $(data.elem).find("option:selected").attr("data-filingType");
            var createTime = $(data.elem).find("option:selected").attr("data-createTime");
            var tenantName = $(data.elem).find("option:selected").attr("data-tenantName");
            var mobile = $(data.elem).find("option:selected").attr("data-mobile");
            var idCode = $(data.elem).find("option:selected").attr("data-idCode");
            var province = $(data.elem).find("option:selected").attr("data-province");
            var city = $(data.elem).find("option:selected").attr("data-city");
            var area = $(data.elem).find("option:selected").attr("data-area");
            var street = $(data.elem).find("option:selected").attr("data-street");
            var address = $(data.elem).find("option:selected").attr("data-address");

            $("input[name='entryId']").val(entryId);
            $("input[name='projectName']").val(projectName);
            $("input[name='traderName']").val(traderName);
            $("input[name='projectCompanyName']").val(projectCompanyName);
            //备案类型:1.农户备案 2.项目公司备案
            if (filingType == '1') {
                $("input[name='filingType']").val("农户备案");
            } else {
                $("input[name='filingType']").val("项目公司备案");
            }
            $("input[name='createTime']").val(createTime);
            $("input[name='tenantName']").val(tenantName);
            $("input[name='mobile']").val(mobile);
            $("input[name='idCode']").val(idCode);
            if (province == city){
                $("input[name='address']").val(province + area + street + address);
            }else {
                $("input[name='address']").val(province + city + area + street + address);
            }
        });

        <%--var stationCodeXm = xmSelect.render({--%>
        <%--    el: '#stationCode',--%>
        <%--    name: 'stationCode',--%>
        <%--    radio: true,--%>
        <%--    size:'mini',--%>
        <%--    tips: '请至少输入3个字符查询',--%>
        <%--    clickClose: true,--%>
        <%--    filterable: true,--%>
        <%--    remoteSearch: true,--%>
        <%--    remoteMethod: function (val, cb, show) {--%>
        <%--        if (!isBlank(val) && val.length >= 3) {--%>
        <%--            $.ajax({--%>
        <%--                type: 'post',--%>
        <%--                url: '${ctx}/customerEntry/insurance/selectEntryForInsurance/' + val,--%>
        <%--                async: false,--%>
        <%--                dataType: 'json',--%>
        <%--                success: function (d) {--%>
        <%--                    console.log(d);--%>
        <%--                    var arr = [];--%>
        <%--                    for (var i = 0; i < d.length; i++) {--%>
        <%--                        var data = {};--%>
        <%--                        data.name = d[i].power_station_code;--%>
        <%--                        data.value = d[i].id;--%>
        <%--                        data.origin = d[i];--%>
        <%--                        arr.push(data);--%>
        <%--                    }--%>
        <%--                    cb(arr);--%>
        <%--                }--%>
        <%--            });--%>
        <%--        } else {--%>
        <%--            cb([]);--%>
        <%--        }--%>
        <%--    },--%>
        <%--    on: function (data) {--%>
        <%--        if (data.isAdd && data.arr.length > 0) {--%>
        <%--            var d = data.arr[0].origin;--%>
        <%--            $("input[name='entryId']").val(d.id);--%>
        <%--            $("input[name='projectName']").val(d.project_name);--%>
        <%--            $("input[name='traderName']").val(d.trader_name);--%>
        <%--            $("input[name='projectCompanyName']").val(d.project_company_name);--%>
        <%--            //备案类型:1.农户备案 2.项目公司备案--%>
        <%--            if (d.filing_type == '1') {--%>
        <%--                $("input[name='filingType']").val("农户备案");--%>
        <%--            } else {--%>
        <%--                $("input[name='filingType']").val("项目公司备案");--%>
        <%--            }--%>
        <%--            $("input[name='createTime']").val(d.create_time);--%>
        <%--            $("input[name='tenantName']").val(d.tenant_name);--%>
        <%--            $("input[name='mobile']").val(d.mobile);--%>
        <%--            $("input[name='idCode']").val(d.id_code);--%>
        <%--            $("input[name='address']").val(d.province + d.city + d.area + d.street + d.address);--%>
        <%--        }--%>
        <%--    }--%>
        <%--});--%>

    })

    function  closeDiv() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index);
    }

    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }

</script>
</body>
</html>
