blog_tp6/app/sys/view/article/index.html

<article class="cl pd-10" style="min-width: 900px;">
    <div class="cl pd-5 bg-1 bk-gray mt-20">
        <span class="l">
            <a href="javascript:;" onclick="del_all()" class="btn btn-danger radius">
                <i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>
            <a class="btn btn-primary radius" href="javascript:save(0);">
                <i class="Hui-iconfont">&#xe600;</i> 添加文章</a>
        </span>
        <span class="select-box inline ml-50">
            <select name="cid" id="sel_option" class="select">
                <option value="0" {eq name='cid' value="0" }selected{/eq}>所有栏目</option>
                {foreach $category_tree as $value}
                <option value="{$value.id}" {eq name='cid' value="$value.id" }selected{/eq}>{$value.category_name}</option>
                {notempty name="value.child"}
                {foreach $value.child as $val}
                <option value="{$val.id}" {eq name='cid' value="$val.id" }selected{/eq}>--{$val.category_name}</option>
                {notempty name="val.child"}
                {foreach $val.child as $vo}
                <option value="{$vo.id}" {eq name='cid' value="$vo.id" }selected{/eq}>&nbsp;&nbsp;└ --{$vo.category_name}
                </option>
                {/foreach}
                {/notempty}
                {/foreach}
                {/notempty}
                {/foreach}
            </select>
        </span>
        <span class="r">共有数据：<strong id="total">{notempty name="data"}{$data->total()}{else/}0{/notempty}</strong>
            条</span>
    </div>
    <div id="edatalist">
        <table class="table table-border table-bordered table-bg">
            <thead>
                <tr class="text-c">
                    <th width="25px;">
                        <input type="checkbox" name="" value="">
                    </th>
                    <th width="80px;">ID</th>
                    <th style="min-width: 260px;">标题</th>
                    <th width="240px;">栏目</th>
                    <th width="160px;">发布者</th>
                    <th width="180px;">发布时间</th>
                    <th width="140px;">点击量</th>
                    <th width="80px;">排序</th>
                    <th width="200px;">操作</th>
                </tr>
            </thead>
            <tbody>
                {foreach $data as $val}
                <tr class="text-c va-m">
                    <td>
                        <input type="checkbox" value="{$val.id}" name="checkbox[]">
                    </td>
                    <td>{$val.id}</td>
                    <td class="text-l">
                        <a href="/index/article/detail/id/{$val.id}" style="text-decoration:none" title="浏览"
                            target="_blank">{$val.title}</a>
                    </td>
                    <td>{:isset($categories_name[$val['cid']]) ? $categories_name[$val['cid']] : ""}</td>
                    <td>{$val.username}</td>
                    <td>{$val.create_time}</td>
                    <td>{$val.hits}</td>
                    <td><input type="text" class="input-text input-sort" value="{$val.sort}" data-id="{$val.id}" style="text-align: center;"></td>
                    <td class="td-manage">
                        <a href="{:url('save?cid='.$val['cid'].'&id='.$val['id'])}" title="编辑"
                            style="text-decoration:none" class="ml-10">
                            <i class="Hui-iconfont">&#xe6df;</i>
                        </a>
                        <a href="javascript:;" title="删除" style="text-decoration:none" class="ml-10"
                            onClick="del(this,'{$val.id}')">
                            <i class="Hui-iconfont">&#xe6e2;</i>
                        </a>
                    </td>
                </tr>
                {/foreach}
            </tbody>
        </table>
    </div>
    <div class="cl pd-5 bg-1 bk-gray mt-20 ">
        <span class="r">{notempty name="data"}{$data->render()}{/notempty}</span>
    </div>
