<%@ 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 over-auto">
      <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 ">
            <input type="text" name="code" class="layui-input" value="${insurance.columns.item_no}" 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="proName" class="layui-input" value="${insurance.columns.project_name}" 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="dls" class="layui-input" value="${insurance.columns.trader_name}" 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="${insurance.columns.project_company_name}" 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="createDate" class="layui-input" value="<fmt:formatDate value="${insurance.columns.create_time}" pattern="yyyy-MM-dd HH:mm:ss"/>" 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="name" class="layui-input" value="${insurance.columns.tenant_name}" 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="adr" class="layui-input" value="${insurance.columns.province}${insurance.columns.city}${insurance.columns.area}${insurance.columns.address}" disabled>
          </div>
        </div>
      </div>
    </div>
    <div id="insuranceType over-auto">
      <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <ul class="layui-tab-title" id="changeTabId" lay-filter="changeTab" >
          <li class="layui-this">投保信息</li>
          <c:if test="${insurance.columns.partner_id ne '03'}"> <li>过程信息</li> </c:if>
        </ul>
        <div class="layui-tab-content">
          <div class="layui-tab-item layui-show" id="commonTab">
            <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 ">
                    <input type="text" name="code" class="layui-input" value="${insurance.columns.insurance_name}" 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="code" 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="code" class="layui-input" value="${insurance.columns.insurance_company_name}" disabled>
                  </div>
                </div>
                <c:if test="${insurance.columns.partner_id ne '03'}">
                  <div class="layui-inline layui-col-xs4">
                    <label class="layui-form-label w-130">投保人：</label>
                    <div class="layui-input-block ">
                      <input type="text" name="code" class="layui-input" value="${insurance.columns.policyholder}" 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="code" class="layui-input" value="${insurance.columns.insurant}" disabled>
                    </div>
                  </div>
                </c:if>
              </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" disabled name="code" class="layui-input" value="${insurance.columns.number}">
                  </div>
                </div>
                <c:if test="${insurance.columns.partner_id ne '03'}">
                  <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" disabled name="code" class="layui-input" value="${insurance.columns.insurance_money}">
                      <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" disabled name="code" class="layui-input" value="${insurance.columns.price}">
                      <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" disabled name="timeMin" class="layui-input" id="timeMin" placeholder="请选择" value="${insurance.columns.start_time}">
                    </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" disabled name="timeMax" class="layui-input" id="timeMax" placeholder="请选择" value="${insurance.columns.end_time}">
                    </div>
                  </div>
                </c:if>
              </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 " >
                    <c:if test="${insurance.columns.down_url ne null}">
                      <a class="h-32 lh-32 layui-span-unit" target="_blank" href="${commonStaticImgPath}${insurance.columns.down_url}" style="color: #2890ac;">下载</a>
                      <a class="h-32 lh-32 ml-10 layui-span-unit" onclick="previewUrl('${commonStaticImgPath}${insurance.columns.down_url}')"target="_blank"  style="color: #2890ac;">查看</a>
                      <c:if test="${insurance.columns.renewal_status eq '审批拒绝'}">
                        <a class="h-32 lh-32 ml-10 layui-span-unit" target="_blank" id="uploader" style="color: #2890ac;"> 上传</a>
                        <c:forEach items="${insurance.columns.down_url}" var="file" varStatus="vs">
                          <div  id="imgsDiv">
                            <a href="${commonStaticImgPath}${file}" download="${file}" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                            <input type="hidden" id="downUrl" name="downUrl" class="downUrl" value="${file}">
                          </div>
                        </c:forEach>
                      </c:if>

                    </c:if>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="layui-tab-item" id="processTab">
            <table class="layui-table" style="margin-bottom: 30px;">
              <colgroup>
                <col width="20%">
                <col width="15%">
                <col width="65%">
              </colgroup>
              <thead>
              <tr>
                <th>时间</th>
                <th>操作人</th>
                <th>描述</th>
              </tr>
              </thead>
              <tbody id="tableTr">
              <c:forEach items="${processList}" var="process">
                <tr>
                  <td>${process.d}</td>
                  <td>${process.p}</td>
                  <td>${process.c}</td>
                </tr>
              </c:forEach>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="operate-footer">
    <c:if test="${insurance.columns.renewal_status eq '审批拒绝'}">
      <button type="button" lay-submit lay-filter="confirm" id="confirm" class="layui-btn">提交</button>
    </c:if>
    <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/base64.js"></script>
