swiftadmin/app/admin/view/system/dictionary/index.html

<include file="/public/header" />
<!-- // 重定位Style -->
<style>
    .layui-card-header.layadmin-card-header-auto {
        border-bottom: 0px;
        padding-bottom: 0px;
    }

    .layui-card-header h5 {
        font-size: 16px;
    }

    #layui-dic_group {
        padding-bottom: 25px;
    }

    #layui-dic_group .layui-table-view .layui-table {
        width: 100%;
    }

    #layui-dic_group table thead tr:first-child i {
        display: none;
    }

    @media screen and (max-width: 1200px){
        .layui-table-tool-temp .layui-btn {
            height: 30px;
            line-height: 30px;
            padding: 0 10px;
            font-size: 12px;
        }

        .layui-table-tool-temp .layui-btn:nth-last-child(3) {
            display: none;
        }
    }

</style>
<div class="layui-col-md4">
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-header layadmin-card-header-auto" style="padding-bottom: 5px">
                <div class="layui-inline layui-hide" id="toolbar">
                    <!-- // 打开添加页面 -->
                    <button class="layui-btn icon-btn" lay-open="add" data-title="{:__('添加字典')}" data-area="398px" data-url="#editforms" callback="edit" >
                        <i class="layui-icon layui-icon-add-1"></i>{:__('添加')}
                    </button>
                    <!-- // 修改页面 -->
                    <button class="layui-btn icon-btn" lay-open="edit" data-title="{:__('修改字典')}" data-area="398px" data-url="#editforms" callback="edit" >
                        <i class="layui-icon layui-icon-edit"></i>{:__('修改')}
                    </button>
                    <!-- // 删除所有 -->
                    <button class="layui-btn icon-btn layui-btn-danger" lay-batch="" data-table="lay-tableGroup" data-url="{:url('/system/Dictionary/del')}" >
                      <i class="layui-icon layui-icon-delete"></i>{:__('删除')}
                    </button>
                </div>
            </div>
            <div class="layui-card-body" id="layui-dic_group">
                <!-- // 创建字典组实例 -->
                <table id="lay-tableGroup" lay-filter="lay-tableGroup"></table>
            </div>
        </div>
    </div>
</div>

<div class="layui-col-md8" >
    <!-- // 展示数据 -->
    <div class="layui-fluid">
        <div class="layui-card">
            <!-- // 默认操作按钮 -->
            <div class="layui-card-header layadmin-card-header-auto ">
            <div class="layui-form">
                <div class="layui-form-item">
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <select name="status">
                            <option value="">{:__('按状态查询')}</option>
                            <option value="2" >{:__('正常')}</option>                                 
                            <option value="1" >{:__('关闭')}</option>                             
                        </select>
                    </div>  
                </div>

                <div class="layui-inline"><div class="layui-input-inline ">
                    <input name="name" class="layui-input" type="text" placeholder="{:__('关键字搜索')}"/></div>
                </div>

                <div class="layui-inline" >
                    <!-- // 默认搜索 -->
                    <button class="layui-btn icon-btn" lay-filter="formSearch" lay-submit><i class="layui-icon layui-icon-search"></i>{:__('搜索')}</button>
                    <!-- // 打开添加页面 -->
                    <button class="layui-btn icon-btn" lay-open="" data-title="{:__('添加字典项')}" data-area="398px" data-url="#editforms" >
                        <i class="layui-icon layui-icon-add-1"></i>{:__('添加')}
                    </button>
                    <!-- // 删除所有 -->
                    <button class="layui-btn icon-btn layui-btn-danger" lay-batch data-table="lay-tableList"  data-url="{:url('/system/Dictionary/del')}" >
                      <i class="layui-icon layui-icon-delete"></i>{:__('删除')}
                    </button>
                </div>
                </div>
            </div>   
            </div>

            <!-- // 创建数据实例 -->
            <table id="lay-tableList" lay-filter="lay-tableList"></table>        
        </div>
    </div>
</div>

