{extend name="admin@public/basic" /}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/css/admin/public.css" media="all"/>
{/block}

{block name="cotent"}
<form class="layui-form">

    <!--顶部操作栏--开始-->
    <blockquote id="searchBlock" class="layui-elem-quote quoteBox">

        <div class="layui-form-item layui-inline">
            <label class="layui-form-label-99admin">菜单名称</label>
            <div class="layui-input-inline">
                <input type="text" id="title" class="layui-input" placeholder="请输入菜单名称"/>
            </div>
        </div>

        <div class="layui-form-item layui-inline">
            <label class="layui-form-label-99admin">菜单状态</label>
            <div class="layui-input-inline">
                <select id="status" lay-filter="status">
                    <option value="">请选择菜单状态</option>
                    {foreach $status as $vo}
                    <option value="{$vo.id|default=''}">{$vo.title|default=''}</option>
                    {/foreach}
                </select>
            </div>
        </div>

        <div class="layui-form-item layui-inline">
            <label class="layui-form-label-99admin">菜单链接</label>
            <div class="layui-input-inline">
                <input type="text" id="href" class="layui-input href" placeholder="请输入菜单链接"/>
            </div>
        </div>

        <div class="layui-form-item layui-inline">
            <label class="layui-form-label-99admin">创建时间</label>
            <div class="layui-input-inline">
                <input type="text" id="create_at" class="layui-input" id="create_at" placeholder="请选择创建时间">
            </div>
        </div>

        <div class="layui-form-item layui-inline">
            <a class="layui-btn" data-search="currentTableId">搜索</a>
        </div>

        {if auth("$thisClass/add")}
        <div class="layui-form-item layui-inline">
            <a class="layui-btn layui-btn-normal" data-open='{:url("$thisClass/add")}' data-title="添加文章">添加</a>
        </div>
        {/if}

        {if auth("$thisClass/del")}
        <div class="layui-form-item layui-inline">
            <a class="layui-btn layui-btn-danger layui-btn-normal" data-title="确定批量删除？" data-del-all='{:url("$thisClass/del")}' data-table-id="currentTableId">删除</a>
        </div>
        {/if}

    </blockquote>
    <!--顶部操作栏--结束-->

    <!--主表单渲染--开始-->
    <table id="currentTable" lay-filter="currentTable"></table>
    <!--主表单渲染--结束-->

    <!--表单模板绑定--开始-->
    <script type="text/html" id="checkStatus">
        <input type="checkbox" name="{{d.id}}" value="{{d.status}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="modifyStatus" {{ d.status== 1 ? 'checked' : '' }}>
    </script>
    <!--表单模板绑定--结束-->

    <!--表单操作栏--开始-->
    <script type="text/html" id="currentTableBar">

        {if auth("$thisClass/add")}

        {{# if (d.is_add) { }}
        <a class="layui-btn layui-btn-xs" value="{{d.id}}" data-open='{:url("$thisClass/add")}?pid={{d.id}}' data-title="添加菜单">添加下级</a>
        {{# } else { }}
        <a class="layui-btn layui-btn-xs color-99admin-gray" value="{{d.id}}">添加下级</a>
        {{# } }}

        {/if}

        {if auth("$thisClass/edit")}
        <a class="layui-btn layui-btn-xs" data-open='{:url("$thisClass/edit")}?id={{d.id}}' data-title="修改菜单信息">编辑</a>
        {/if}

        {if auth("$thisClass/del")}
        <a class="layui-btn layui-btn-xs layui-btn-danger" data-title="确定批量删除？" data-del='{:url("$thisClass/del")}?id={{d.id}}'>删除</a>
        {/if}

    </script>
    <!--表单操作栏--结束-->
</form>
{/block}

{block name="script"}
<script>

    /**
     * 生成表单
     */
    $.form.table('current', '{:url("$thisRequest")}?type=ajax', [[
        {type: "checkbox", fixed: "left", width: 50,},
        {field: 'sort', title: '排序', width: 100, edit: 'text', align: "center"},
        {
            field: 'icon', title: '图标', width: 100, align: 'center', templet: function (d) {
                /**判断图标类型：layuicms自带、fa图标、layui图标**/
                if (d.icon.indexOf("icon-") != -1) {
                    return '<span class="seraph  ' + d.icon + '" data-icon="' + d.icon + '"></span>';
                } else if (d.icon.indexOf("fa-") != -1) {
                    return '<span class="fa  ' + d.icon + '" data-icon="' + d.icon + '"></span>';
                } else {
                    return '<span class="layui-icon">' + d.icon + '</span>';
                }
            }
        },
        {field: 'title', title: '菜单名称', minWidth: 200, align: 'left'},
        {
            field: 'href', title: '链接地址', minWidth: 300, align: 'center', templet: function (d) {
                return '<a class="layui-blue" href="/' + d.href + '" target="_blank">' + d.href + '</a>';
            }
        },
        {field: 'status', title: '启用状态', minWidth: 110, templet: '#checkStatus', unresize: true, align: "center"},
        /**{if auth("$thisClass/add") || auth("$thisClass/edit") || auth("$thisClass/del")}**/
        {title: '操作', minWidth: 110, templet: '#currentTableBar', fixed: "right", align: "center"},
        /**{/if}**/
    ]], false);

    /**
     * 日期范围
     */
    $.laydate.range('create_at');

    /**
     * 监听字段值编辑
     */
    $.form.editField('currentTable', '{:url("$thisRequest")}');

    /**
     * 修改状态
     */
    $.form.switch('modifyStatus', '{:url("$thisClass/status")}');
</script>
{/block}