<%@ 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" href="${ctxPlugin}/static/css/reset.css" media="all">
    <style>
        html{background-color: #fff;padding-bottom: 50px;}
        .layui-form-select dl{
            max-height:200px;
            width: 80%;
        }
        .layui-text h3 {
            font-size: 14px !important;
        }
        .fontColor1{
            color: #409eff !important;
        }
        .download-link {
            display: inline-block;
            padding-top: 5px;
            padding-right: 16px;
            color: #007bff;
            text-decoration: none;
            border-radius: 4px;
        }

        .download-link:hover {
            color: #0056b3;
        }
    </style>
</head>
<body>


<div class="layui-form">
    <div class="layui-card mt-10">

        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <ul class="layui-tab-title">
                <li class="layui-this">表单信息</li>
                <c:if test="${7 != userType && 6!= userType}">
                    <%--<li>流程路径</li>--%>
                    <li>审批过程</li>
                </c:if>
            </ul>

            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <input name="id" value="${order.columns.id}" hidden>
                    <div class="layui-card">
                        <blockquote class="layui-elem-quote">订单信息</blockquote>

                        <div class="layui-col-xs12 pr-30 mt-10">
                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">订单编号：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.number}" disabled>
                                </div>
                            </div>
                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">订单状态：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray"
                                    <c:choose>
                                        <c:when test="${order.columns.status eq '1'}">
                                               value="待审批"
                                        </c:when>
                                        <c:when test="${order.columns.status eq '2'}">
                                               value="待分配"
                                        </c:when>
                                        <c:when test="${order.columns.status eq '3'}">
                                               value="分配打回"
                                        </c:when>
                                        <c:when test="${order.columns.status eq '4'}">
                                               value="采购审批"
                                        </c:when>
                                    <c:when test="${order.columns.status eq '5'}">
                                           value="已分配"
                                    </c:when>
                                    <c:when test="${order.columns.status eq '6'}">
                                           value="已分配"
                                    </c:when>
                                        <c:when test="${order.columns.status eq '7'}">
                                               value="已完成"
                                        </c:when>
                                        <c:when test="${order.columns.status eq '9'}">
                                               value="发货驳回"
                                        </c:when>
                                        <c:when test="${order.columns.status eq '10'}">
                                               value="暂存"
                                        </c:when>
                                        <c:when test="${order.columns.status eq 'c'}">
                                               value="已拆单"
                                        </c:when>
                                        <c:when test="${order.columns.status eq 'a'}">
                                               value="发货审核驳回"
                                        </c:when>


                                        <c:otherwise>
                                               value="已分配"
                                        </c:otherwise>
                                    </c:choose>

                                           disabled>
                                </div>
                            </div>
                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">订单来源：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray"
                                    <c:choose>
                                        <c:when test="${order.columns.type eq '1'}">
                                               value="电站下单"
                                        </c:when>
                                        <c:when test="${order.columns.type eq '2'}">
                                               value="物料储备"
                                        </c:when>
                                    <c:when test="${order.columns.type eq '5'}">
                                           value="材料下单"
                                    </c:when>
                                        <c:otherwise>
                                               value=""
                                        </c:otherwise>
                                    </c:choose>
                                           disabled>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs12 pr-30 mt-10">
                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">入库仓库：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.inWarehouseName}" disabled>
                                </div>
                            </div>
                            <div class="layui-col-xs4  pr-30">
                                <label class="layui-form-label w-130">接货人：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.person_in_charge}" disabled>
                                </div>
                            </div>
                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">联系电话：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.deliverMobile}"  disabled>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs12 pr-30 mt-10">
                            <div class="layui-col-xs8 pr-30">
                                <label class="layui-form-label w-130">仓库地址：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.warehouseAddress}" disabled>
                                </div>
                            </div>

                            <div class="layui-col-xs4 pr-30">
                                <label class="layui-form-label w-130">代理商名称：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.traderName}"  disabled>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs12 pr-30 mt-10 mb-10">
                            <div class="layui-col-xs12 pr-30">
                                <label class="layui-form-label w-130">订单备注：</label>
                                <div class="layui-input-block">
                                    <input type="text" class="layui-input layui-bg-gray" value="${order.columns.remarks}"  disabled>
                                </div>
                            </div>
                        </div>
                        <div class="layui-inline layui-col-md3 layui-col-sm3">
                            <label class="layui-form-label w-130">企企项目：</label>
                            <div class="layui-input-block">
                                <input type="text" class="layui-input layui-bg-gray" value="${order.columns.qqProjectName}"  disabled>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-inline layui-col-xs12">
                                <label class="layui-form-label">施工人员保单：</label>
                                <div class="layui-input-block img-box ml-120">
                                    <div style="display: flex">
                                        <div id="insuranceFilesDiv">
                                            <c:if test="${not empty order.columns.insurance_files}">
                                                <c:forEach items="${order.columns.insurance_files}" var="file" varStatus="vs">
                                                    <div style="margin-top: 5px">
                                                        <a style="color:#2890ac;" href="${commonStaticImgPath}${file}" download="${file}" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                                                        <a style="color:#2890ac;cursor: pointer" target="_blank" onclick="previewUrl('${commonStaticImgPath}${file}')"    class="download-link">查看</a>
                                                        <input type="hidden" class="insuranceFiles" value="${file}">
                                                    </div>
                                                    <c:set var="insuranceFilesCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <%--
                        <div class="layui-row">
                            <div class="layui-inline layui-col-xs12">
                                <label class="layui-form-label">安全教育登记表：</label>
                                <div class="layui-input-block img-box ml-120">
                                    <div style="display: flex">
                                        <div id="safetyFilesDiv">
                                            <c:if test="${not empty order.columns.safety_files}">
                                                <c:forEach items="${order.columns.safety_files}" var="file" varStatus="vs">
                                                    <div style="margin-top: 5px">
                                                        <a style="color:#2890ac;" href="${commonStaticImgPath}${file}" download="${file}" class="download-link">${fns:substringAfterLast(file, '/')}</a>
                                                        <a style="color:#2890ac;cursor: pointer" target="_blank" onclick="previewUrl('${commonStaticImgPath}${file}')"    class="download-link">查看</a>
                                                        <input type="hidden" class="safetyFiles" value="${file}">
                                                    </div>
                                                    <c:set var="safetyFilesCount" value="${vs.count}"/>
                                                </c:forEach>
                                            </c:if>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        --%>
                        <div class="<c:if test="${order.columns.type ne '2' && order.columns.type ne '5'}">hide</c:if>">
                            <blockquote class="layui-elem-quote" style="clear: both;">物料信息</blockquote>

                            <div class="layui-col-xs12 mt-10 mb-10 pr-30 pl-30">
                                <table class="layui-table">
                                    <thead>
                                    <th>序号</th>
                                    <th>物料代码</th>
                                    <th>物料名称</th>
                                    <th>物料类型</th>
                                    <th>物料品牌</th>
                                    <th>物料规格</th>
                                    <th>计划数量</th>
                                    <th>发货数量</th>
                                    <th>零售单价</th>
                                    <th>零售总价</th>
                                    </thead>
                                    <tbody id="materialTbody">
                                    <c:forEach items="${details}" var="applyDetail" varStatus="vs">
                                        <tr data-id="${applyDetail.columns.id}"
                                            data-materialId="${applyDetail.columns.material_id}"
                                            data-applyAmount="${applyDetail.columns.apply_amount}">
                                            <td>${vs.count}</td>
                                            <td>${applyDetail.columns.code}</td>
                                            <td>${applyDetail.columns.material_name}</td>
                                            <td>${applyDetail.columns.material_type}</td>
                                            <td>${applyDetail.columns.material_brand}</td>
                                            <td>${applyDetail.columns.material_spec}</td>
                                            <td>${applyDetail.columns.apply_amount}</td>
                                            <td>${applyDetail.columns.out_amount}</td>
                                            <td>${applyDetail.columns.sales_price}</td>
                                            <td>${applyDetail.columns.total_price}</td>
                                        </tr>
                                    </c:forEach>
                                    </tbody>
                                </table>
                                <div  class="layui-col-md4 layui-col-md-offset10">
                                    <label class="layui-form-label">合计金额：</label>
                                    <input type="text" style="width: 20%" class="layui-input" value="${details[0].get("all_price")}" disabled>
                                </div>
                            </div>

                        </div>
                        <div class="layui-tab layui-tab-brief">
                            <div class=" layui-col-xs12 <c:if test="${order.columns.type ne '1'}">hide</c:if>">
                            <ul class="layui-tab-title ">
                                <li class="layui-this" onclick="showF(1)">物料信息</li>
                                <li onclick="showF(2)">电站信息</li>
                            </ul>

                            <div class="layui-col-xs12 mt-10 mb-10 pr-30 pl-30 entryDiv1">
                                <table class="layui-table">
                                    <thead>
                                    <th>序号</th>
                                    <th>物料代码</th>
                                    <th>物料名称</th>
                                    <th>物料类型</th>
                                    <th>物料品牌</th>
                                    <th>物料规格</th>
                                    <th>计划数量</th>
                                    <th>发货数量</th>
                                    <th>零售单价</th>
                                    <th>零售总价</th>
                                    </thead>
                                    <tbody>
                                    <c:forEach items="${details}" var="applyDetail" varStatus="vs">
                                        <tr data-id="${applyDetail.columns.id}"
                                            data-materialId="${applyDetail.columns.material_id}"
                                            data-applyAmount="${applyDetail.columns.apply_amount}">
                                            <td>${vs.count}</td>
                                            <td>${applyDetail.columns.code}</td>
                                            <td>${applyDetail.columns.material_name}</td>
                                            <td>${applyDetail.columns.material_type}</td>
                                            <td>${applyDetail.columns.material_brand}</td>
                                            <td>${applyDetail.columns.material_spec}</td>
                                            <td>${applyDetail.columns.apply_amount}</td>
                                            <td>${applyDetail.columns.out_amount}</td>
                                            <td>${applyDetail.columns.sales_price}</td>
                                            <td>${applyDetail.columns.total_price}</td>
                                        </tr>
                                    </c:forEach>
                                    </tbody>
                                </table>
                                <div  class="layui-col-md4 layui-col-md-offset10">
                                    <label class="layui-form-label">合计金额：</label>
                                    <input type="text" style="width: 25%" class="layui-input" value="${details[0].get("all_price")}" disabled>
                                </div>
                            </div>

                            <div class="layui-col-xs12 mb-10 pr-30 pl-30 entryDiv2 layui-hide">
                                    <table class="layui-table">
                                        <thead>
                                        <tr>
                                            <th style="width: 5%">序号</th>
                                            <th style="width: 12%">电站编码</th>
                                            <th style="width: 15%">客户姓名</th>
                                            <th >安装地址</th>
                                            <th style="width: 15%">设计容量（W）</th>
                                            <th style="width: 15%">登记时间</th>
                                        </tr>
                                        </thead>
                                        <tbody id="entryListBody">

                                        <c:forEach var="en" items="${entrys}" varStatus="vs">
                                            <tr  data-entryId="${en.columns.id}" >
                                                <td>${vs.count}</td>
                                                <td >
                                                        ${en.columns.power_station_code}
                                                </td>
                                                <td>
                                                        ${en.columns.tenant_name}
                                                </td>
                                                <td> ${en.columns.address}</td>
                                                <td> ${en.columns.design_capacity}</td>
                                                <td> ${en.columns.createTime}</td>
                                            </tr>
                                        </c:forEach>
                                        </tbody>
                                    </table>

                                </div>
                        </div>
                        </div>

                    </div>

                    <div class="layui-col-xs12  pr-30 mt-10">
                        <label class="layui-form-label w-130">备注：</label>
                        <div class="layui-input-block">
                           <%-- <c:choose>
                                <c:when test="${from eq 'audit'}">
                                    <input type="text" name="auditRemarks" id="auditRemarks" autocomplete="off" placeholder="" class="layui-input" value="">
                                </c:when>
                                <c:otherwise>
                                    <input type="text" autocomplete="off" placeholder="" class="layui-input layui-bg-gray" disabled value="${order.columns.audit_remark}">
                                </c:otherwise>
                            </c:choose>--%>
                               <input type="text" autocomplete="off" placeholder="" class="layui-input layui-bg-gray" disabled value="${order.columns.audit_remark}">
                        </div>
                    </div>
                </div>

               <%-- <div class="layui-tab-item licheng">
                    <ul class="layui-timeline" id="licheng">
                    </ul>
                </div>--%>

                <div class="layui-tab-item guocheng">
                    <ul class="layui-timeline">
                        <c:forEach items="${infos}" var="info">
                            <li class="layui-timeline-item">
                                <i class="layui-icon layui-timeline-axis"></i>
                                <div class="layui-timeline-content layui-text">
                                    <div class="layui-timeline-title"><fmt:formatDate value="${info.operateTime}" pattern="yyyy-MM-dd HH:mm:ss"/>&nbsp;&nbsp;&nbsp;${info.detail}</div>
                                </div>
                            </li>
                        </c:forEach>
                    </ul>
                </div>
            </div>

        </div>


        <input type="hidden" name="taskId" id="taskId" value="${order.columns.task_id}">
        <input type="hidden" name="id" id="id" value="${order.columns.id}">

        <input type="hidden" id="processInstanceId" value="${order.columns.process_instance_id}">
        <input type="hidden" id="status" value="${order.columns.status}">
        <div class="layui-col-xs12 mb-20 pr-30 mt-20">
        </div>
    </div>
    <div class="operate-footer">
       <%-- <c:if test="${from eq 'audit'}">
            <input type="button"  id="approve" class="layui-btn " value="同意>
            <input type="button"  id="back" class="layui-btn " value="驳回">
        </c:if>--%>
        <input type="button"   value="取消" class="layui-btn layui-btn-primary " onclick="closeDiv();" >
    </div>