<script type="text/javascript">
  //初始数据
  var $form;
  var form;
  var $;
  layui.config({
    base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['form', 'table', 'upload', 'jquery','laydate'], function () {
    $ = layui.jquery;
    form = layui.form;
    upload = layui.upload;
    laydate = layui.laydate;
    $form = $('form');

    form.on('select(insuredType)', function (data) {
      var insuredType = $(data.elem).val();
      if (insuredType == '0') {
        $(data.elem).parent("td").find("input[name='insuredAmount']").addClass("hide");
      } else {
        $(data.elem).parent("td").find("input[name='insuredAmount']").removeClass("hide");
      }
    });

    $("#changeTabId li").on("click",function(){
      $("#changeTabId li").removeClass("layui-this");
      $(this).addClass("layui-this");
      if ($(this).text() == '过程信息') {
        $("#commonTab").removeClass("layui-show");
        $("#processTab").addClass("layui-show");
      } else {
        $("#commonTab").addClass("layui-show");
        $("#processTab").removeClass("layui-show");
      }
    })

    form.on('submit(confirm)', function (obj) {
      var downUrl = $("#downUrl").val();
      var id = "${insurance.columns.id}";
      $.ajax({
        type: "POST",
        url: "${ctx}/customerEntry/noSystem/insurance/uploadInsuranceFile",
        data: {
          id: id,
          downUrl: downUrl
        },
        success: function (res) {
          if ('200' ==res.code) {
            parent.layer.msg("保存成功", {time: 2000});
            closeDiv();
            table.reload('test');
          } else {
            layer.msg(res.errMsg, {time: 1000});
          }
        },
        error: function (data) {
        }
      });
    });

    upload.render({
      elem: '#uploader',
      multiple:true,
      url: '${ctx}/common/uploadFile3',
      accept: 'file',
      before: function (obj) {

      },
      done: function (res) {
        //上传完毕回调
        let path = res.path;
        let index = path.lastIndexOf('/');
        let name = path.substring(index + 1);
        $("#imgsDiv").html("");
        let html = '<a href="${commonStaticImgPath}' + path + '" class="download-link">' + name + '</a>';
        html += '<input type="hidden" id="downUrl" name="downUrl" class="downUrl" value="' + path + '"/> </div>';
        $("#imgsDiv").append(html);
      },
      error: function () {
        //请求异常回调
      }
    });

  })



  function previewUrl(_url) {
    if (!checkUrl(_url)) {
      return false;
    }
    var base = new Base64();
    var b64Encoded = base.encode(_url);
    if(_url.endsWith('pdf')){
      window.open('http://47.98.203.224:8012/onlinePreview?url=' + encodeURIComponent(b64Encoded)+'&officePreviewType=pdf');
    }else{
      window.open('http://47.98.203.224:8012/onlinePreview?url=' + encodeURIComponent(b64Encoded));
    }
  }

  function checkUrl(url) {
    //url= 协议://(ftp的登录信息)[IP|域名](:端口号)(/或?请求参数)
    var strRegex = '^((https|http|ftp)://)'//(https或http或ftp)
            + '(([\\w_!~*\'()\\.&=+$%-]+: )?[\\w_!~*\'()\\.&=+$%-]+@)?' //ftp的user@  可有可无
            + '(([0-9]{1,3}\\.){3}[0-9]{1,3}' // IP形式的URL- 3位数字.3位数字.3位数字.3位数字
            + '|' // 允许IP和DOMAIN（域名）
            + '(localhost)|'	//匹配localhost
            + '([\\w_!~*\'()-]+\\.)*' // 域名- 至少一个[英文或数字_!~*\'()-]加上.
            + '\\w+\\.' // 一级域名 -英文或数字  加上.
            + '[a-zA-Z]{1,6})' // 顶级域名- 1-6位英文
            + '(:[0-9]{1,5})?' // 端口- :80 ,1-5位数字
            + '((/?)|' // url无参数结尾 - 斜杆或这没有
            + '(/[\\w_!~*\'()\\.;?:@&=+$,%#-]+)+/?)$';//请求参数结尾- 英文或数字和[]内的各种字符
    var re = new RegExp(strRegex, 'i');//i不区分大小写
    //将url做uri转码后再匹配，解除请求参数中的中文和空字符影响
    if (re.test(encodeURI(url))) {
      return (true);
    } else {
      return (false);
    }
  }

  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>
