<!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.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
    <style type="text/css">
        .LAY-btns .layui-nav {padding-left:0;padding-right:10px;top:-4px;margin: 0 10px;border: 0;background-color: #009688;}
        .LAY-btns .layui-nav .layui-nav-item{line-height: 30px;}
        .LAY-btns .layui-nav .layui-nav-child{top:34px;}
        .LAY-btns .layui-nav .layui-nav-bar{display: none;}
        .LAY-btns .layui-nav .layui-nav-child dd.layui-this a{color:#333;background-color:#fff;}
        .LAY-btns .layui-nav .layui-nav-child dd.layui-this a:hover {background-color: #f2f2f2;color: #000;}
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body" pad15>
            <div class="layui-row">

                <div class="LAY-btns" style="margin-bottom: 10px;">
                    <button class="layui-btn layui-btn-sm" data-permission="material.add_consumable" id="btn_add"><i class="layui-icon layui-icon-add-1"></i>添加</button>
                    <button class="layui-nav" data-permission="material.import_consumable">
                        <div class="layui-nav-item">
                            <a href="javascript:;" style="color:#fff;">导入</a>
                            <dl class="layui-nav-child"> <!-- 二级菜单 -->
                                <dd><a href="#" id="import">执行导入</a></dd>
                                <dd><a href="#" id="btn_download">下载模板</a></dd>
                            </dl>
                        </div>
                    </button>
                    <button class="layui-btn layui-btn-sm" data-permission="material.export_consumable" id="btn_export"><i class="layui-icon layui-icon-download-circle"></i>导出</button>
                    <button class="layui-btn layui-btn-sm" data-permission="material.view_consumable" id="btn_query"><i class="layui-icon layui-icon-search"></i>查询</button>

                </div>
                <table class="layui-hide" id="datagrid" lay-filter="datagrid-operate"></table>
                <script type="text/html" id="datagrid-operate-bar">
                    <div class="layui-btn-group">
                    <a class="layui-btn layui-btn-xs" data-permission="material.add_consumable" lay-event="edit">修改</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs" data-permission="material.delete_consumable" lay-event="del">删除</a>
                    </div>
                </script>
            </div>
        </div>
    </div>
</div>
<div id="dlg_query" style="display: none">
    <div class="layui-card-body" pad15>
        <form class="layui-form" lay-filter="query-form-element">
            <div class="layui-row layui-col-space10 layui-form-item">
                <div class="layui-col-xs12 layui-col-sm12">
                    <label class="layui-form-label">名称：</label>
                    <div class="layui-input-block">
                        <input type="text" name="name" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-col-xs12 layui-col-sm12">
                    <label class="layui-form-label">代码：</label>
                    <div class="layui-input-block">
                        <input type="text" name="model" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-col-xs12 layui-col-sm12">
                    <label class="layui-form-label">是否在用：</label>
                    <div class="layui-input-block">
                        <select id="id_enabled" name="enabled">
                            <option value="">全部</option>
                            <option value="1">是</option>
                            <option value="0">否</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-form-item" style="display: none">
                <button class="layui-btn" lay-submit lay-filter="query-form-element" id="query_btn">查询</button>
            </div>
        </form>
    </div>
</div>

<script src="../../layuiadmin/layui/layui.js?t=1"></script>
<script>
    var _params = '';
    layui.config({
        base: '../../../layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table','laydate', 'form', 'upload'], function () {
        var $ = layui.$;
        var table = layui.table
            ,laydate = layui.laydate
            ,form = layui.form
            ,upload = layui.upload
            ,admin = layui.admin;

        table.render({
            elem: '#datagrid'
            ,url: '/material/consumable/data/'
            ,cols: [[
                {type:'checkbox',width:50}
                ,{field:'name', title:'名称', width:110}
                ,{field:'model', title:'代码', width:80}
                ,{field:'option_type_text', title:'类别', width: 80}
                ,{field:'unit', title:'单位', width:100}
                ,{field:'standard', title:'规格', width:100}
                ,{field:'warehouse_place', title:'库位', width:100}
                ,{field:'purchase_suggest_text', title:'库存预警', width: 150}
                ,{field:'stock_upper_limit', title:'库存上限', width: 100}
                ,{field:'stock_lower_limit', title:'库存下限', width: 100}
                ,{field:'enabled_text', title:'在用', width:60}
                ,{field:'notes', title:'备注', minWidth:150}
                ,{width:100, align:'left', fixed: 'right', toolbar: '#datagrid-operate-bar'}
            ]]
            ,page: true
            ,height: 'full-104'
            ,done:function () {
                    layui.index.removeNoPermButtons();
                }
        });
        //监听工具条
        table.on('tool(datagrid-operate)', function(obj){
            var data = obj.data;
            if(obj.event === 'del'){
                layer.confirm('确定要删除吗？', function(index){
                    layer.close(index);
                    layui.admin.req({
                        url: '/material/consumable/delete/?id='+data.id
                        ,done: function(res){
                            table.reload('datagrid',{});
                        }
                    });
                });
            } else if (obj.event === 'edit') {
                table.editdata = data;
                layer.open({
                    type: 2,
                    title: '修改',
                    shadeClose: false,
                    area: ['600px', '90%'],
                    btn: ['保存', '取消'],
                    yes: function (index, dom) {
                        layui.onSubmitChild = function (data) {
                            layer.close(index);
                            table.reload('datagrid', {});
                        };
                        layui.submitChild();
                    },
                    btn2: function (index, layero) {
                        layer.close(index);//关闭当前按钮
                    },
                    content: 'consumable_edit.html?id=' + data.id
                });
            }
        });
        $('#btn_export').on('click', function(){
            layui.admin.req({
                url: '/material/consumable/export/',
                data:_params,
                done: function (res) {
                    layui.view.download(res.data.filename);
                }
            });
        });
        $('#btn_download').on('click', function () {
            layui.view.download("/static/xls/耗材导入模板.xlsx");
        });
        upload.render({
            elem: '#import'
            ,url: '/material/consumable/import/'
            ,accept:'file'
            ,acceptMime:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
            ,exts:'xlsx'
            ,field:'excel_file'
            ,multiple:false
            ,done: function(res){
                if (res.code == 0) {
                    table.reload('datagrid',{});
                } else {
                    layer.msg(res.msg);
                }
            }
            ,error: function(){
                layer.msg('导入失败');
            }
        });
        $('#btn_add').on('click', function () {
            layer.open({
                type: 2,
                title: '新建',
                area: ['600px', '90%'],
                btn: ['保存', '取消'],
                yes: function (index, dom) {
                    layui.onSubmitChild = function (data) {
                        layer.close(index);
                        table.reload('datagrid', {});
                    };
                    layui.submitChild();
                },
                btn2: function (index, layero) {
                    layer.close(index);//关闭当前按钮
                },
                content: 'consumable_edit.html'

            });
        });
        $('#btn_query').on('click', function(){
            layer.open({
                type: 1,
                shadeClose: true,
                area: ['500px', '450px'],
                title: '查询',
                btn: ['查询'],
                yes: function(index, dom){
                    $('#query_btn').click();
                },
                content: $('#dlg_query')
            });
        });
        form.on('submit(query-form-element)', function(data){
            //layer.msg(JSON.stringify(data.field));
            _params = data.field;
            table.reload('datagrid', {
                where: data.field,
                page:{curr:1}
            });
            layer.closeAll();
            return false
        });

    })
</script>
</body>
</html>