<%@ 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">
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/dist/viewer.css" media="all">
    <style>html {background-color: #fff;padding-bottom: 50px;}td, th {text-align: center !important;}</style>
</head>

<body>
<div class="layui-form">
    <div class="layui-card">
        <div class="layui-col-xs12 mt-10 mb-10 pr-30">
            <div class="layui-inline layui-col-xs4">
                <label class="layui-form-label w-130">入库仓库：</label>
                <div class="layui-input-block ">
                    <input type="text" disabled name="inWarehouseName" readonly autocomplete="off" placeholder="请输入"
                           class="layui-input layui-bg-gray" value="${apply.columns.inWarehouseName}">
                </div>
            </div>
            <div class="layui-inline layui-col-xs4">
                <label class="layui-form-label w-130">下单人：</label>
                <div class="layui-input-block ">
                    <input type="text" disabled name="creator" readonly autocomplete="off" placeholder="请输入"
                           class="layui-input layui-bg-gray" value="${apply.columns.traderName}">
                </div>
            </div>
            <div class="layui-inline layui-col-xs4">
                <label class="layui-form-label w-130">申请时间：</label>
                <div class="layui-input-block ">
                    <input type="text" disabled name="createTime" readonly autocomplete="off" placeholder="请输入"
                           class="layui-input layui-bg-gray"
                           value="<fmt:formatDate value="${apply.columns.create_time}" pattern="yyyy-MM-dd HH:mm"/>">
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 mb-10 pr-30">
            <div class="layui-form-item">
                <label class="layui-form-label w-130">订单备注：</label>
                <div class="layui-input-block ">
                    <textarea readonly class="layui-textarea layui-bg-gray">${apply.columns.remark}</textarea>
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 mb-10 pr-30 pl-30">
            <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">
                        <table class="layui-table">
                            <thead>
                            <tr>
                                <th>序号</th>
                                <th>物料/BOM代码</th>
                                <th>物料/BOM类型</th>
                                <th>物料组</th>
                                <th>物料/BOM描述</th>
                                <th>申请数量</th>
                            </tr>
                            </thead>
                            <tbody id="materialTbody">
                            <c:forEach items="${gatherDetails}" var="detail" varStatus="vs">
                                <tr data-detailId="${detail.columns.id}"
                                    data-id="${detail.columns.target_id}"
                                    data-type="${detail.columns.type}"
                                    data-applyAmount="${detail.columns.amount}">
                                    <td>${vs.count}</td>
                                    <td>${detail.columns.code}</td>
                                    <td>${detail.columns.materialTypeName}</td>
                                    <td>${detail.columns.materialGroupName}</td>
                                    <td>${detail.columns.remarks}</td>
                                    <td><input type="text"
                                               class="layui-input" ${apply.columns.status eq '2'? '': 'disabled'}
                                               value='${detail.columns.amount}'
                                               name="amount" lay-verify="required"/></td>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </div>
                    <div class="layui-tab-item">
                        <table class="layui-table">
                            <thead>
                            <th>序号</th>
                            <th>物料代码</th>
                            <th>物料类型</th>
                            <th>物料组</th>
                            <th>单位</th>
                            <th>物料描述</th>
                            <th>申请数量</th>
                            </thead>
                            <tbody>
                            <c:forEach items="${applyDetails}" var="applyDetail" varStatus="vs">
                                <tr>
                                    <td>${vs.count}</td>
                                    <td>${applyDetail.columns.code}</td>
                                    <td>${applyDetail.columns.materialTypeName}</td>
                                    <td>${applyDetail.columns.materialGroupName}</td>
                                    <td>${applyDetail.columns.unit_name}</td>
                                    <td>${applyDetail.columns.remarks}</td>
                                    <td>${applyDetail.columns.apply_amount}</td>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="operate-footer">
        <input type="button" value="同意" class="layui-btn " onclick="pass();">
        <input type="button" value="驳回" class="layui-btn " onclick="notPass();">
        <input type="button" value="取消" class="layui-btn layui-btn-primary " onclick="closeDiv();">
    </div>
</div>
<div class="hide pd-10" style="padding: 10px" id="ideaDiv">
    <label class="layui-form-label w-130"><span class="red">*</span>驳回原因：</label>
    <div class="layui-input-block ">
        <textarea id="idea" class="idea-text f-l layui-textarea"></textarea>
    </div>
</div>

<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script type="text/javascript">
    //初始数据
    var $form;
    var form;
    var $;
    var imgs = '';
    var myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['form', 'layedit', 'laydate', 'jquery', 'layer', 'element'], function () {
        $ = layui.jquery;
        form = layui.form;
        var element = layui.element;
        $form = $('form');


    })

    function getListData() {
        var $trs = $('#materialTbody>tr');
        var arr = [];
        for (var i = 0; i < $trs.length; i++) {
            var $tr = $trs.eq(i);
            var data = {};
            data.detailId = $tr.data('detailid');
            data.targetId = $tr.data('id');
            data.type = $tr.data('type');
            data.applyAmount = $tr.data('applyamount');
            data.amount = $tr.find('input[name=amount]').val();
            arr.push(data);
        }
        return arr;
    }

    function pass(){
        var arr = getListData();
        var total = 0;
        for (var i = 0; i < arr.length; i++) {
            if (!/^\d+(\.\d{1,2})?$/.test(arr[i].amount)) {
                layer.msg('第' + (i + 1) + '条数量格式不正确');
                return;
            }
            total += arr[i].amount * 1;
        }
        if (total === 0) {
            layer.msg('申请总数不能为0');
            return;
        }
        ajaxAudit('0', '', arr);
    }

    function notPass() {
        layer.open({
            type: 1,
            area: ['450px', '280px'],
            content: $("#ideaDiv"),
            title: '审核驳回',
            btn: ['确认', '取消'],
            btnAlign: 'c',
            yes: function () {
                var idea = $('#idea').val();
                if (isBlank(idea)) {
                    layer.msg('请输入驳回原因', {icon: 2});
                    return;
                }
                ajaxAudit('1', idea);
            }
        })
    }

    var auditFlag = true;

    function ajaxAudit(type, reason, details) {
        if (!auditFlag) {
            return;
        }
        auditFlag = false;
        $.ajax({
            type: 'post',
            url: '${ctx}/material/order/auditOrder',
            contentType: 'application/json',
            dataType: 'json',
            data: JSON.stringify({
                orderId: '${apply.columns.id}',
                type: type,
                reason: reason,
                details: details
            }),
            success: function (data) {
                if (data.code === '200') {
                    parent.layer.msg('操作成功', {icon: 1});
                    closeDiv();
                    parent.searchOrder();
                } else if (data.code === '501') {
                    layer.msg(data.errMsg, {icon: 2});
                } else {
                    layer.msg('操作失败', {icon: 2});
                }
            },
            complete: function () {
                auditFlag = true;
            }
        });
    }

    function closeDiv() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index);
    }

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


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