<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>完工信息</title>
    <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" type="text/css" href="${ctxPlugin}/static/css/reset.css"/>
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/dist/viewer.css" media="all">
    <style>
        html {
            background-color: #fff;
            padding-bottom: 50px;
        }
        .layui-tab-title{
            margin: 0 0 0 20px;
            border-color: #fff;
        }
        .layui-tab-content{
            margin: 0 0 0 20px;
        }
        .bj-img {
            margin-right: 0;
        }
        .array {
            margin-right: 5px;
        }
        .blank-img {
            background: url('${ctxPlugin}/static/imgs/blankImg.png') center center no-repeat;
            width: 80px;
            height: 80px;
            display: inline-block;
        }

        .materialTable td, th {
            text-align: center !important;
        }

        .download-link {
            display: inline-block;
            padding: 8px 16px;
            color: #007bff;
            text-decoration: none;
            border-radius: 4px;
        }
        .sl-img{
            width: 80px;
            height: 80px;
            border: 1px solid #ddd;
            float: left;
            margin-right: 10px;
            margin-bottom: 10px;
            position: relative;
        }
        .sl-img > img {
            width: 100%;
            height: 100%;
        }
        .sl-img > span {
            position: absolute;
            right: 0;
            bottom: 0;
            background-color: #adacac;
            width: 100%;
            height: 20px;
            line-height: 20px;
            text-align: center;
            color: #fff;
            cursor: pointer;
            display: block;
        }

        .file-container {
            display: flex;
            align-items: center;
        }

        .img-wrapper {
            margin-right: 10px; /* 调整图片和文件名之间的间距 */
        }

    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="order-win layui-form" id="LAY_app">
        <div class="layui-card-body pt-20 pb-40">
            <div class="layui-col-xs12 form-box">
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label w-130">电站编码：</label>
                    <div class="layui-input-block ">
                        <input type="text" autocomplete="off" disabled  name="stationCode" lay-verify="stationCode" class="layui-input" value="${customerEntry.powerStationCode}">
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label w-130">产品编号：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="projectName"  class="layui-input" value="${customerEntry.projectId}" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label w-130">项目公司：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="projectCompanyName" class="layui-input" value="${customerEntry.projectCompanyName}" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label w-130">电站状态：</label>
                    <div class="layui-input-block ">
                        <input type="text" disabled class="layui-input layui-bg-gray"
                        <c:choose>
                        <c:when test="${customerEntry.status eq 'a'}">
                               value="已完成"
                        </c:when>
                        </c:choose>
                        >
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label w-130">代理商：</label>
                    <div class="layui-input-block ">
                        <input type="text" name="traderName" class="layui-input" value="${customerEntry.traderName}" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label">业务员：</label>
                    <div class="layui-input-block ">
                        <input type="text"  name="creator" class="layui-input" value="${customerEntry.creator}" disabled>
                    </div>
                </div>
                <div class="layui-inline layui-col-xs3">
                    <label class="layui-form-label">创建时间：</label>
                    <div class="layui-input-block ">
                        <input type="text"  name="creator" class="layui-input" value="<fmt:formatDate value="${customerEntry.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/>" disabled>
                    </div>
                </div>

            </div>
        </div>
        <div class="clear-both">
            <p class="layui-elem-quote" style="margin: 0px 0px 0px 10px">完工信息</p>
            <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                <ul class="layui-tab-title">
                    <li class="layui-this">安装物料</li>
                    <li>完工资料</li>
                </ul>
                <div style="display: flex;">
                    <div style="margin-left: 170px">物料安装状态：<input type="checkbox" name="materialFixFlag" title="安装已完成"
                                                                        lay-skin="primary" <c:if test="${customerEntry.materialFixFlag eq '1'}">checked</c:if> disabled/>
                    </div>
                    <div style="margin-left: 20px">实际安装容量(W)：<fmt:formatNumber value="${customerEntry.actualCapacity * 1000}" pattern="#"/></div>
                </div>
                <div class="layui-tab-content">
                    <div style="display: flex;">
                        <div style="width: 10%">
                            <div class="layui-form-item" style="width: 10%; margin-bottom: 5px;">
                                <button type="button" style="width: 80px;" class="layui-btn layui-btn-primary"
                                        onclick="changeMaterialTab(0)">组件
                                </button>
                            </div>
                            <div class="layui-form-item" style="width: 10%; margin-bottom: 5px;">
                                <button type="button" style="width: 80px;" class="layui-btn layui-btn-primary"
                                        onclick="changeMaterialTab(1)">逆变器
                                </button>
                            </div>
                            <div class="layui-form-item" style="width: 10%; margin-bottom: 5px;">
                                <button type="button" style="width: 80px;" class="layui-btn layui-btn-primary"
                                        onclick="changeMaterialTab(2)">其它
                                </button>
                            </div>
                        </div>
                        <div style="width: 90%;">
                            <table class="layui-table materialTable" style="margin: 0 10px 0 0;">
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>物料代码</th>
                                    <th>物料名称</th>
                                    <th>物料规格</th>
                                    <th>品牌</th>
                                    <th>物料条码</th>
                                </tr>
                                </thead>
                                <tbody>
                                <c:forEach items="${zjList}" varStatus="vs" var="material">
                                    <tr>
                                        <td>${vs.count}</td>
                                        <td>${material.columns.code}</td>
                                        <td>${material.columns.name}</td>
                                        <td>${material.columns.spec}</td>
                                        <td>${material.columns.brand}</td>
                                        <td>${material.columns.barcode}</td>
                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                            <table class="layui-table materialTable layui-hide" style="margin: 0 10px 0 0;">
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>物料代码</th>
                                    <th>物料名称</th>
                                    <th>物料规格</th>
                                    <th>品牌</th>
                                    <th>物料条码</th>
                                    <th>SN码</th>
                                    <th>通讯棒SN码</th>
                                </tr>
                                </thead>
                                <tbody>
                                <c:forEach items="${nbqList}" varStatus="vs" var="material">
                                    <tr>
                                        <td>${vs.count}</td>
                                        <td>${material.columns.code}</td>
                                        <td>${material.columns.name}</td>
                                        <td>${material.columns.spec}</td>
                                        <td>${material.columns.brand}</td>
                                        <td>${material.columns.barcode}</td>
                                        <td>${material.columns.nbq_sn}</td>
                                        <td>${material.columns.sn}</td>
                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                            <table class="layui-table materialTable layui-hide" style="margin: 0 10px 0 0;">
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>物料代码</th>
                                    <th>物料名称</th>
                                    <th>物料规格</th>
                                    <th>品牌</th>
                                    <th>数量</th>
                                </tr>
                                </thead>
                                <tbody>
                                <c:forEach items="${otherList}" varStatus="vs" var="material">
                                    <tr>
                                        <td>${vs.count}</td>
                                        <td>${material.columns.code}</td>
                                        <td>${material.columns.name}</td>
                                        <td>${material.columns.spec}</td>
                                        <td>${material.columns.brand}</td>
                                        <td>${material.columns.amount}</td>
                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="layui-tab-content layui-hide">
                    <c:set var="indexNum" value="1"/>
                    <table class="layui-table" style="margin: 0 10px 0 0;">
                        <tr style="height: 50px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>项目备案证(1-4张)</td>
                            <td width="80%">
                                <div class=" layui-col-lg3 layui-col-sm3  layui-input-inline img-box" style="margin-left: 20px;">
                                    <div style="display: flex">
                                        <div id="imgsDiv1">
                                            <div  id="uploader1" <c:if test="${filingDocumentPhotoCount >= 4}">style="display: none"</c:if>>
                                                <span style="color:blue;cursor: pointer" id="uploader1">上传</span>
                                            </div>
                                            <c:set var="filingDocumentPhotoCount" value="${filingDocumentPhotoCount}"/>
                                            <c:if test="${not empty report.otherFiles}">
                                                <c:forEach items="${report.otherFiles}" var="file" varStatus="vs">
                                                    <div>
                                                        <span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,'uploader1')"></span>
                                                        <a style="color:#2890ac;" target="_blank" onclick="previewUrl('${file}')" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                                                        <input type="hidden" name="filingDocumentPhoto" class="filingDocumentPhoto" value="${file}">
                                                    </div>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                    </div>
                                </div>
