mashangyoujiu/Application/Retail/View/Exporttable/goodsquantity.html

<!DOCTYPE html>
<html>
<!--[1.3.63]-->
<head>
    <meta charset="utf-8"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/layui-v2.4.3/layui/css/layui.css"/>
    <script type="text/javascript" charset="utf-8" src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="__PUBLIC__/layui-v2.4.3/layui/layui.js"></script>
    <link rel="stylesheet" href="__PUBLIC__/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Retail/css/goodsList.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Retail/css/myscroll.css"/>
    <style>
        .layui-form-label {
            width: 90px;
        }

        .layui-form-item .layui-input-inline {
            display: flex;
            justify-content: flex-start;
            flex-direction: row;
            align-items: center;
            width: 300px;
        }

        body, html {
            height: 100%;
        }
    </style>
</head>
<div class="goodsBox" style="height: 100%;display: flex;flex-direction: column;">
    <div class="goods_title">
        <div class="goods_title_inner">
            单个商品出入库明细
        </div>
    </div>
    <div class="goods_edit">
        <form class="layui-form" action="" id="searchform">
            <div class="layui-form-item">
                <label class="layui-form-label">时间范围</label>
                <div class="layui-input-inline">
                    <input type="text" name="start" required id="start" lay-verify="required" placeholder="yyyy-MM-dd"
                           autocomplete="off" class="layui-input">
                    到
                    <input type="text" name="end" required id="end" lay-verify="required" placeholder="yyyy-MM-dd"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid layui-word-aux">商品出入库数据较多(尤其是出库)，建议时间间隔不要超过一个月。</div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">单品搜索</label>
                <div class="layui-input-inline">
                    <input type="text" name="keyword" required id="keyword" lay-verify="required"
                           placeholder="商品名称/货号/条码" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">出入库</label>
                <div class="layui-input-inline">
                    <input type="radio" name="type" value="2" title="出库" checked>
                    <input type="radio" name="type" value="1" title="入库">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline">
                    <button class="layui-btn" type="button" id="dosearch" lay-filter="formDemo">查询</button>
                    <if condition="$global_store_jurisdiction && ($global_store_jurisdiction['data_export'] eq '2')">
                        <else/>
                        <button class="layui-btn" type="button" id="exportable" lay-filter="formDemo"
                                style="display: none;">导出表格
                        </button>
                    </if>
                </div>
            </div>
        </form>
    </div>
    <div class="goods_table" style="flex: 1;display: flex;flex-direction: column;padding-bottom: 30px;">
        <h4 style="text-align: center;margin-bottom: 10px;font-size: 18px;">单品出入库明细</h4>
        <div style="flex: 1;box-sizing: border-box;border: 1px solid rgba(0,0,0,0.5);">
            <table class="layui-hide" id="test" lay-filter="demo"></table>
        </div>
    </div>
</div>
<script>
    layui.use(['form', 'layer', 'table', 'laydate'], function () {
        var table = layui.table;
        var laydate = layui.laydate;
        var form = layui.form;
        form.render();
        //常规用法
        laydate.render({
            elem: '#start'
        });
        laydate.render({
            elem: '#end'
        });
        $('#searchform input').on('change', function () {
            $('#exportable').hide();
        })
        $('#dosearch').click(function () {
            var start = $('#start').val();
            var end = $('#end').val();
            var keyword = $('#keyword').val();
            if (!start || !end || !keyword) {
                layer.msg('搜索条件不全', {time: 1500})
                return;
            }
            $('#exportable').hide();
            table.render({
                elem: '#test',
                height: 'full-300',
                url: "{:U('quantityList')}?" + $('#searchform').serialize(),
                cols: [
                    [ //标题栏
                        {
                            field: 'key',
                            title: '序号',
                            width: 60
                        }, {
                        field: 'type',
                        title: '操作类型',
                        width: 100
                    }, {
                        field: 'time',
                        title: '操作时间',
                        width: 160
                    }, {
                        field: 'supplier_name',
                        title: '供货商/来源'
                    }, {
                        field: 'original_stock',
                        title: '变动前库存',
                    }, {
                        field: 'present_stock',
                        title: '变动后库存',
                    }, {
                        field: 'do_num',
                        title: '操作数量',
                        width: 100
                    }, {
                        field: 'remark',
                        title: '备注',
                    }]
                ],
                id: 'testReload',
                done: function (res, curr, count) {
                    if (count - 1 > -1) {
                        $('#exportable').show();
                    }

                }
            });


        })
        $('#exportable').click(function () {
            window.location.href = "{:U('exportquantityList')}?" + $('#searchform').serialize();
        })
    })
</script>