{% extends "op_zz_frame.html" %}
{% block centercontent %}
<main class="ct-docs-content-col" role="main">
  <h1 class="ct-docs-page-h1-title" id="content">{{ _('Authorization') }}</h1>
  <p class="text-sm text-muted mb-4">{{ _('Authorization log description') }}</p>

  <div class="card shadow-sm border">
    <div class="card-header pb-0">
      <h6 class="mb-0 text-sm">{{ _('Recent authorization events') }}</h6>
    </div>
    <div class="card-body p-0">
      {% if logs %}
      <div class="table-responsive">
        <table class="table align-items-center mb-0">
          <thead>
            <tr>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Timestamp') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Wallbox') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Source') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('User') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Password') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Incoming Header') }}</th>
              <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ _('Used Header') }}</th>
            </tr>
          </thead>
          <tbody>
            {% for log in logs %}
            <tr>
              <td class="text-xs font-weight-bold">{{ log.created_at.strftime('%Y-%m-%d %H:%M:%S') if log.created_at else '-' }}</td>
              <td class="text-xs font-weight-bold">{{ log.chargepoint_id or '-' }}</td>
              <td class="text-xs">{{ log.used_auth_source or '-' }}</td>
              <td class="text-xs">{{ log.incoming_auth_username or '-' }}</td>
              <td class="text-xs">{{ log.incoming_auth_password or '-' }}</td>
              <td class="text-xs"><code class="text-wrap">{{ log.incoming_auth_header or '-' }}</code></td>
              <td class="text-xs"><code class="text-wrap">{{ log.used_auth_header or '-' }}</code></td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% else %}
      <div class="p-4">
        <p class="text-sm mb-0">{{ _('No authorization events have been recorded yet.') }}</p>
      </div>
      {% endif %}
    </div>
  </div>
</main>
{% endblock %}