</div>

<div id="lookImg" class="hide pos-r">
    <div style="position:relative;width:90%;height:450px;">
        <div class="w-500 h-450 lookImg">
            <img src="" width="80%" id="image">
        </div>
    </div>
</div>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/base64.js"></script>
<script type="text/javascript">
    //初始数据
    var $form;
    var form;
    var upload;
    var $;
    var myreg=/^[1][3,4,5,6,7,8,9][0-9]{9}$/;
    layui.use(['form', 'table', 'upload', 'jquery','element'], function () {
        $ = layui.jquery;
        form = layui.form;
        upload = layui.upload;
        $form = $('form');
        var element = layui.element;

        element.on('tab(docDemoTabBrief)', function (data) {
            console.log(data);
            $('.layui-tab-content').eq(data.index).removeClass('layui-hide').siblings('.layui-tab-content').addClass('layui-hide');
           /* if(data.index==1){
                var len=$("#licheng li").length;
                console.log("leng"+len);
                if(len==0){
                    var processInstanceId=$("#processInstanceId").val();
                    var status=$("#status").val();
                    $.ajax({
                        type:"POST",
                        url:"${ctx}/set/process/getBpmnModel",
                        data:{
                            processInstanceId:processInstanceId,
                            status:status,
                        },
                        success:function(res){
                            if(res.code=="200"){
                                var str=res.data;
                                var ht='';
                                for(var i=0;i<str.length;i++){
                                    var taski = str[i];
                                    console.log(taski);
                                    ht+='<li class="layui-timeline-item">';
                                    ht+='<i class="layui-icon layui-timeline-axis">&#xe63f;</i>';
                                    ht+='<div class="layui-timeline-content layui-text">';
                                    if(taski.status=='3'){
                                        ht+='<h3 class="layui-timeline-title fontColor1">'+taski.taskName+'</h3>'
                                        ht+='<p class="fontColor1">'+taski.approveUserName+'</p>';
                                    }else{
                                        ht+='<h3 class="layui-timeline-title">'+taski.taskName+'</h3>'
                                        ht+='<p>'+taski.approveUserName+'</p>';
                                    }
                                    ht+='</div>'
                                    ht+='</li>';
                                }

                                $("#licheng").html(ht);
                            }
                        },
                    }) ;
                }
            }*/

        });


       /* element.on('tab(entryDetail)', function (data) {
            console.log(33333);
            $('.entryDiv').eq(data.index).removeClass('layui-hide').siblings('.entryDiv').addClass('layui-hide');
        });*/

        $(".imgSpan img").click(function(){
            var img = $(this).attr("data-img");
            console.log(img);
            $("#lookImg img").attr('src',img);
            layer.open({
                type:1,
                title:'查看图片',
                area:['500px','450px'],
                content:$("#lookImg")
            })
        })
    })

    function  closeDiv() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        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;
    }

    function showF(type){
        console.log(type);
        if('1'==type){
            $('.entryDiv1').removeClass('layui-hide');
            $('.entryDiv2').addClass('layui-hide');
        }else{
            $('.entryDiv2').removeClass('layui-hide');
            $('.entryDiv1').addClass('layui-hide');
        }
    }

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

