{% extends "base.html" %}

{% block title %}Attendance · Face Attendance{% endblock %}

{% block content %}
<div class="page-header">
  <div>
    <p class="eyebrow">Reports</p>
    <h1>Attendance</h1>
  </div>
  {% if current_user.can_operate %}
  <a class="btn btn-primary" href="{{ url_for('attendance.kiosk') }}">Open kiosk</a>
  {% endif %}
</div>

<section class="content-section">
  {% if events %}
  <div class="table-responsive">
    <table class="table align-middle">
      <thead>
        <tr>
          <th>Person</th>
          <th>Employee ID</th>
          <th>Type</th>
          <th>Time</th>
          <th>Source</th>
          <th>Recorded by</th>
        </tr>
      </thead>
      <tbody>
        {% for event in events %}
        <tr>
          <td><a href="{{ url_for('people.detail', person_id=event.person.id) }}">{{ event.person.full_name }}</a></td>
          <td>{{ event.person.employee_id }}</td>
          <td><span class="badge text-bg-{{ 'success' if event.event_type == 'check_in' else 'warning' }}">{{ event.type_label }}</span></td>
          <td>{{ event.occurred_at.strftime("%Y-%m-%d %H:%M") }}</td>
          <td>{{ event.source }}</td>
          <td>{{ event.created_by.full_name if event.created_by else "System" }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% else %}
  <div class="empty-state">No attendance has been recorded yet.</div>
  {% endif %}
</section>
{% endblock %}