<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>企业管理</title>
    <link rel="stylesheet" href="/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/css/public.css" media="all">
    <link rel="stylesheet" href="/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <style>
        .site-dropdown-demo .layui-menu li:hover{background-color: #333;}
    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <!-- 上方搜索栏 -->
        <fieldset class="table-search-fieldset">
            <legend>搜索</legend>
            <div class="layui-form layui-form-pane">
                <div class="layui-form-item">
                    <!-- 搜索【工作流名】和【权限字符】-->
                    <div class="layui-inline">
                        <label class="layui-form-label" id="demo8">企业名称</label>
                        <div class="layui-input-inline">
                            <input type="text" id="companyName" autocomplete="off" class="layui-input" placeholder="请输入企业名称"/>
                        </div>

                    </div>
                    <!-- 搜索按钮 -->
                    <div class="layui-inline">
                        <button type="button" class="layui-btn layui-btn-primary layui-border-green btn-role-action" data-type="search">
                            <i class="layui-icon layui-icon-search"></i> 搜 索
                        </button>
                        <button type="button" class="layui-btn layui-btn-primary layui-border-box btn-role-action" data-type="refresh">
                            <i class="layui-icon layui-icon-refresh"></i> 清 空
                        </button>
                    </div>
                </div>
            </div>
        </fieldset>
        <!-- 表格 -->
        <table class="layui-hide" id="table-data" lay-filter="table-data"></table>
    </div>
</div>

<script type="text/html" id="toolbar-table">
    <div class="layui-btn-container">
        <button style="background-color: #154d96;" class="layui-btn layui-btn-sm layuimini-btn-primary" lay-event="btn-refresh"><i class="fa fa-refresh"></i></button>
        <button style="background-color: #154d96;" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="btn-add">
            <i class="fa fa-plus"></i> 添加企业
        </button>
    </div>
</script>

<!-- 【行内按钮】表格每行末尾的操作按钮-->
<script type="text/html" id="table-tool">
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="btn-edit">编辑</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="btn-delete">删除</a>
</script>
<!--引入JS文件-->
<script src="/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="/js/jquery-1.10.2.min.js" charset="utf-8"></script>
<script>
    layui.use(['table','dropdown', 'util', 'layer',], function () {
        let dropdown = layui.dropdown,
            util = layui.util,
            layer = layui.layer,
            $ = layui.jquery,
            form = layui.form,
            table = layui.table;

        let currPage = 1
        let table_data = table.render({
            even: true,
            elem: '#table-data',
            url: '/cloud/account/company/list',
            response: {statusCode: 200},
            toolbar: '#toolbar-table',
            defaultToolbar: ['filter'],
            title: '企业信息',
            height: 'full-200',
            cols: [
                [
                    {field: 'companyName', title: '企业名称',align: 'center', fixed: 'left'},
                    {field: 'creatorName', title: '创建人',align: 'center'},
                    {field: 'createTime', title: '创建时间',align: 'center'},
                    {fixed: 'right', title: '操作', align: 'center', toolbar: '#table-tool', width: 200}
                ]
            ],
            page: {
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'], // 自定义分页布局
                curr: 1, // 初始当前页
                limits: [30, 50, 100,500,1000], // 自定义每页显示条数选择项
                limit: 30 // 默认每页显示条数
            },
            done: function (res, curr, count) {
                if (res.data.length === 0 && curr > 1) {
                    table_data.reload({page: {curr: curr - 1}})
                }
                currPage = curr
            }
        });


        let active = {
            search: function () {
                table_data.reload({
                    page: {curr: 1},
                    where: {
                        companyName: $('#companyName').val()
                    }
                });
            },
            refresh: function () {
                table_data.reload({
                    page: {curr: 1},
                    where: {companyName: ""}
                });
                $('#companyName').val('')
            }
        };
        $('.btn-role-action').on('click', function () {
            let type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        table.on('toolbar(table-data)', function (obj) {
            let that = this;
            switch (obj.event) {
                // 【刷新】按钮
                case "btn-refresh":
                    table_data.reload()
                    break;
                case "btn-add":
                    layer.open({
                        title: '添加信息',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: false,
                        area: ['800px', '700px'],
                        btn: ["确定", "取消"],
                        content: '/cloud/account/company/add',
                        yes: function(index, layero){
                            let body = layer.getChildFrame('body',index);

                            let companyName = body.find("input[name='companyName']").val();
                            if (companyName.length <= 0) {
                                layer.msg('请输入企业名称！');
                                return;
                            }

                            let dataSet = {
                                "companyName" : companyName
                            }

                            $.post("/cloud/account/company/addSave", dataSet, function (data) {
                                if (data.code === 200) {
                                    layer.open({
                                        type: 0,
                                        title: data.msg,
                                        closeBtn: 0,
                                        btn: ["继续添加", "关闭"],
                                        content: '是否继续添加？',
                                        btn1: function (index) {
                                            layer.close(index)
                                        },
                                        btn2: function (index2) {
                                            layer.close(index2);
                                            layer.close(index);
                                            table_data.reload();
                                        }
                                    });
                                } else {
                                    layer.msg(data.msg, {icon: 2});
                                }
                            });
                        }
                        ,btn2: function(index, layero){

                        },
                    });
                    break;
            }
        });

        table.on('tool(table-data)', function (obj) {
            let data = obj.data;
            let layEvent = obj.event;
            switch (layEvent) {
                // 【编辑】按钮响应事件
                case "btn-edit":
                    layer.open({
                        title: '编辑信息',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: false,
                        area: ['800px', '700px'],
                        content: '/cloud/account/company/edit/' + data.id,
                        btn: ["确定", "取消"],
                        yes: function(index, layero){
                            let body = layer.getChildFrame('body',index);

                            let companyName = body.find("input[name='companyName']").val();
                            if (companyName.length <= 0) {
                                layer.msg('请输入企业名称！');
                                return;
                            }

                            let dataSet = {
                                "id" : data.id,
                                "companyName" : companyName
                            }

                            $.post("/cloud/account/company/editSave", dataSet, function (data) {
                                if (data.code === 200) {
                                    layer.msg(data.msg, {time: 3000, icon: 1});
                                    table_data.reload();
                                    layer.close(index);

                                } else {
                                    layer.msg(data.msg, {icon: 2});
                                }
                            });
                        }
                        ,btn2: function(index, layero){

                        }
                    });
                    break;
                // 【删除】按钮响应事件
                case "btn-delete":
                    layer.confirm('确认要删除 <b>' + data.companyName + ' </b>吗？', {
                        title: false,
                        btn: ['确定', '取消'],
                        closeBtn: 0,        // 不显示右上角的关闭按钮
                        // 按钮【确定】的回调
                        btn1: function (index) {
                            // 加载层
                            let index_loading = layer.load(1, {
                                shade: [0.2, '#fff'] //0.1透明度的白色背景
                            });
                            $.post("/cloud/account/company/delete", {id: data.id}, function (data2) {
                                // 关闭加载层
                                layer.close(index_loading)
                                if (data2.code === 200) {
                                    table_data.reload()
                                    layer.msg(data2.msg, {time: 3000, icon: 1});
                                } else {
                                    layer.msg(data2.msg, {time: 3000, icon: 2});
                                }
                            });
                        },
                    });
                    break;
            }
        });


    });

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