</article>
<script>
    $("#sel_option").change(function () {
        var cid = $("#sel_option").val();
        console.log(cid);
        if (cid) {
            window.location.href = '/admin/article/index?cid=' + cid;
        } else {
            window.location.href = '/admin/article/index';
        }
        return false;
    })

    function save(id) {
        var cid = $("#sel_option").val();
        // console.log(cid);
        // return false;
        if (!cid || cid == 0) {
            layer.msg("请选择栏目", {
                icon: 5,
                time: 2000
            });
            return false;
        }
        window.location.href = '/admin/article/save?id='+id+'&cid='+cid;
        return false;
    }

    // 排序
    $(".input-sort").change(function () {
        var sort = $(this).val();
        var id = $(this).data('id');
        // console.log(sort);
        // console.log(id);
        $.post('sort', {
                'id': id,
                'sort': sort
            }, function (res) {
                console.log(res);
                if (res) {
                    layer.msg('排序成功', {
                        icon: 1,
                        time: 2000
                    });
                } else {
                    layer.msg('排序失败', {
                        icon: 5,
                        time: 2000
                    });
                }
            }, 'json');
    })

    //列表删除条目
    function del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            $.post('delete', {
                'id': id
            }, function (data) {
                if (data.code == 2) {
                    $(obj).parents("tr").remove();
                    layer.msg(data.msg, {
                        icon: 1,
                        time: 1000
                    });
                } else {
                    layer.msg(data.msg, {
                        icon: 5,
                        time: 2000
                    });
                    return false;
                }
            }, 'json');
        });
    }

    //列表多选删除条目
    function del_all() {
        if (isNull(controller)) {
            url = 'del';
        } else {
            url = '/admin/' + controller + '/del';
        }
        var checkbox = $('.text-c input[name="checkbox[]"]');
        var ids = new Array();
        checkbox.each(function (x) {
            if (this.checked)
                ids.push(this.value);
        })

        var length = ids.length;

        if (length == 0) {
            layer.msg('请选择要删除的选项', {
                icon: 5,
                time: 1000
            });
            return false;
        }

        layer.confirm('确认要删除选中项吗？', function (index) {
            $.post('delete', {
                'id': ids
            }, function (data) {
                if (data.code == 2) {
                    checkbox.each(function (x) {
                        if (this.checked)
                            $(this).parents("tr").remove();
                    })
                    layer.msg(data.msg, {
                        icon: 1,
                        time: 1000
                    });
                } else {
                    layer.msg(data.msg, {
                        icon: 5,
                        time: 2000
                    });
                    return false;
                }
            }, 'json');
        });
    }

    /* 置顶 or 首页 */
    function top_home(action, obj, column, id) {
        var col = '首页';
        var style = 'style="margin-left: 10%"';
        if (column == 'top') {
            col = '置顶';
            style = '';
        }

        var value = 2;
        var cancel = '';
        var color = 'default';
        if (action == 'up') {
            value = 1;
            action = 'down';
            cancel = '取消';
            color = 'success';
        } else {
            action = 'up';
        }

        var text = "<a href=\"javascript:void(0);\" title='" + cancel + col + "' onClick=\"top_home('" + action + "',this,'" + column + "'," + id + ")\" style=\"text-decoration:none\">";
        text += '<span class="label label-' + color + ' radius" ' + style + '>' + col + '</span></a>';

        $.post('top', {
            'id': id,
            'column': column,
            'value': value
        }, function (data) {
            if (data.code == 2) {
                $(obj).after(text);
                $(obj).remove();
                layer.msg(data.msg, {
                    icon: 6,
                    time: 1000
                });
            } else {
                layer.msg(data.msg, {
                    icon: 5,
                    time: 1000
                });
            }
        }, 'json');
    }

    // 产品上加/下架 or 文章上线.下线
    function duty(action, obj, id) {
        var duty = 2,
            title = '上线',
            button = 'default',
            status = '下线';

        if (action == 'up') {
            duty = 1;
            title = '下线';
            status = '正常';
            button = 'success';
            action = 'down';
        } else {
            action = 'up';
        }


        var text = "<a href=\"javascript:void(0);\" title=" + title + " onClick=\"duty('" + action + "', this," + id + ")\" >";
        text += '<span class="label label-' + button + ' radius">' + status + '</span></a>';

        $.post("duty", {
            'id': id,
            'status': duty
        }, function (data) {
            if (data.code == 2) {
                $(obj).after(text);
                $(obj).remove();
                layer.msg(data.msg, {
                    icon: 6,
                    time: 1000
                });
            } else {
                layer.msg(data.msg, {
                    icon: 5,
                    time: 1000
                });
            }
        }, 'json');
    }
</script>