{% extends 'base.html' %}
{% block content %}
<div class="container-fluid mt-3" style="max-width: 1200px;">
  <div class="card shadow-sm border-0">
    <div class="card-header d-flex justify-content-between align-items-center bg-white">
      <h5 class="mb-0">
        <i class="bi bi-clock-history me-2"></i>
        Desktime Overview
      </h5>
      <form class="d-flex" method="get">
        <input type="text"
               class="form-control form-control-sm me-2"
               name="search"
               placeholder="Search by name or code"
               value="{{ search or '' }}">
        <button class="btn btn-sm btn-primary" type="submit">
          <i class="bi bi-search"></i>
        </button>
      </form>
    </div>

    <div class="card-body p-0">
      <div class="table-responsive">
        <table class="table table-sm table-hover align-middle mb-0">
          <thead class="table-light">
            <tr>
              <th style="width: 40px;">#</th>
              <th>Emp Code</th>
              <th>Name</th>
              <th>Department</th>
              <th>Desktime ID</th>
              <th>Last Log Date</th>
              <th>Last Fetched On</th>
              <th style="width: 120px;">Dashboard</th>
            </tr>
          </thead>
          <tbody>
          {% if rows %}
            {% for row in rows %}
              {% set emp = row.employee %}
              {% set log = row.log %}
              <tr>
                <td>{{ loop.index }}</td>
                <td class="fw-semibold">{{ emp.employee_code }}</td>
                <td>{{ emp.full_name }}</td>
                <td>{{ emp.department.name if emp.department else '-' }}</td>
                <td>{{ emp.desktime_id or '-' }}</td>

                <td>
                  {% if log %}
                    {{ log.date.strftime('%d-%m-%Y') }}
                  {% else %}
                    <span class="text-muted">No data</span>
                  {% endif %}
                </td>

                <td>
                  {% if log and log.fetched_on %}
                    {{ log.fetched_on.strftime('%d-%m-%Y %H:%M') }}
                  {% else %}
                    <span class="text-muted">-</span>
                  {% endif %}
                </td>

                <td>
                  <a href="{{ url_for('desktime_logs.desktime_employee_dashboard', employee_id=emp.id) }}"
                     class="btn btn-sm btn-outline-primary">
                    <i class="bi bi-graph-up-arrow me-1"></i> View
                  </a>
                </td>
              </tr>
            {% endfor %}
          {% else %}
            <tr>
              <td colspan="8" class="text-center py-4 text-muted">
                No Desktime logs found.
              </td>
            </tr>
          {% endif %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock %}