当前位置 博文首页 > fareast_mzh的博客:layui表格id, lay-filter命名 必须以 LAY-ta

    fareast_mzh的博客:layui表格id, lay-filter命名 必须以 LAY-ta

    作者:[db:作者] 时间:2021-08-24 18:44

    <div class="layui-card">
        <!--<div class="layui-card-header">示例表头</div>-->
        <div class="layui-card-body">
            <table class="layui-hide" id="LAY-table-operate" lay-filter="LAY-table-operate"></table>
            <script type="text/html" id="test-table-switchTpl">
                <input type="checkbox" name="enabled" lay-skin="switch" lay-text="启用|禁用"
                       lay-filter="test-table-enabledDemo"
                       value="{{ d.enabled }}" data-json="{{ encodeURIComponent(JSON.stringify(d)) }}" {{
                       d.enabled==
                       1 ? 'checked' : '' }}>
            </script>
            <button id="J_bulkDelete" class="layui-btn layui-btn-xs layui-btn-danger margin-top10" title="批量删除规则">
                <!--<i class="layui-icon">&#xe640;</i>-->
                批量删除
            </button>
        </div>
        <script type="text/html" id="test-table-operate-barDemo">
            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
        </script>
    </div>

    <script>

    layui.use(['admin', 'table'], function () {
        var table = layui.table, $ = layui.jquery, t, config, cur_page = $.cookie("cur_page") || 1;
    
        config = {
            elem: '#LAY-table-operate',
            // url: window.CONTEXT_PATH + "/monitor/listURIRules",
            cellMinWidth: 30, // 全局定义常规单元格的最小宽度,layui 2.2.1 新增,
            cols: [[
                {type: "checkbox", fixed: "left"},
                {field: 'id', width: 40, title: 'ID', sort: true},
                {field: 'uri', title: '接口URI'},
                {field: 'name', title: '接口描述'},
                {field: 'scan_freq', width: 40, title: '扫描频率'},
                {field: 'response_seconds', width: 60, title: '响应'},
                // {field:'email', title: '邮箱'},
                // {field:'mobile', title: '手机号'},
                {field: 'enabled', title: '启用', width: 80, templet: '#test-table-switchTpl', unresize: true},
                {width: 178, align: 'center', fixed: 'right', toolbar: '#test-table-operate-barDemo'}
            ]],
            page: {curr: 1, limit: 10},
            done: function (res, cur_page, count) {
                var pager = t.config.page, $aa;
                console.log(pager);
                var $pager = $("#" + pager.elem);
                $aa = $pager.find("a");
                $aa.on("click", function (e) {
                    var cur = this.getAttribute("data-page");
                    $.cookie("cur_page", cur);
                });
                var cp = parseInt($.cookie("cur_page")), $input = $pager.find(".layui-input"),
                    $btn = $pager.find(".layui-laypage-btn");
                if (cur_page !== cp) {
                    $input.val(cp);
                    // trigger($btn.get(0), "click");
                }
                $btn.on("click", function () {
                    $.cookie("cur_page", $input.val());
                });
                $input.on("keydown", function (e) {
                    if (e.keyCode === 13) {
                        e.preventDefault();
                        $.cookie("cur_page", $input.val());
                    }
                });
    
                /**
                 * 批量删除规则
                 */
                var $del = $("#J_bulkDelete");
                $del.off("click", "**");
                $del.on("click", function() {
                    var checkStatus = table.checkStatus('LAY-table-operate'),
                        checkData = checkStatus.data; //得到选中的数据
                    console.log(checkData);
    
                    if (checkData.length === 0) {
                        return layer.msg('请选择数据');
                    }
    
                    layer.confirm('确定删除吗?', function (index) {
                        var reqBody = checkData.reduce(function(acc, cur) {
                            acc += cur.id + ",";
                            return acc;
                        }, "");
                        reqBody = reqBody.substr(0, reqBody.length-1);
                        console.log(reqBody);
                        $.ajax({
                            type: 'POST',
                            url: window.CONTEXT_PATH + "/monitor/bulkDeleteRule",
                            processData: false,
                            data: reqBody
                        }).done(function(data) {
                            reload_table({});
                            layer.msg("删除了" + data.count + "条规则");
                        });
                    });
                });
            },
            text: "加载异常"
        };
        config.url = window.CONTEXT_PATH + "/monitor/listURIRules";
        if (param !== undefined) {
            config.url += '?' + $.param(param);
        }
    
        // 设定渲染表格 初始显示页码
        config.page.curr = cur_page;
        t = table.render(config);

    // ...

    });

    </script>

    ?

    https://download.csdn.net/download/fareast_mzh/12368529

    cs
    下一篇:没有了