<%@ 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" />
</head>
<body>
<div class="layui-card mb-0">
    <div class="feedbackOrder">
        <div class="layui-form layui-card-body over">
            <div class="layui-col-xs6 mb-20">
                <label class="layui-form-label"><i class="mark">*</i>服务措施：</label>
                <div class="layui-input-block">
                    <select name="serviceMeasures" id="serviceMeasures" lay-filter="serviceMeasures" lay-search >
                        <option value="">请选择</option>
                        <c:forEach items="${rds}" var="rd">
                            <option value="${rd.columns.service_measures}" <c:if test="${rd.columns.service_measures == order.serviceMeasures}"> selected</c:if> >${rd.columns.service_measures}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
            <div class="layui-col-xs12 mb-20">
                <label class="layui-form-label"><i class="mark">*</i>反馈内容：</label>
                <div class="layui-input-block">
                    <textarea name="remarks" placeholder="" class="layui-textarea" lay-verify="required"></textarea>
                </div>
            </div>
            <div class="layui-col-xs12 layui-form-item">
                <label class="layui-form-label">服务图片：</label>
                <div class="layui-input-block">
                    <div id="imgsDiv">

                    </div>
                    <div class="upload-container " id="uploader">
                        <img src="" alt="img placeholder" id="imgsAdd">
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 ">
                <label class="layui-form-label"></label>
                <div class="layui-input-block" style="color: #cc2a2c">
                    提示：请上传机身条码照片、整机照片、故障点照片
                </div>
            </div>
            <input type="hidden" name="orderId" value="${order.id}">
            <input type="hidden" name="applianceBarcode" value="${order.applianceBarcode}">
            <div class="layui-form-item " style="text-align: center;">
                <input type="button" lay-submit  lay-filter="sureSubmit" id="sureSubmit" value="服务完成" class="layui-btn">
                <input type="button" lay-submit  lay-filter="feedSubmit" id="feedSubmit" value="过程反馈" class="layui-btn">
            </div>
        </div>

    </div>
</div>

</div>

<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script>
    var imgsCount=0;
    layui.use(['upload','layer','form'], function(){
        $ = layui.$;
        layer = layui.layer;
        form = layui.form;
        var upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            elem: '#uploader' //绑定元素
            , url: '${ctx}/common/uploadFile' //上传接口
            ,size:5*1024
            ,number: 1
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#pic').attr('src', result); //图片链接（base64）
                    $("#pic").show();
                });
            }
            , done: function (res) {
                //上传完毕回调
                if(res.code > 0){
                    return layer.msg("上传失败！",{icon:2});
                }
                imgsCount++;
                if(imgsCount>=8){
                    $("#uploader").hide();
                }
                var imgPath = res.path;

                var html = '<div class="bj-img imgSpan"><span class="layui-icon-close layui-icon" onclick="delImg(this)"></span>';
                html += '<img src="${commonStaticImgPath}'+imgPath+'" height="700" width="1200"/>';
                html += '<input type="hidden" class="imgPicker" value="'+imgPath+'" name="imgPicker"/> </div>';
                $("#imgsDiv").append(html)
            }
            , error: function () {
                //请求异常回调
            }
        });
        var checkOrder = false;
        var checkback = false;

        form.on('submit(sureSubmit)', function(data){
            $("#sureSubmit").attr("disabled","true");
            if(checkOrder){
                return false;
            }
            var dat = data.field;
            var orderId = dat.orderId;
            var imgs;
            $(".imgPicker").each(function (index) {
                if(isBlank(imgs)){
                    imgs = $(this).val();
                }else{
                    imgs = imgs+","+$(this).val();
                }
            });

            var textarea= dat.remarks;
            if(isBlank(textarea)){
                layer.msg('请输入反馈内容', {icon:2});
                return false
            }
            var barcode = dat.applianceBarcode;
            if(isBlank(barcode)){
                layer.msg('机身条码不能为空，请先编辑', {icon:2});
                return false
            }
            var serviceMeasures =  dat.serviceMeasures;
            if(isBlank(serviceMeasures)){
                layer.msg('服务措施不能为空，请先编辑', {icon:2});
                return false
            }
            checkOrder = true;
            $.ajax({
                type:"POST",
                url:"${ctx}/feedback/feedbackSealingSheet",
                data:{
                    orderId:orderId,
                    imgs:imgs,
                    textarea:textarea,
                    serviceMeasures:serviceMeasures
                },
                success:function(result){
                    checkOrder = false;
                    $("#sureSubmit").attr("disabled","false");
                    if(result.code ==200){
                        parent.layer.closeAll()
                        parent.layer.msg('反馈成功！', {icon:1,time:1000},function(){
                        });
                    }else if(result.code == "505"){
                        layer.msg('反馈封单失败,该工单不满足封单条件!', {icon:2,time:1000});
                    }else if(result.code == "204"){
                        layer.msg('反馈内容为空!', {icon:2,time:1000});
                    }else if(result.code == "400"){
                        layer.msg('该工单不可转派，请刷新页面!', {icon:2,time:1000});
                    }else if(result.code == "400"){
                        layer.msg('机身条码不能为空，请先编辑', {icon:2});
                    }else if(result.code=="205"){
                        layer.msg("备件申请状态为已完成时才能执行服务完成操作!",{icon:2});
                        return;
                    }else{
                        layer.msg('反馈失败,数据有误', {icon:2,time:1000});
                    }
                }
            });
        });

        form.on('submit(feedSubmit)', function(data){
            $("#feedSubmit").attr("disabled","true");
            if(checkback){
                return false;
            }
            var dat = data.field;
            var orderId = dat.orderId;
            var imgs;
            $(".imgPicker").each(function (index) {
                if(isBlank(imgs)){
                    imgs = $(this).val();
                }else{
                    imgs = imgs+","+$(this).val();
                }
            });
            var textarea= dat.remarks;
            if(isBlank(textarea)){
                layer.msg('请输入反馈内容', {icon:2});
                $("#feedSubmit").attr("disabled","false");
                return false
            }
            var serviceMeasures =  dat.serviceMeasures;
         /*   if(isBlank(serviceMeasures)){
                layer.msg('服务措施不能为空，请先编辑', {icon:2});
                return false
            }*/
            checkback = true;
            $.ajax({
                type:"POST",
                url:"${ctx}/feedback/processFeedback",
                data:{
                    orderId:orderId,
                    imgs:imgs,
                    textarea:textarea,
                    serviceMeasures:serviceMeasures
                },
                success:function(result){
                    if(result.code ==200){
                        parent.layer.closeAll()
                        parent.layer.msg('反馈成功！', {icon:1,time:1000},function(){

                        });
                    }else if(result.code == "204"){
                        layer.msg('请输入反馈内容', {icon:2});
                    }else{
                        layer.msg('反馈失败,数据有误', {icon:2,time:1000});
                    }
                },
                complete:function(){
                    $("#feedSubmit").attr("disabled","false");
                    checkback = false;
                }
            });

        });
    });

    function delImg(that){
        imgsCount--;
        if (imgsCount < 3) {
            $("#uploader").show();
        }
        $(that).parent().remove();
    }

    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }
</script>
</body>
</html>

