<%@ 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;
        }
    </style>
</head>

<body>
<div class="layui-form">
    <div class="layui-card">
        <div class="layui-card-body layui-col-xs12" id="LAY_app">
            <div class="layui-row layui-col-space12 layui-form-item">
                <div class="layui-col-lg4 layui-col-sm4">
                    <label class="layui-form-label"><i class="red">*</i>代理商名称：</label>
                    <div class="layui-input-block">
                        <select id="traderId" name="traderId" lay-verify="required" lay-search lay-filter="traderId">
                            <option value="">请选择</option>
                            <c:forEach items="${traderList}" var="trader">
                                <option value="${trader.columns.id}" title="${trader.columns.name}">${trader.columns.name}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>
                <div class="layui-col-lg4 layui-col-sm4">
                    <label class="layui-form-label"><i class="red">*</i>仓库名称：</label>
                    <div class="layui-input-block">
                        <select id="warehouseId" name="warehouseId" lay-verify="required" lay-search>
                            <option value="">请选择</option>
                        </select>
                    </div>
                </div>
                <div class="layui-col-lg4 layui-col-sm4">
                    <label class="layui-form-label"><i class="red">*</i>物料代码：</label>
                    <div class="layui-input-block ">
                        <input type="text" autocomplete="off" disabled id="materialCode" name="materialCode"
                               class="layui-input" value="">
                        <input type="hidden" id="materialId" lay-verify="materialCode" class="layui-input" value="">
                        <a href="#" class="pos-a h-32 lh-32 layui-span-unit pl-10 layui-table-link"
                           onclick="selectMaterialCode()" style="font-size: 15px;color: #0B61A4">选择</a>
                    </div>
                </div>
            </div>
            <table class="layui-table">
                <colgroup>
                    <col width="4%">
                    <col width="7%">
                    <col width="7%">
                    <col width="7%">
                    <col width="7%">
                    <col width="10%">
                    <col width="7%">
                    <col width="7%">
                    <col width="8%">
                    <col width="8%">
                    <col width="8%">
                    <col width="8%">
                    <col width="8%">
                    <col width="4%">
                </colgroup>
                <thead>
                <tr>
                    <th style="text-align: center">序号</th>
                    <th style="text-align: center">物料代码</th>
                    <th style="text-align: center">外部编码</th>
                    <th style="text-align: center">物料名称</th>
                    <th style="text-align: center">物料类型</th>
                    <th style="text-align: center">物料规格</th>
                    <th style="text-align: center">库存单位</th>
                    <th style="text-align: center">供应商名称</th>
                    <th style="text-align: center">累计已发货</th>
                    <th style="text-align: center">累计已安装</th>
                    <th style="text-align: center">累计已发电</th>
                    <th style="text-align: center">累计退货</th>
                    <th style="text-align: center">累计买断</th>
                    <th style="text-align: center">操作</th>
                </tr>
                </thead>
                <tbody id="materialList">
                </tbody>
            </table>
            <div class="operate-footer">
                <input type="button" lay-submit lay-filter="confirm" id="confirm" class="layui-btn " value="确认">
                <input type="button" value="取消" class="layui-btn layui-btn-primary " onclick="closeDiv();">
            </div>
        </div>
    </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 = /^[0-9]*$/;
    var reg = /\./;
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['form', 'layedit', 'laydate', 'jquery', 'layer'], function () {
        $ = layui.jquery;
        form = layui.form;
        $form = $('form');

        var saveFlag = false;

        form.on('select(traderId)', function (data) {
            var traderId = $(data.elem).find("option:selected").val();
            $("#warehouseId").empty();
            if (isBlank(traderId)) {
                $("#warehouseId").append("<option value=''>请选择</option>");
                form.render('select');
                return "";
            }
            $.ajax({
                type: "POST",
                url: "${ctx}/material/getWarehouseByTraderId",
                data: {
                    traderId: traderId
                },
                success: function (result) {
                    if (result == "205") {
                        layer.msg("暂无数据!")
                        return
                    }
                    var html = " <option value=''>请选择</option>";
                    for (var i = 0; i < result.length; i++) {
                        var warehouse = result[i];
                        html = html + '<option value="' + warehouse.columns.id + '" title="' + warehouse.columns.name + '">' + warehouse.columns.name + '</option>';
                    }
                    $("#warehouseId").append(html);
                    form.render('select');
                }
            });
        });

        form.on('submit(confirm)', function (data) {
            if (saveFlag) {
                return false;
            }
            let traderId = $("#traderId").find("option:selected").val();
            if (isBlank(traderId)) {
                layer.msg("请选择代理商!");
                return false;
            }
            let traderName = $("#traderId").find("option:selected").attr("title");
            let warehouseId = $("#warehouseId").find("option:selected").val();
            if (isBlank(warehouseId)) {
                layer.msg("请选择仓库!");
                return false;
            }

            var bom = {};
            bom.traderId = traderId;
            bom.traderName = traderName;
            bom.warehouseId = warehouseId;
            var arr = [];
            if ($('#materialList>tr').length == 0) {
                layer.msg("请选择物料!");
                return false;
            }
            $('#materialList>tr').each(function(){
                var material = {};
                material.materialId = $(this).find("td:first").attr("data-value");
                material.ykYfhAmount=$(this).find('td').eq(8).find("input").val();
                material.ykYazAmount=$(this).find('td').eq(9).find("input").val();
                material.ykYfdAmount=$(this).find('td').eq(10).find("input").val();
                material.ykThAmount=$(this).find('td').eq(11).find("input").val();
                material.ykMdAmount=$(this).find('td').eq(12).find("input").val();
                if(isBlank(material.ykYfhAmount)){
                    material.ykYfhAmount = 0;
                }
                if(isBlank(material.ykYazAmount)){
                    material.ykYazAmount = 0;
                }
                if(isBlank(material.ykYfdAmount)){
                    material.ykYfdAmount = 0;
                }
                if(isBlank(material.ykThAmount)){
                    material.ykThAmount = 0;
                }
                if(isBlank(material.ykMdAmount)){
                    material.ykMdAmount = 0;
                }

                arr.push(material);
            });
            bom.details = arr;

            saveFlag = true;
            var index = layer.load(2, {shade: [0.5, '#fff'], content: ''});

            $.ajax({
                url: '${ctx}/material/addStock',
                method: 'post',
                contentType : "application/json;charsetset=UTF-8",
                data: JSON.stringify(bom),
                success: function (res) {
                    if (res.code == "200") {
                        parent.layer.msg("保存成功", {time: 1000});
                        closeDiv();
                        parent.table.reload('test');
                    } else {
                        layer.msg(res.errMsg, {time: 1000});
                        saveFlag = false;
                    }
                }, complete: function () {
                    layer.close(index);
                },
                error: function (data) {
                }
            });
        });

    })

    function selectMaterialCode() {
        layer.open({
            type: 2,
            title: '选择物料',
            content: '${ctx}/material/selectMaterialCodePage',
            area: ['50%', '50%']
        });
    }
    function addMaterialInfo(materialCode){
        if (isBlank(materialCode)) {
            return;
        }
        $.ajax({
            type: 'post',
            url: '${ctx}/material/selectNumber',
            dataType: 'json',
            data: {
                materialCode: materialCode
            },
            success: function(res){
                if (res.code == "200") {
                    var material = res.data;
                    var htm='';
                    var trCount=$("#materialList tr").length;
                    for (let i = 0; i < material.length; i++) {
                        let id = material[i].columns.id;
                        var flag = false;
                        $("#materialList tr").each(function(index){
                            var exsitId=$(this).find("td:first").attr("data-value");
                            if (exsitId === id) {
                                flag = true;
                            }
                        });
                        if (flag) {
                            continue;
                        }
                        trCount++;
                        let code = material[i].columns.code;
                        let qqCode = material[i].columns.qq_code;
                        let materialName = material[i].columns.material_name;
                        let materialType = material[i].columns.materialType;
                        let materialSpec = material[i].columns.material_specs;
                        let unit = material[i].columns.unit_name;
                        let materialBrand = material[i].columns.material_brand;
                        htm+='<tr style="text-align: center">'+
                            '<td data-value="'+id+'">'+trCount+'</td>' +
                            '<td>'+code+'</td>' +
                            '<td>'+qqCode+'</td>' +
                            '<td>'+materialName+'</td>' +
                            '<td>'+materialType+'</td>' +
                            '<td>'+materialSpec+'</td>' +
                            '<td>'+unit+'</td>' +
                            '<td>'+materialBrand+'</td>' +
                            '<td><input class="layui-input" type="number"></td>'+
                            '<td><input class="layui-input" type="number"></td>'+
                            '<td><input class="layui-input" type="number"></td>'+
                            '<td><input class="layui-input" type="number"></td>'+
                            '<td><input class="layui-input" type="number"></td>'+
                            '<td><a class="layui-table-opt-link" href="javascript:" onclick="deleteTr(this)">删除</a></td></tr>';
                    }
                    $("#materialList").append(htm);
                    form.render();
                } else {
                    layer.msg(res.errMsg, {time: 2500});
                }
            }
        });
    }
    function deleteTr(that){
        $(that).parent().parent().remove();
        $("#materialList tr").each(function(index){
            $(this).find("td:first").text(index+1);
        })
    }
    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>
