<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
    <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">
    <style>
        html {
            background-color: #fff;
        }
    </style>
</head>
<body class="">
<div class="layui-fluid ">
    <div class="layui-card pl-30 pr-30 pt-10 over">
        <form class="layui-form" action="" lay-filter="component-form-group" id="orderForm">
            <div class="layui-card-body layui-col-xs11">

                <div class="layui-card">
                    <input type="hidden" name="id" id="orderId" value="${order.id}">
                    <input type="hidden" name="fittingFlag" id="fittingFlag" value="${order.fittingFlag}">
<%--                    <div class="site-demo-button siteOrderButten">--%>
<%--                        <button type="button" class="layui-btn layui-btn-primary ">基本信息</button>--%>
<%--                        <button type="button" class="layui-btn ">过程信息</button>--%>
<%--                    </div>--%>
                </div>
                <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">基本信息</li>
                        <li>过程信息</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <div class="layui-card jibenxinxi">
                                <div class="layui-card-body ">
                                    <div class="layui-row layui-col-space12 layui-form-item">
                                        <div class="layui-col-lg2 layui-col-sm4">
                                            <label class="layui-form-label">工单编号：</label>
                                            <div class="layui-input-block">
                                                <input type="text" name="number" id="number" lay-verify="required"
                                                       placeholder=""
                                                       autocomplete="off" class="layui-input layui-bg-gray"
                                                       value="${order.number}" disabled>
                                            </div>
                                        </div>
                                        <div class="layui-col-lg2 layui-col-sm4" lay-filter="component-form-element">
                                            <label class="layui-form-label"><i class="mark">*</i>信息来源：</label>
                                            <div class="layui-input-block">
                                                <select name="orderType" id="orderType" lay-verify="required"
                                                        class=" layui-bg-gray" disabled>
                                                    <option value="">请选择</option>
                                                    <option value="1"
                                                            <c:if test="${order.orderType eq 1}">selected</c:if>>用户在线报修
                                                    </option>
                                                    <option value="2"
                                                            <c:if test="${order.orderType eq 2}">selected</c:if>>平台录入
                                                    </option>
                                                    <option value="4"
                                                            <c:if test="${order.orderType eq 4}">selected</c:if>>电子商务
                                                    </option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="layui-col-lg2 layui-col-sm4">
                                            <label class="layui-form-label">服务类型：</label>
                                            <div class="layui-input-block">
                                                <input type="text" name="serviceType" id="serviceType"
                                                       lay-verify="required" placeholder=""
                                                       autocomplete="off" class="layui-input layui-bg-gray"
                                                       value="${order.serviceType}" disabled>
                                            </div>
                                        </div>
                                        <c:if test="${order.serviceType eq '安装'}">
                                            <div class="layui-col-lg2 layui-col-sm4">
                                                <label class="layui-form-label"><i class="mark">*</i>容量：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="applianceCapacity" id="applianceCapacity"
                                                           lay-verify="required" placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.applianceCapacity}" disabled> <span
                                                        class="pos-a h-32 lh-32 layui-span-unit">KW</span>
                                                </div>
                                            </div>
                                        </c:if>
                                        <div class="layui-col-lg2 layui-col-sm4">
                                            <label class="layui-form-label">服务措施：</label>
                                            <div class="layui-input-block">
                                                <select name="serviceMeasures" id="serviceMeasures"
                                                        class="layui-bg-gray" lay-filter="aihao" disabled>
                                                    <option value="">请选择</option>
                                                    <c:forEach items="${serviceMeasures}" var="measures">
                                                        <option value="${measures.columns.service_measures}"
                                                                <c:if test="${measures.columns.service_measures eq order.serviceMeasures}">selected</c:if>> ${measures.columns.service_measures}</option>
                                                    </c:forEach>
                                                </select>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="layui-card jibenxinxi ">
                                <div class="layui-card-header pt-10">
                                    <h1 class="title">用户信息</h1>
                                </div>
                                <div class="layui-card-body ">
                                    <div class="layui-form" action="" lay-filter="component-form-element">
                                        <div class="layui-row layui-col-space12 layui-form-item">

                                            <div class="layui-col-lg3 layui-col-sm4">
                                                <label class="layui-form-label"><i class="mark">*</i>用户姓名：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="customerName" id="customerName"
                                                           lay-verify="required" placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.customerName}" disabled>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg3 layui-col-sm4" style="position: relative">
                                                <label class="layui-form-label"><i class="mark">*</i>联系方式1：</label>
                                                <div class="layui-input-block pr-30">
                                                    <input type="text" name="customerMobile" lay-verify="required"
                                                           class="layui-input layui-bg-gray"
                                                           value="${order.customerMobile}" disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg3 layui-col-sm4">
                                                <label class="layui-form-label">联系方式2：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="customerTelephone" id="customerTelephone"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.customerTelephone}" disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg8">
                                                <div class="layui-col-xs12 layui-form-item">
                                                    <label class="layui-form-label"><i class="mark">*</i>用户地址：</label>
                                                    <div class="layui-input-block">
                                                        <div class="layui-col-lg3 layui-col-sm3 pr-30">
                                                            <select name="province" id="province" lay-verify="required"
                                                                    lay-filter="province" lay-search disabled>
                                                                <option value=""></option>
                                                                <c:forEach items="${pros}" var="pro">
                                                                    <option value="${pro.columns.ProvinceName}"
                                                                            <c:if test="${order.province eq pro.columns.ProvinceName}">selected</c:if>
                                                                            title="${pro.columns.ProvinceID }">${pro.columns.ProvinceName}</option>
                                                                </c:forEach>
                                                            </select>
                                                        </div>
                                                        <div class="layui-col-lg2 layui-col-sm3 pr-30">
                                                            <select name="city" id="city" lay-verify="required"
                                                                    lay-filter="city" lay-search disabled>
                                                                <option value="">请选择</option>
                                                                <c:forEach items="${faccitys}" var="city">
                                                                    <option value="${city.columns.CityName}"
                                                                            <c:if test="${order.city eq city.columns.CityName}">selected</c:if>
                                                                            title="${city.columns.CityID}">${city.columns.CityName}</option>
                                                                </c:forEach>
                                                            </select>
                                                        </div>
                                                        <div class="layui-col-lg2 layui-col-sm3 pr-30">
                                                            <select name="area" id="area" lay-verify="required"
                                                                    lay-filter="aihao" lay-search disabled>
                                                                <option value="">请选择</option>
                                                                <c:forEach items="${areas}" var="area">
                                                                    <option value="${area.columns.DistrictName}"
                                                                            <c:if test="${order.area eq area.columns.DistrictName}">selected</c:if>
                                                                            title="${area.columns.DistrictID}">${area.columns.DistrictName}</option>
                                                                </c:forEach>
                                                            </select>
                                                        </div>
                                                        <div class="layui-col-lg6 layui-col-sm3">
                                                            <input type="text" name="customerAddress"
                                                                   lay-verify="required" placeholder=""
                                                                   autocomplete="off"
                                                                   class="layui-input layui-col-lg2 layui-bg-gray"
                                                                   value="${order.customerAddress}" disabled>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="layui-card jibenxinxi">
                                <div class="layui-card-header pt-10">
                                    <h1 class="title">服务信息</h1>
                                </div>
                                <div class="layui-card-body">
                                    <div class="layui-form" action="" lay-filter="component-form-element">
                                        <div class="layui-row layui-col-space12 layui-form-item">

                                            <div class="layui-col-lg3 layui-col-sm6">
                                                <label class="layui-form-label">电站名称：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="powerStationName" id="powerStationName"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.powerStationName}" disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">设备类型：</label>
                                                <div class="layui-input-block">
                                                    <select name="applianceCategory" id="applianceCategory" disabled>
                                                        <option value="">请选择</option>
                                                        <option value="光伏组件"
                                                                <c:if test="${order.applianceCategory eq '光伏组件'}">selected</c:if>>
                                                            光伏组件
                                                        </option>
                                                        <option value="逆变器"
                                                                <c:if test="${order.applianceCategory eq '逆变器'}">selected</c:if>>
                                                            逆变器
                                                        </option>
                                                        <option value="通讯模块"
                                                                <c:if test="${order.applianceCategory eq '通讯模块'}">selected</c:if>>
                                                            通讯模块
                                                        </option>
                                                        <option value="并网箱"
                                                                <c:if test="${order.applianceCategory eq '并网箱'}">selected</c:if>>
                                                            并网箱
                                                        </option>
                                                        <option value="线缆"
                                                                <c:if test="${order.applianceCategory eq '线缆'}">selected</c:if>>
                                                            线缆
                                                        </option>
                                                        <option value="配件"
                                                                <c:if test="${order.applianceCategory eq '配件'}">selected</c:if>>
                                                            配件
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg3 layui-col-sm3">
                                                <label class="layui-form-label">设备型号：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="applianceModel" id="applianceModel"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.applianceModel}" disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">投运时间：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="applianceBuyTime" id="applianceBuyTime"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="<fmt:formatDate value="${order.applianceBuyTime}" pattern="yyyy-MM-dd" />"
                                                           disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">设备品牌：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="applianceBrand" id="applianceBrand"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.applianceBrand}" disabled>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">设备序列号：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="applianceMachineCode"
                                                           id="applianceMachineCode" placeholder="" disabled
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="${order.applianceMachineCode}">
                                                </div>
                                            </div>

                                            <div class="layui-col-lg3 layui-col-sm3">
                                                <label class="layui-form-label">保修类型：</label>
                                                <div class="layui-input-block">
                                                    <select name="warrantyType" id="warrantyType" lay-filter="aihao"
                                                            class="layui-bg-gray" disabled>
                                                        <option value="">请选择</option>
                                                        <option value="1"
                                                                <c:if test="${order.warrantyType eq 1}">selected</c:if> >
                                                            保内
                                                        </option>
                                                        <option value="2"
                                                                <c:if test="${order.warrantyType eq 2}">selected</c:if> >
                                                            保外
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">预约时间：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="promiseTime" id="promiseTime"
                                                           placeholder="" disabled
                                                           autocomplete="off" class="layui-input layui-bg-gray"
                                                           value="<fmt:formatDate value="${order.promiseTime}" pattern="yyyy-MM-dd" />">
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">时间要求：</label>
                                                <div class="layui-input-block">
                                                    <select name="promiseLimit" id="promiseLimit" lay-filter="aihao"
                                                            class="layui-bg-gray" disabled>
                                                        <option value="">请选择</option>
                                                        <c:forEach items="${promiseLimit}" var="timeList">
                                                            <option value="${timeList}"
                                                                    <c:if test="${timeList == order.promiseLimit}">selected</c:if>>${timeList}</option>
                                                        </c:forEach>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">销售商：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="pleaseReferMall" id="pleaseReferMall"
                                                           placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray" disabled
                                                           value="${order.pleaseReferMall}">
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm3">
                                                <label class="layui-form-label">发票号码：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="invoice" id="invoice" placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray" disabled
                                                           value="${order.invoice}">
                                                </div>
                                            </div>

                                            <div class="layui-col-lg3 layui-col-sm3">
                                                <label class="layui-form-label">重要程度：</label>
                                                <div class="layui-input-block">
                                                    <select name="level" id="level" class="layui-bg-gray" disabled>
                                                        <option value="">请选择</option>
                                                        <option value="1"
                                                                <c:if test="${1 == order.level}">selected</c:if>>紧急
                                                        </option>
                                                        <option value="2"
                                                                <c:if test="${2 == order.level}">selected</c:if>>一般
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-sm4">
                                                <label class="layui-form-label"><i class="red">*</i>报单时间：</label>
                                                <div class="layui-input-block">
                                                    <input type="text" name="repairTime" id="repairTime" placeholder=""
                                                           autocomplete="off" class="layui-input layui-bg-gray" disabled
                                                           value="<fmt:formatDate value="${order.repairTime}" pattern="yyyy-MM-dd HH:mm:ss" />">
                                                </div>
                                            </div>
                                            <div class="layui-col-xs12">
                                                <c:choose>
                                                    <c:when test="${order.serviceType eq '安装'}">
                                                        <label class="layui-form-label">现场描述：</label>
                                                    </c:when>
                                                    <c:otherwise>
                                                        <label class="layui-form-label">故障描述：</label>
                                                    </c:otherwise>
                                                </c:choose>
                                                <div class="layui-input-block">
                                                    <textarea name="remarks" id="remarks" placeholder=""
                                                              class="layui-textarea layui-bg-gray" lay-verify="required"
                                                              disabled>${order.remarks}</textarea>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs12 layui-form-item">
                                                <c:choose>
                                                    <c:when test="${order.serviceType eq '安装'}">
                                                        <label class="layui-form-label">附图：</label>
                                                    </c:when>
                                                    <c:otherwise>
                                                        <label class="layui-form-label">故障图片：</label>
                                                    </c:otherwise>
                                                </c:choose>
                                                <div class="layui-input-block">
                                                    <div id="imgsDiv">
                                                        <c:forEach var="image" items="${images}">
                                                            <div class="bj-img imgSpan">
                                                                <span class="layui-icon-close layui-icon  layui-hide"
                                                                      onclick="delImg(this)"></span>
                                                                <img src="${commonStaticImgPath}${image}"
                                                                     data-img="${commonStaticImgPath}${image}"
                                                                     height="700" width="1200"/>
                                                                <input type="hidden" class="imgPicker" value="${image}">
                                                            </div>
                                                        </c:forEach>
                                                    </div>
                                                    <div class="upload-container layui-hide" id="uploader">
                                                        <img src="" alt="img placeholder" id="imgsAdd">
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="layui-col-xs12 layui-form-item layui-hide tishi">
                                                <label class="layui-form-label"></label>
                                                <div class="layui-input-block" style="color: #cc2a2c">
                                                    提示：最多可上传4张照片
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item guoChen">

                        </div>
                    </div>
                </div>
