{extend name="common/layout" /}
{block name="title"}菜单管理{/block}
{block name="css"}
<link href="{$static}/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<link href="{$static}/js/jquery-treegrid/jquery.treegrid.min.css" rel="stylesheet">
{/block}
{block name="content"}
<div class="row">
  <div class="col-12">
    <div class="card">
      <div class="card-header">
        <div class="row align-items-center g-2">
          <div class="col"><h4 class="card-title mb-0">菜单管理</h4></div>
          <div class="col-auto">
            <div class="d-flex flex-wrap gap-2">
              <a class="btn btn-success btn-sm" href="{:url('/admin/menu/add')}"><i class="ri-add-line"></i> 新增</a>
              <button type="button" class="btn btn-light btn-sm" id="btn-refresh"><i class="ri-refresh-line"></i> 刷新</button>
            </div>
          </div>
        </div>
      </div>
      <div class="card-body">
        <table id="data-table"></table>
      </div>
    </div>
  </div>
</div>
{/block}
{block name="js"}
<script src="{$static}/js/bootstrap-table/bootstrap-table.min.js"></script>
<script src="{$static}/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script src="{$static}/js/jquery-treegrid/jquery.treegrid.min.js"></script>
<script src="{$static}/js/bootstrap-table/extensions/treegrid/bootstrap-table-treegrid.min.js"></script>
<script>
$('#data-table').bootstrapTable(AdminPage.tableDefaults({
    url: "{:url('/admin/menu/list')}",
    pagination: false,
    idField: 'id', parentIdField: 'pid', treeShowField: 'title',
    responseHandler: function (res) { return res.rows || res.data || []; },
    columns: [
        { field: 'title', title: '菜单名称' },
        { field: 'icon', title: '图标' },
        { field: 'url', title: '链接' },
        { field: 'name', title: '权限标识' },
        { field: 'type', title: '类型', formatter: function (v) { return parseInt(v)===1?'目录':'菜单'; } },
        { field: 'sort', title: '排序', width: 70 },
        { field: 'status', title: '状态', formatter: function (v) {
            return parseInt(v)===1 ? AdminPage.badge('显示','success') : AdminPage.badge('隐藏','danger');
        }},
        { field: 'operate', title: '操作', formatter: function (v, row) {
            return '<a class="btn btn-sm btn-success me-1" href="{:url(\'/admin/menu/edit\')}?id='+row.id+'">编辑</a>' +
                   '<button type="button" class="btn btn-sm btn-danger" onclick="del('+row.id+')">删除</button>';
        }}
    ],
    onLoadSuccess: function () {
        $('#data-table').treegrid({ treeColumn: 0, initialState: 'expanded' });
    }
}));
$('#btn-refresh').on('click', function () { $('#data-table').bootstrapTable('refresh'); });
function del(id) {
    AdminUI.confirm('确认删除？', function () {
        $.post("{:url('/admin/menu/delete')}", { id: id }, function (res) {
            AdminUI.result(res); if (res.code === 1) location.reload();
        }, 'json');
    });
}
</script>
{/block}