{extend name="common/layout" /}
{block name="title"}用户管理{/block}
{block name="css"}
<link href="{$static}/js/bootstrap-table/bootstrap-table.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/user/add')}"><i class="ri-add-line"></i> 新增</a>
              <button type="button" class="btn btn-danger btn-sm" id="btn-delete"><i class="ri-delete-bin-line"></i> 删除</button>
              <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">
        <form class="row g-2 admin-toolbar mb-3" id="search-form">
          <div class="col-md-4 col-lg-3">
            <input type="text" class="form-control form-control-sm" name="keyword" placeholder="用户名/昵称/邮箱/手机">
          </div>
          <div class="col-md-3 col-lg-2">
            <select class="form-select form-select-sm" name="status">
              <option value="">全部状态</option>
              <option value="1">正常</option>
              <option value="0">禁用</option>
            </select>
          </div>
          <div class="col-auto">
            <button type="button" class="btn btn-primary btn-sm" id="btn-search">搜索</button>
          </div>
        </form>
        <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>
var $table = $('#data-table');
$table.bootstrapTable(AdminPage.tableDefaults({
    url: "{:url('/admin/user/list')}",
    queryParams: function (params) { return AdminPage.queryFromForm('#search-form', params); },
    columns: [{
        checkbox: true
    }, {
        field: 'id', title: 'ID', width: 60
    }, {
        field: 'username', title: '用户名'
    }, {
        field: 'nickname', title: '昵称'
    }, {
        field: 'email', title: '邮箱'
    }, {
        field: 'mobile', title: '手机号'
    }, {
        field: 'coins', title: '积分', width: 80
    }, {
        field: 'gold', title: '金币', width: 80
    }, {
        field: 'cny', title: '人民币', width: 90,
        formatter: function (v) {
            var n = parseFloat(v);
            if (isNaN(n)) n = 0;
            return n.toFixed(2);
        }
    }, {
        field: 'level_name', title: '等级', width: 100,
        formatter: function (v, row) {
            if (!v) return '-';
            var bg = row.level_color || '#64748b';
            return '<span class="badge rounded-pill" style="background:'+bg+';color:#fff">'+v+'</span>';
        }
    }, {
        field: 'community_role_label', title: '社区身份', width: 100,
        formatter: function (v, row) {
            if (row.community_role === 'manager') return AdminPage.badge(v || '社区管理', 'warning');
            return AdminPage.badge(v || '社区会员', 'secondary');
        }
    }, {
        field: 'status', title: '状态',
        formatter: function (value, row) {
            if (parseInt(value) === 1) {
                return '<a href="javascript:void(0)" onclick="toggleStatus('+row.id+',0)">'+AdminPage.badge('正常','success')+'</a>';
            }
            return '<a href="javascript:void(0)" onclick="toggleStatus('+row.id+',1)">'+AdminPage.badge('禁用','danger')+'</a>';
        }
    }, {
        field: 'login_ip', title: '登录IP', width: 130,
        formatter: function (v) { return v || '-'; }
    }, {
        field: 'login_time', title: '最后登录', width: 150,
        formatter: function (value) {
            if (!value) return '-';
            if (typeof value === 'string' && value.indexOf('-') >= 0) return value;
            var d = new Date(value * 1000);
            if (isNaN(d.getTime())) return '-';
            var p = function (n) { return n < 10 ? '0' + n : n; };
            return d.getFullYear() + '-' + p(d.getMonth()+1) + '-' + p(d.getDate()) + ' ' + p(d.getHours()) + ':' + p(d.getMinutes());
        }
    }, {
        field: 'create_time', title: '注册时间'
    }, {
        field: 'operate', title: '操作',
        formatter: function (value, row) {
            return '<a class="btn btn-sm btn-success me-1" href="{:url(\'/admin/user/edit\')}?id='+row.id+'">编辑</a>' +
                   '<button type="button" class="btn btn-sm btn-danger" onclick="deleteOne('+row.id+')">删除</button>';
        }
    }]
}));

$('#btn-search,#btn-refresh').on('click', function () { $table.bootstrapTable('refresh'); });
$('#btn-delete').on('click', function () {
    var rows = $table.bootstrapTable('getSelections');
    if (!rows.length) { AdminUI.notify('请选择数据', 'warning'); return; }
    AdminUI.confirm('确认删除选中数据？', function () {
        $.post("{:url('/admin/user/delete')}", { ids: rows.map(function (r) { return r.id; }) }, function (res) {
            AdminUI.result(res);
            if (res.code === 1) $table.bootstrapTable('refresh');
        }, 'json');
    });
});
function deleteOne(id) {
    AdminUI.confirm('确认删除？', function () {
        $.post("{:url('/admin/user/delete')}", { id: id }, function (res) {
            AdminUI.result(res);
            if (res.code === 1) $table.bootstrapTable('refresh');
        }, 'json');
    });
}
function toggleStatus(id, status) {
    $.post("{:url('/admin/user/status')}", { id: id, status: status }, function (res) {
        AdminUI.result(res);
        if (res.code === 1) $table.bootstrapTable('refresh');
    }, 'json');
}
</script>
{/block}