<%--                <div class="layui-card processInformation layui-hide">--%>
<%--                    <ul class="layui-timeline guoChen">--%>
<%--                    </ul>--%>
<%--                </div>--%>
            </div>
        </form>
    </div>
</div>


<div id="lookImg" class="hide pos-r">
    <div style="position:relative;width:100%;height:500px;">
        <div class="w-500 h-500 lookImg">
            <img src="" width="80%" id="image">
        </div>
    </div>
</div>


<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script>
    var imgsCount="${imgNumber}";
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'layedit', 'laydate' ,'upload','jquery','layer'], function () {
        $ = layui.$
            , admin = layui.admin
            , element = layui.element
            , form = layui.form
            , layer = layui.layer
            ,laydate = layui.laydate;


        $(".mark").addClass("layui-hide");
        $(".red").addClass("layui-hide");

        element.render('breadcrumb', 'breadcrumb');

        form.on('select(applianceBrand)', function(data){
            var brand = data.value;
            CategoryOrder(brand)
        });

        $(".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','550px'],
                content:$("#lookImg")
            })
        })


        var aa = $('.siteOrderButten button');
        var orderId = $("#orderId").val();
        var sign = $("#sign").val();
        var fittingFlag = $("#fittingFlag").val();
        guocheng(orderId);
        <%--aa.click(function () {--%>
        <%--    aa.removeClass("layui-btn-primary");--%>
        <%--    $(this).addClass("layui-btn-primary");--%>
        <%--    var index=aa.index(this);--%>
        <%--    if(index == 1){--%>
        <%--        //过程信息--%>
        <%--        $(".processInformation").removeClass("layui-hide");--%>
        <%--        $(".jibenxinxi").addClass("layui-hide");--%>
        <%--        $(".logsticInfoNew").addClass("layui-hide");--%>
        <%--        var html = $.trim($(".layui-timeline").html()) ;--%>
        <%--        //    if(isBlank(html)){--%>
        <%--        guocheng(orderId);--%>
        <%--        //   }--%>

        <%--    }else if(index == 2){--%>
        <%--        //物流信息--%>
        <%--        /*if(sign == 2){--%>
        <%--            layer.msg("暂时没有物流信息，请稍后查询!",{icon:2});--%>
        <%--        }else*/ if(fittingFlag == 0 &&  "上门安装" != "${order.serviceType}"){--%>
        <%--            layer.msg("暂时没有物流信息，请稍后查询!",{icon:2});--%>
        <%--        }else{--%>
        <%--            //物流信息--%>
        <%--            $(".processInformation").addClass("layui-hide");--%>
        <%--            $(".jibenxinxi").addClass("layui-hide");--%>
        <%--            $(".logsticInfoNew").removeClass("layui-hide");//物流信息--%>
        <%--        }--%>
        <%--    }else{--%>
        <%--        $(".jibenxinxi").removeClass("layui-hide");--%>
        <%--        $(".processInformation").addClass("layui-hide");--%>
        <%--        $(".logsticInfoNew").addClass("layui-hide");--%>
        <%--    }--%>
        <%--})--%>

        //保存
        //取消
        $(".cancelorder").click(function(){
            $(this).addClass("layui-hide");
            $(".uodateorder").addClass("layui-hide");
            $(".xiugaiOrder").removeClass("layui-hide");

            window.location.reload();

        })
        /**
         * 指派
         */
        var orderId = $("#orderId").val();


        if("${type}" == 2){
            $(".processInformation").removeClass("layui-hide");
            $(".jibenxinxi").addClass("layui-hide");
            $(".logsticInfoNew").addClass("layui-hide");
            guocheng(orderId)
        }


        if(${order.status == 1}){
            /*  orderFitting(orderId);*/
        }

        function guocheng(orderId){
            $.ajax({
                type:"POST",
                url:"${ctx}/order/getOrderDetail",
                data:{
                    orderId:orderId
                },
                success:function(data){
                    if(data!=null){
                        var deatil ="";
                        for(var i =0;i<data.length;i++){
                            deatil += '<li class="layui-timeline-item"><i class="layui-icon layui-timeline-axis"></i>';
                            deatil += '<div class="layui-timeline-content layui-text">';
                            deatil +=' <h4 class="layui-timeline-title">'+data[i].d+'</h4> <p>';
                            deatil += data[i].c+ '  </p> </div> </li>';
                        }
                        $(".guoChen").html(deatil);
                    }else{
                        layer.msg("数据有误！", {icon: 2});
                    }
                }
            });
        }

              });


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


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