@model IReadOnlyList<MemberCenter.Application.Models.Admin.AuditLogDto>

<div class="admin-page-title">
  <h1>@L["Audit Logs"]</h1>
</div>

<div class="data-table-shell">
  <table class="data-table audit-log-table">
    <thead>
      <tr>
        <th class="data-table-index">#</th>
        <th>@L["Action"]</th>
        <th>@L["Actor"]</th>
        <th>@L["Payload"]</th>
        <th>@L["Time"]</th>
      </tr>
    </thead>
    <tbody>
    @if (!Model.Any())
    {
      <tr>
        <td colspan="5" class="data-table-empty">@L["No audit logs."]</td>
      </tr>
    }
    else
    {
      var rowNumber = 1;
      foreach (var log in Model)
      {
        var payloadModalId = $"audit-payload-{rowNumber}";
        <tr>
          <td class="data-table-index">@rowNumber.ToString("000")</td>
          <td>@log.Action</td>
          <td>@log.ActorType @log.ActorId</td>
          <td class="audit-payload-cell">
            <a class="audit-payload-link" href="#@payloadModalId" aria-label="@L["View full payload"]">
              <code>@log.PayloadJson</code>
            </a>
            <div id="@payloadModalId" class="admin-modal" role="dialog" aria-modal="true" aria-labelledby="@(payloadModalId)-title">
              <a class="admin-modal-backdrop" href="#" aria-label="@L["Close"]"></a>
              <div class="admin-modal-panel admin-modal-panel-wide">
                <a class="admin-modal-close" href="#" aria-label="@L["Close"]">×</a>
                <h2 id="@(payloadModalId)-title">@L["Payload"]</h2>
                <pre class="audit-payload-full">@log.PayloadJson</pre>
              </div>
            </div>
          </td>
          <td>@log.CreatedAt.ToString("yyyy/MM/dd HH:mm")</td>
        </tr>
        rowNumber++;
      }
    }
    </tbody>
  </table>
</div>
