{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">
            <button type="button" class="btn btn-light btn-sm" id="btn-refresh"><i class="ri-refresh-line"></i> 刷新</button>
          </div>
        </div>
      </div>
      <div class="card-body">
        <p class="text-muted mb-3">统一查询积分 / 金币流水，覆盖红包、付费阅读、抽奖、签到、充值等所有资产变动。</p>
        <form class="row g-2 admin-toolbar admin-toolbar-nowrap mb-3" id="search-form">
          <div class="col">
            <input type="text" class="form-control form-control-sm" name="keyword" placeholder="用户名/昵称/UID">
          </div>
          <div class="col">
            <select class="form-select form-select-sm" name="currency">
              <option value="">全部币种</option>
              <option value="coins">积分</option>
              <option value="gold">金币</option>
            </select>
          </div>
          <div class="col">
            <select class="form-select form-select-sm" name="type">
              <option value="">全部类型</option>
              {foreach $type_labels as $typeKey => $label}
              <option value="{$typeKey}">{$label}</option>
              {/foreach}
            </select>
          </div>
          <div class="col">
            <select class="form-select form-select-sm" name="direction">
              <option value="">收入/支出</option>
              <option value="in">收入</option>
              <option value="out">支出</option>
            </select>
          </div>
          <div class="col">
            <select class="form-select form-select-sm" name="actor_type">
              <option value="">全部身份</option>
              <option value="user">会员</option>
              <option value="admin">管理员</option>
            </select>
          </div>
          <div class="col">
            <input type="text" class="form-control form-control-sm js-datepicker" name="start_time" placeholder="开始日期" autocomplete="off" data-date-format="yyyy-mm-dd">
          </div>
          <div class="col">
            <input type="text" class="form-control form-control-sm js-datepicker" name="end_time" placeholder="结束日期" autocomplete="off" data-date-format="yyyy-mm-dd">
          </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/asset_log/list')}",
    pageSize: 20,
    pageList: [20, 50, 100],
    queryParams: function (params) { return AdminPage.queryFromForm('#search-form', params); },
    columns: [{
        field: 'id', title: 'ID', width: 70
    }, {
        field: 'actor_name', title: '用户',
        formatter: function (v, row) {
            var name = v || ('#' + (row.actor_id || 0));
            if (row.actor_username && row.actor_username !== v) {
                name += ' <small class="text-muted">(' + row.actor_username + ')</small>';
            }
            name += ' <small class="text-muted">UID ' + (row.actor_id || 0) + '</small>';
            return name;
        }
    }, {
        field: 'actor_type_label', title: '身份', width: 80
    }, {
        field: 'currency_label', title: '币种', width: 70
    }, {
        field: 'type_label', title: '类型', width: 120
    }, {
        field: 'delta_text', title: '变动', width: 90,
        formatter: function (v, row) {
            var n = parseInt(row.delta, 10) || 0;
            if (n > 0) return '<span class="text-success">' + (v || ('+' + n)) + '</span>';
            if (n < 0) return '<span class="text-danger">' + (v || n) + '</span>';
            return v || '0';
        }
    }, {
        field: 'balance', title: '余额', width: 90
    }, {
        field: 'remark', title: '备注',
        formatter: function (v) {
            return v ? $('<div/>').text(v).html() : '—';
        }
    }, {
        field: 'create_time_text', title: '时间', width: 160
    }]
}));

$('#btn-search,#btn-refresh').on('click', function () { $table.bootstrapTable('refresh'); });
$('#search-form').on('submit', function (e) {
    e.preventDefault();
    $table.bootstrapTable('refresh');
});
</script>
{/block}