<!-- // 添加编辑数据 -->
<section id="editforms" class="layui-hide">
<div class="layui-fluid layui-bg-white">
    <form class="layui-form layui-form-fixed" lay-filter="editforms">
    <input type="text" name="id" hidden="">
    <input type="text" class="pid" name="pid" value="{$pid}" hidden="">
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red; ">* </span>{:__('字典名称')}</label>
        <div class="layui-input-block">
            <input name="name" placeholder="{:__('请输入字典名称')}" type="text" class="layui-input"  lay-verify="required" />
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">{:__('字典值')}</label>
        <div class="layui-input-block">
            <input name="value" placeholder="{:__('请输入字典值')}" class="layui-input"  lay-verify="required" />
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">{:__('排序号')}</label>
        <div class="layui-input-block">
            <input name="sort" placeholder="{:__('默认自动生成')}" type="number" class="layui-input" />
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">{:__('字典备注')}</label>
        <div class="layui-input-block">
            <textarea name="content" id="content" style="min-height: 80px;" 
            placeholder="{:__('请输入字典备注')}" class="layui-textarea"></textarea>
        </div>
    </div>

    <div class="layui-footer layui-form-item layui-center">
        <button class="layui-btn layui-btn-primary" type="button" sa-event="closePageDialog" >{:__('取消')}</button>
        <button class="layui-btn" lay-add="{:url('/system/Dictionary/add')}" lay-edit="{:url('/system/Dictionary/edit')}"
                lay-filter="submitPage" lay-submit>{:__('提交')}</button>
    </div>
    </form>
</div>
</section>

<!-- // 列表编辑框 -->
<script type="text/html" id="tableBar"> 
    <a class="layui-table-text" data-title="{:__('编辑字典项')}" data-url="#editforms" data-area="398px" lay-event="edit" >{:__('编辑')}</a>
    <div class="layui-divider layui-divider-vertical"></div>
    <a class="layui-table-text" data-url="{:url('/system/Dictionary/del')}?id={{d.id}}" lay-event="del" >{:__('删除')}</a>
</script>

<include file="/public/footer" />
<script>
    layui.use(['admin','jquery','table','form'], function () {

        let admin = layui.admin;
        let $ = layui.jquery;
        let table = layui.table;
        let form = layui.form;

        // 定义表格URL
        let tableURL = "{:url('/system/Dictionary/index')}";

        // 字典类表格
        let isClass = table.render({
            elem: "#lay-tableGroup"
            , url: tableURL + "?pid=0"
            , toolbar: '#toolbar'
            , defaultToolbar: []
            , page: true
            , limit: 18
            , cols: [[
                {type: 'radio', align: 'left', title: '{:__("ID")}'},
                {field: 'name', align: 'center', title: '{:__("字典类型")}'},
                {field: 'value', align: 'center', title: '{:__("字典值")}'},
            ]]
        })

        // 基础表格
        let isTable = table.render({
            elem: "#lay-tableList"
            ,url: tableURL
            ,page: true
            ,limit: 18
            ,cols: [[
                {type: 'checkbox'},
                {field: 'id', align: 'center',sort: true,width: 80,  title: 'ID'},
                {field: 'name', align: 'center', title: '{:__("字典项名称")}'},
                {field: 'value', align: 'center', title: '{:__("字典值")}'},
                {field: 'sort', align: 'center',  width: 135, title: '{:__("排序号")}'},
                {field: 'create_time', align: 'center', width: 180,title: '{:__("创建时间")}'},
                {align: 'center', toolbar: '#tableBar',width: 250, title: '{:__("操作")}'},
            ]]
        })

        table.on('radio(lay-tableGroup)', function(obj){
            let data = table.checkStatus('lay-tableGroup').data;
            let ids = [];
            if (data.length) {
                for (const key in data) {
                   ids.push(data[key].id);
                }

                let url = tableURL + '?pid=' + ids.join(',');
                table.reloadData('lay-tableList', {
                    url: url
                });

                // 获取最后点击
                if (obj.checked === true) {
                    $('#editforms').find('.pid').attr('value',obj.data.id);
                }
            }
        });

        // 全局回调函数
        admin.callback.edit = function(clickthis,colletction,config) {

            let status = true;
            let action = clickthis.attr('lay-open');
            let data = table.checkStatus('lay-tableGroup').data;
            if (action === 'edit') {
                status = false;
                form.val('editforms',data[0]);
            }

            form.on("submit(submitPage)",function(post){
                let pageThat = $(this),
                _pageUrl = !status ? pageThat.attr('lay-edit') : pageThat.attr('lay-add');
                post.field.pid = 0;
                // 开始POST提交数据
                $.post(_pageUrl,
                    post.field, function(res){
                        if (res.code === 200) {
                            table.reloadData('lay-tableGroup');
                            table.reloadData('lay-tableList');
                            // 关闭当前窗口
                            layer.msg(res.msg);
                            layer.close(colletction.index);
                            pageThat.attr("disabled",true);
                        }
                        else {
                            layui.show.error(res.msg);
                        }

                }, 'json');

                return false;
            })
        }
    });
</script>