<%--                                <div class="layui-col-lg3 layui-col-sm3 ">--%>
<%--                                    <label class="layui-form-label"><c:if test="${customerEntry.filingType eq '2'}"><i class="mark">*</i></c:if>备案代码：</label>--%>
<%--                                    <div class="layui-input-block">--%>
<%--                                        <input type="text" name="filingDocumentCode" id="filingDocumentCode" autocomplete="off"  value="${surveyRecord.filingDocumentCode}" class="layui-input">--%>
<%--                                    </div>--%>
<%--                                </div>--%>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 50px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>农户合同</td>
                            <td width="80%">
                                <div class=" layui-col-lg3 layui-col-sm3  layui-input-inline img-box" style="margin-left: 20px;">
                                    <div style="display: flex">
                                        <div id="imgsDiv2">
                                            <div  id="uploader2" <c:if test="${discloseDocImgCount >= 4}">style="display: none"</c:if>>
                                                <span style="color:blue;cursor: pointer" id="uploader1">上传</span>
                                            </div>
                                            <c:set var="discloseDocImgCount" value="${discloseDocImgCount}"/>
                                            <c:if test="${not empty report.discloseDocImg}">
                                                <c:forEach items="${report.discloseDocImg}" var="file" varStatus="vs">
                                                    <div>
                                                        <span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,'uploader1')"></span>
                                                        <a style="color:#2890ac;" target="_blank" onclick="previewUrl('${file}')" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                                                        <input type="hidden" name="discloseDocImg" class="discloseDocImg" value="${file}">
                                                    </div>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 50px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>工程安装一切险</td>
                            <td width="80%">
                                <div class=" layui-col-lg3 layui-col-sm3  layui-input-inline img-box" style="margin-left: 20px;">
                                    <div style="display: flex">
                                        <div id="imgsDiv3">
                                            <div  id="uploader3" <c:if test="${insuranceFilesCount >= 4}">style="display: none"</c:if>>
                                                <span style="color:blue;cursor: pointer" id="uploader1">上传</span>
                                            </div>
                                            <c:set var="insuranceFilesCount" value="${insuranceFilesCount}"/>
                                            <c:if test="${not empty customerEntry.insuranceFiles}">
                                                <c:forEach items="${customerEntry.insuranceFiles}" var="file" varStatus="vs">
                                                    <div>
                                                        <span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,'uploader3')"></span>
                                                        <a style="color:#2890ac;" target="_blank" onclick="previewUrl('${file}')" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                                                        <input type="hidden" name="insuranceFiles" class="insuranceFiles" value="${file}">
                                                    </div>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>组件铭牌照片(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv23">
                                            <c:set var="zjPlateImgCount" value="0"/>
                                            <c:if test="${not empty report.zjPlateImg}">
                                                <c:forEach var="img" items="${report.zjPlateImg.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader23')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="zjPlateImg" class="zjPlateImg" value="${img}">
                                                    </div>
                                                    <c:set var="zjPlateImgCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${zjPlateImgCount >=9}">hide</c:if>" id="uploader23">
                                            <img src="" alt="img placeholder" id="zjPlateImg">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>组件航拍俯视图(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv12">
                                            <c:set var="zjImg5Count" value="0"/>
                                            <c:if test="${not empty report.zjImg5}">
                                                <c:forEach var="img" items="${report.zjImg5.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader12')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="zjImg5" class="zjImg5" value="${img}">
                                                    </div>
                                                    <c:set var="zjImg5Count" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${zjImg5Count >=9}">hide</c:if>" id="uploader12">
                                            <img src="" alt="img placeholder" id="zjImg5">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>逆变器安装图-整体外观及走线及采集器（离地高度）(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv19">
                                            <c:set var="dcImgsCount" value="0"/>
                                            <c:if test="${not empty report.dcImgs}">
                                                <c:forEach var="img" items="${report.dcImgs.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader19')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="dcImgs" class="dcImgs" value="${img}">
                                                    </div>
                                                    <c:set var="dcImgsCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${dcImgsCount >=9}">hide</c:if>" id="uploader19">
                                            <img src="" alt="img placeholder" id="dcImgs">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>逆变器安装图-铭牌(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv22">
                                            <c:set var="nbqPlateImgCount" value="0"/>
                                            <c:if test="${not empty report.nbqPlateImg}">
                                                <c:forEach var="img" items="${report.nbqPlateImg.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader22')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="nbqPlateImg" class="nbqPlateImg" value="${img}">
                                                    </div>
                                                    <c:set var="nbqPlateImgCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${nbqPlateImgCount >=9}">hide</c:if>" id="uploader22">
                                            <img src="" alt="img placeholder" id="nbqPlateImg">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>并网箱安装图-外观及走线（离地高度）(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
<%--                                        <c:forEach items="${reflist}" var="ref">--%>
<%--                                            <c:choose>--%>
<%--                                                <c:when test="${ref.itemCode eq 'nbq_zb_img'}">--%>
<%--                                                    <c:forEach var="img" items="${ref.list}">--%>
<%--                                                        <div class="sl-img">--%>
<%--                                                            <img src="${commonStaticImgPath}${img.imgsValue}">--%>
<%--                                                            <span class="imgsDesc">示例图</span>--%>
<%--                                                        </div>--%>
<%--                                                    </c:forEach>--%>
<%--                                                </c:when>--%>
<%--                                            </c:choose>--%>
<%--                                        </c:forEach>--%>
                                        <div id="imgsDiv20">
                                            <c:set var="nbqZbImgCount" value="0"/>
                                            <c:if test="${not empty report.nbqZbImg}">
                                                <c:forEach var="img" items="${report.nbqZbImg.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader20')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="nbqZbImg" class="nbqZbImg" value="${img}">
                                                    </div>
                                                    <c:set var="nbqZbImgCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${nbqZbImgCount >=9}">hide</c:if>" id="uploader20">
                                            <img src="" alt="img placeholder" id="nbqZbImg">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>并网箱安装图-并网箱内部全景(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv18">
                                            <c:set var="bwInnerImgCount" value="0"/>
                                            <c:if test="${not empty report.bwInnerImg}">
                                                <c:forEach var="img" items="${report.bwInnerImg.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader18')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="bwInnerImg" class="bwInnerImg" value="${img}">
                                                    </div>
                                                    <c:set var="bwInnerImgCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${bwInnerImgCount >=9}">hide</c:if>" id="uploader18">
                                            <img src="" alt="img placeholder" id="bwInnerImg">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>支架类(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv8">
                                            <c:set var="zjImg1Count" value="0"/>
                                            <c:if test="${not empty report.zjImg1}">
                                                <c:forEach var="img" items="${report.zjImg1.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader8')"></span>
                                                        <img src="${NHFileUrl}${img}" height="700" width="1200">
                                                        <input type="hidden" name="zjImg1" class="zjImg1" value="${img}">
                                                    </div>
                                                    <c:set var="zjImg1Count" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${zjImg1Count >=9}">hide</c:if>" id="uploader8">
                                            <img src="" alt="img placeholder" id="zjImg1">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>线缆走向（屋顶、下墙）、线缆保护管（或桥架）敷设及固定照片(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv15">
                                            <c:set var="sizeMeasureImgsCount" value="0"/>
                                            <c:if test="${not empty report.sizeMeasureImgs}">
                                                <c:forEach var="img" items="${report.sizeMeasureImgs.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader15')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="sizeMeasureImgs" class="sizeMeasureImgs" value="${img}">
                                                    </div>
                                                    <c:set var="sizeMeasureImgsCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${sizeMeasureImgsCount >=9}">hide</c:if>" id="uploader15">
                                            <img src="" alt="img placeholder" id="sizeMeasureImgs">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>接地极图-并网箱、逆变器安装接地极(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv14">
                                            <c:set var="componentImg3Count" value="0"/>
                                            <c:if test="${not empty report.componentImg3}">
                                                <c:forEach var="img" items="${report.componentImg3.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader14')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="componentImg3" class="componentImg3" value="${img}">
                                                    </div>
                                                    <c:set var="componentImg3Count" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${componentImg3Count >=9}">hide</c:if>" id="uploader14">
                                            <img src="" alt="img placeholder" id="componentImg3">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>接地极图-接地电阻阻值(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv30">
                                            <c:set var="jdImg6Count" value="0"/>
                                            <c:if test="${not empty report.jdImg6}">
                                                <c:forEach var="img" items="${report.jdImg6.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader30')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="jdImg6" class="jdImg6" value="${img}">
                                                    </div>
                                                    <c:set var="jdImg6Count" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${jdImg6Count >=9}">hide</c:if>" id="uploader30">
                                            <img src="" alt="img placeholder" id="jdImg6">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                        <tr style="height: 100px">
                            <td width="15%">${indexNum}、<i class="mark">*</i>防水措施图-其他图片(1-9张)</td>
                            <td width="80%">
                                <div class="layui-input-block img-box" style="margin-left: 20px;">
                                    <div style="display: flex;flex-wrap: wrap;">
                                        <div id="imgsDiv9">
                                            <c:set var="zjImg2Count" value="0"/>
                                            <c:if test="${not empty report.zjImg2}">
                                                <c:forEach var="img" items="${report.zjImg2.split(',')}" varStatus="vs">
                                                    <div class="bj-img imgSpan">
                                                        <span class="layui-icon-close layui-icon" onclick="delImg(this,'uploader9')"></span>
                                                        <img src="${img}" height="700" width="1200">
                                                        <input type="hidden" name="zjImg2" class="zjImg2" value="${img}">
                                                    </div>
                                                    <c:set var="zjImg2Count" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                        <div class="upload-container <c:if test="${zjImg2Count >=9}">hide</c:if>" id="uploader9">
                                            <img src="" alt="img placeholder" id="zjImg2">
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <c:set var="indexNum" value="${indexNum+1}"/>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="layui-form-item text-c operate-footer">
    <button type="button" class="layui-btn" id="save">保存</button>
    <button class="layui-btn layui-btn-primary" onclick="closeSelf()">取消</button>
</div>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/dist/viewer.js"></script>
<script src="${ctxPlugin}/lib/base64.js"></script>
<script>

    //图片查看效果
    var viewer = new Viewer(document.getElementById('LAY_app'));
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'element', 'tableExt', 'jquery', 'layer', 'laypage', 'laydate', 'form','upload'], function () {
        $ = layui.$;
        tableExt = layui.tableExt;
        layer = layui.layer;
        laypage = layui.laypage;
        laydate = layui.laydate;
        form = layui.form;
        upload = layui.upload;
        table = tableExt.getLayTable();
        var element = layui.element;
        element.on('tab(docDemoTabBrief)', function (data) {
            $('.layui-tab-content').eq(data.index).removeClass('layui-hide').siblings('.layui-tab-content').addClass('layui-hide');
        });

        upload.render({
            elem: '#uploader1',
            url: '${ctx}/common/uploadFile3',
            accept: 'file',
            before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            },
            done: function (res) {
                //上传完毕回调
                let path = res.path;
                let index = path.lastIndexOf('/');
                let name = path.substring(index + 1);
                let imgCount = $("#imgsDiv1").find(".filingDocumentPhoto").length;
                if ((imgCount + 1) >= 4) {
                    $("#uploader1").hide();
                }
                let html = '<div><span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,\'uploader1\')"></span>';
                html += '<a style="color:#2890ac;" href="${commonStaticImgPath}' + path + '" download="' + path + '" class="download-link">' + name + '</a>';
                html += '<input type="hidden" name="filingDocumentPhoto" class="filingDocumentPhoto" value="${commonStaticImgPath}' + path + '"/> </div>';
                $("#imgsDiv1").append(html);
            },
            error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader2',
            url: '${ctx}/common/uploadFile3',
            accept: 'file',
            before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            },
            done: function (res) {
                //上传完毕回调
                let path = res.path;
                let index = path.lastIndexOf('/');
                let name = path.substring(index + 1);
                let imgCount = $("#imgsDiv2").find(".discloseDocImg").length;
                if ((imgCount + 1) >= 4) {
                    $("#uploader2").hide();
                }
                let html = '<div><span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,\'uploader2\')"></span>';
                html += '<a style="color:#2890ac;" href="${commonStaticImgPath}' + path + '" download="' + path + '" class="download-link">' + name + '</a>';
                html += '<input type="hidden" name="discloseDocImg" class="discloseDocImg" value="${commonStaticImgPath}' + path + '"/> </div>';
                $("#imgsDiv2").append(html);
            },
            error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader3',
            url: '${ctx}/common/uploadFile3',
            accept: 'file',
            before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            },
            done: function (res) {
                //上传完毕回调
                let path = res.path;
                let index = path.lastIndexOf('/');
                let name = path.substring(index + 1);
                let imgCount = $("#imgsDiv3").find(".insuranceFiles").length;
                if ((imgCount + 1) >= 4) {
                    $("#uploader3").hide();
                }
                let html = '<div><span style="color: red" class="layui-icon-close layui-icon" onclick="delImg(this,\'uploader1\')"></span>';
                html += '<a style="color:#2890ac;" href="${commonStaticImgPath}' + path + '" download="' + path + '" class="download-link">' + name + '</a>';
                html += '<input type="hidden" name="insuranceFiles" class="insuranceFiles" value="${commonStaticImgPath}' + path + '"/> </div>';
                $("#imgsDiv3").append(html);
            },
            error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader8' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg2(res.path, "uploader8", "imgsDiv8", "zjImg1",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader9' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader9", "imgsDiv9", "zjImg2",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader12' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader12", "imgsDiv12", "zjImg5",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader14' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader14", "imgsDiv14", "componentImg3",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader15' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader15", "imgsDiv15", "sizeMeasureImgs",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader18' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader18", "imgsDiv18", "bwInnerImg",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader19' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader19", "imgsDiv19", "dcImgs",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader20' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader20", "imgsDiv20", "nbqZbImg",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader22' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader22", "imgsDiv22", "nbqPlateImg",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader23' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader23", "imgsDiv23", "zjPlateImg",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        upload.render({
            elem: '#uploader30' //绑定元素   整体照片
            , url: '${ctx}/common/uploadFile' //上传接口
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                });
            }
            , done: function (res) {
                //上传完毕回调
                addImg(res.path, "uploader30", "imgsDiv30", "jdImg6",9);
            }
            , error: function () {
                //请求异常回调
            }
        });
        $("#save").click(function(){
            save();
        })

    })



    var saveFlag = false;
    function save() {
        if(saveFlag){
            return;
        }
        var filingDocumentPhoto = [];
        $("input[name='filingDocumentPhoto']").each(function(){
            filingDocumentPhoto.push($(this).val());
        })
        if (filingDocumentPhoto.length==0) {
            layer.msg("备案文件照片不能为空");
            return;
        }
        var discloseDocImg = [];
        $("input[name='discloseDocImg']").each(function(){
            discloseDocImg.push($(this).val());
        })
        if (discloseDocImg.length==0) {
            layer.msg("农户合同不能为空");
            return;
        }
        var insuranceFiles = [];
        $("input[name='insuranceFiles']").each(function(){
            insuranceFiles.push($(this).val());
        })
        // if (insuranceFiles.length==0) {
        //     layer.msg("工程安装一切险不能为空");
        //     return;
        // }
        var zjPlateImg = [];
        $("input[name='zjPlateImg']").each(function(){
            zjPlateImg.push($(this).val());
        })
        if (zjPlateImg.length==0) {
            layer.msg("组件铭牌照片不能为空");
            return;
        }
        var zjImg5 = [];
        $("input[name='zjImg5']").each(function(){
            zjImg5.push($(this).val());
        })
        if (zjImg5.length==0) {
            layer.msg("组件航拍俯视图不能为空");
            return;
        }
        var dcImgs = [];
        $("input[name='dcImgs']").each(function(){
            dcImgs.push($(this).val());
        })
        if (dcImgs.length==0) {
            layer.msg("逆变器安装图-整体外观及走线及采集器（离地高度）不能为空");
            return;
        }
        var nbqPlateImg = [];
        $("input[name='nbqPlateImg']").each(function(){
            nbqPlateImg.push($(this).val());
        })
        if (nbqPlateImg.length==0) {
            layer.msg("逆变器安装图-铭牌不能为空");
            return;
        }
        var nbqZbImg = [];
        $("input[name='nbqZbImg']").each(function(){
            nbqZbImg.push($(this).val());
        })
        if (nbqZbImg.length==0) {
            layer.msg("并网箱安装图-外观及走线（离地高度）不能为空");
            return;
        }
        var bwInnerImg = [];
        $("input[name='bwInnerImg']").each(function(){
            bwInnerImg.push($(this).val());
        })
        if (bwInnerImg.length==0) {
            layer.msg("并网箱安装图-并网箱内部全景照片不能为空");
            return;
        }
        var zjImg1 = [];
        $("input[name='zjImg1']").each(function(){
            zjImg1.push($(this).val());
        })
        if (zjImg1.length==0) {
            layer.msg("支架类照片不能为空");
            return;
        }
        var sizeMeasureImgs = [];
        $("input[name='sizeMeasureImgs']").each(function(){
            sizeMeasureImgs.push($(this).val());
        })
        if (sizeMeasureImgs.length==0) {
            layer.msg("线缆走向（屋顶、下墙）、线缆保护管（或桥架）敷设及固定照片不能为空");
            return;
        }

        var componentImg3 = [];
        $("input[name='componentImg3']").each(function(){
            componentImg3.push($(this).val());
        })
        if (componentImg3.length==0) {
            layer.msg("接地极图-并网箱、逆变器安装接地极照片不能为空");
            return;
        }
        var jdImg6 = [];
        $("input[name='jdImg6']").each(function(){
            jdImg6.push($(this).val());
        })
        if (jdImg6.length==0) {
            layer.msg("接地极图-接地电阻阻值照片不能为空");
            return;
        }
        var zjImg2 = [];
        $("input[name='zjImg2']").each(function(){
            zjImg2.push($(this).val());
        })
        if (zjImg2.length==0) {
            layer.msg("防水措施图-其他图片不能为空");
            return;
        }
        saveFlag = true;
        $.ajax({
            type: 'post',
            url: '${ctx}/nhPowerStation/updateWGInfo',
            dataType: 'json',
            data: {
                entryId: '${customerEntry.id}',
                zjImg1: zjImg1.join(","),
                zjImg2: zjImg2.join(","),
                zjImg5: zjImg5.join(","),
                sizeMeasureImgs: sizeMeasureImgs.join(","),
                bwInnerImg: bwInnerImg.join(","),
                dcImgs: dcImgs.join(","),
                nbqZbImg: nbqZbImg.join(","),
                nbqPlateImg: nbqPlateImg.join(","),
                zjPlateImg: zjPlateImg.join(","),
                jdImg6: jdImg6.join(","),
                componentImg3:componentImg3.join(","),
                filingDocumentPhoto: filingDocumentPhoto.join(","),
                discloseDocImg:discloseDocImg.join(","),
                insuranceFiles:insuranceFiles.join(","),
            },
            success: function(data){
                if (data.code == "200") {
                    top.layer.msg("操作成功");
                    closeSelf();
                    parent.location.reload();
                } else {
                    layer.msg(data.errMsg);
                }
            },
            complete: function(){
                saveFlag = false;
            }
        });
    }

    function changeMaterialTab(type) {
        $('.materialTable').eq(type).removeClass('layui-hide').siblings('.materialTable').addClass('layui-hide');
    }

    function addImg(data, id, imgsDiv, classimg,count) {
        var imgCount=$("#" + imgsDiv).find(".imgSpan").length;
        if((imgCount+1)>=count){
            $("#" + id).hide();
        }
        var html = '<div class="bj-img imgSpan"><span class="layui-icon-close layui-icon" onclick="delImg(this,\'' + id + '\')"></span>';
        html += '<img src="${commonStaticImgPath}' + data + '" height="700" width="1200"/>';
        html += '<input type="hidden" name="' + classimg + '"  class="' + classimg + '" value="${commonStaticImgPath}' + data + '"/> </div>';
        $("#" + imgsDiv).append(html);
        //图片查看效果
        viewer.update();
    }
    function addImg2(data, id, imgsDiv, classimg,count) {
        var imgCount=$("#" + imgsDiv).find(".imgSpan").length;
        if((imgCount+1)>=count){
            $("#" + id).hide();
        }
        var html = '<div class="bj-img imgSpan"><span class="layui-icon-close layui-icon" onclick="delImg(this,\'' + id + '\')"></span>';
        html += '<img src="${commonStaticImgPath}' + data + '" height="700" width="1200"/>';
        html += '<input type="hidden" name="' + classimg + '"  class="' + classimg + '" value="' + data + '"/> </div>';
        $("#" + imgsDiv).append(html);
        //图片查看效果
        viewer.update();
    }

    function delImg(that, id) {
        $("#" + id).show();
        $(that).parent().remove();
    }

    window.closeSelf = function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);//关闭当前页
    }
    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 isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }

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

