<!DOCTYPE html> 
 | 
<html lang="en"> 
 | 
<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, maximum-scale=1"> 
 | 
    <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all"> 
 | 
    <link rel="stylesheet" href="../../static/css/admin.css?v=318" media="all"> 
 | 
    <link rel="stylesheet" href="../../static/css/cool.css" media="all"> 
 | 
    <link rel="stylesheet" href="../../static/css/common.css" media="all"> 
 | 
    <style> 
 | 
        body { 
 | 
            /*overflow: hidden;*/ 
 | 
        } 
 | 
        .layui-table-box { 
 | 
            border-right: 1px solid #9F9F9F; 
 | 
            border-left: 1px solid #9F9F9F; 
 | 
        } 
 | 
    </style> 
 | 
</head> 
 | 
<body> 
 | 
<div style="padding: 25px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;"> 
 | 
    <span style="font-size: large; font-weight: bold">选择商品</span> 
 | 
</div> 
 | 
<div class="layui-card" style="padding: 0 20px; overflow: scroll;"> 
 | 
    <fieldset class="layui-elem-field site-demo-button" style="margin: 20px;"> 
 | 
        <legend>搜索栏</legend> 
 | 
        <div id="search-box" class="layui-form layui-card-header"> 
 | 
            <div class="layui-inline"> 
 | 
                <div class="layui-input-inline"> 
 | 
                    <input class="layui-input" type="text" name="matnr" placeholder="商品编号" autocomplete="off"> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div class="layui-inline"> 
 | 
                <div class="layui-input-inline"> 
 | 
                    <input class="layui-input" type="text" name="maktx" placeholder="商品名称" autocomplete="off"> 
 | 
                </div> 
 | 
            </div> 
 | 
            <!-- 日期范围 --> 
 | 
            <div class="layui-inline" style="width: 300px"> 
 | 
                <div class="layui-input-inline"> 
 | 
                    <input class="layui-input layui-laydate-range" name="modi_time" type="text" placeholder="起始时间 - 终止时间" autocomplete="off" style="width: 300px"> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div class="layui-inline"> 
 | 
                <div class="layui-input-inline"> 
 | 
                    <select name="mat_type"> 
 | 
                        <option value="">选择上架区域</option> 
 | 
                        <option value="1">单品区</option> 
 | 
                        <option value="2">高频混放区</option> 
 | 
                        <option value="3">低频混放区</option> 
 | 
                    </select> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div class="layui-inline"> 
 | 
                <div class="layui-input-inline"> 
 | 
                    <input class="layui-input" type="text" name="condition" placeholder="请输入" autocomplete="off"> 
 | 
                </div> 
 | 
            </div> 
 | 
            <!-- 待添加 --> 
 | 
            <div id="data-search-btn" class="layui-btn-container layui-form-item" style="display: inline-block"> 
 | 
                <button id="search" class="layui-btn layui-btn-primary layui-btn-radius" lay-submit lay-filter="search">搜索</button> 
 | 
            </div> 
 | 
        </div> 
 | 
    </fieldset> 
 | 
  
 | 
    <div class="layui-form"> 
 | 
        <table class="layui-hide" id="mat" lay-filter="mat"></table> 
 | 
    </div> 
 | 
</div> 
 | 
  
 | 
<script type="text/html" id="toolbar"> 
 | 
    <div class="layui-btn-container"> 
 | 
        <button class="layui-btn" id="btn-confirm" lay-event="confirm" style="">提取</button> 
 | 
    </div> 
 | 
</script> 
 | 
  
 | 
<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script> 
 | 
<script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script> 
 | 
<script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script> 
 | 
<script type="text/javascript" src="../../static/js/cool.js" charset="utf-8"></script> 
 | 
<script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script> 
 | 
  
 | 
</body> 
 | 
<script> 
 | 
    function getCol() { 
 | 
        let cols = [ 
 | 
            {type: 'checkbox', fixed: 'left'} 
 | 
        ]; 
 | 
        cols.push.apply(cols, matCols); 
 | 
        cols.push( 
 | 
            {field: 'modiUser$', align: 'center',title: '修改人员', hide: true}, 
 | 
            {field: 'modiTime$', align: 'center',title: '修改时间'} 
 | 
        ) 
 | 
        return cols; 
 | 
    } 
 | 
  
 | 
    layui.config({ 
 | 
        base: baseUrl + "/static/layui/lay/modules/" 
 | 
    }).use(['table','laydate', 'form', 'admin'], function() { 
 | 
        var table = layui.table; 
 | 
        var $ = layui.jquery; 
 | 
        var layer = layui.layer; 
 | 
        var layDate = layui.laydate; 
 | 
        var form = layui.form; 
 | 
        var admin = layui.admin; 
 | 
  
 | 
        // 物料查询数据表 
 | 
        matQueryTable = table.render({ 
 | 
            elem: '#mat', 
 | 
            headers: {token: localStorage.getItem('token')}, 
 | 
            url: baseUrl + '/mat/list/auth', 
 | 
            page: true, 
 | 
            limit: 7, 
 | 
            limits: [7, 10, 30,50,100], 
 | 
            even: true, 
 | 
            cellMinWidth: 50, 
 | 
            toolbar: '#toolbar', 
 | 
            cols: [getCol()], 
 | 
            request: { 
 | 
                pageName: 'curr', 
 | 
                pageSize: 'limit' 
 | 
            }, 
 | 
            parseData: function (res) { 
 | 
                return { 
 | 
                    'code': res.code, 
 | 
                    'msg': res.msg, 
 | 
                    'count': res.data.total, 
 | 
                    'data': res.data.records 
 | 
                } 
 | 
            }, 
 | 
            response: { 
 | 
                statusCode: 200 
 | 
            }, 
 | 
            done: function (res, curr, count) { 
 | 
                if (res.code === 403) { 
 | 
                    top.location.href = baseUrl + "/"; 
 | 
                } 
 | 
            } 
 | 
        }); 
 | 
  
 | 
        // 监听头工具栏事件 
 | 
        table.on('toolbar(mat)', function (obj) { 
 | 
            let checkStatus = table.checkStatus(obj.config.id); 
 | 
            let data = checkStatus.data; 
 | 
            switch(obj.event) { 
 | 
                case 'confirm': 
 | 
                    if (data.length === 0){ 
 | 
                        layer.msg("请选择数据", {icon: 2}); 
 | 
                        return; 
 | 
                    } 
 | 
                    parent.addTableData(data); 
 | 
                    break; 
 | 
            } 
 | 
        }); 
 | 
  
 | 
        // 搜索栏搜索事件 
 | 
        form.on('submit(search)', function (data) { 
 | 
            tableReload(); 
 | 
        }); 
 | 
  
 | 
        layDate.render({ 
 | 
            elem: '.layui-laydate-range' 
 | 
            ,type: 'datetime' 
 | 
            ,range: true 
 | 
        }); 
 | 
    }) 
 | 
  
 | 
    function tableReload() { 
 | 
        var searchData = {}; 
 | 
        $.each($('#search-box [name]').serializeArray(), function() { 
 | 
            searchData[this.name] = this.value; 
 | 
        }); 
 | 
        matQueryTable.reload({ 
 | 
            where: searchData 
 | 
        }); 
 | 
    } 
 | 
  
 | 
</script> 
 | 
</html> 
 |