{% extends "pos/base.html" %}
{% load static %}

{% block title %}Overtime Entries{% endblock %}
{% block heading %}Overtime Entries{% endblock %}
{% block content %}
  <div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
      <a href="{% url 'payroll:overtime_add' %}" class="btn btn-success">Add Overtime</a>
    </div>

    <table class="table table-striped table-bordered align-middle">
      <thead class="table-light">
        <tr>
          <th>#</th>
          <th>Invoice #</th>
          <th>Staff</th>
          <th>Date</th>
          <th>Amount</th>
          <th>Remarks</th>
          <th>Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for p in overtime_list %}
        <tr>
          <td>{{ forloop.counter }}</td>
          <td>{{ p.description }}</td>
          <td>{{ p.party_descp }}</td>
          <td>{{ p.transaction_date }}</td>
          <td>{{ p.total_amount|floatformat:2 }}</td>
          <td>
            {# Extract the text inside “Overtime (…)” #}
            {% with raw=p.bill_title_descp %}
              {{ raw|cut:"Overtime ("|cut:")"|truncatechars:200 }}
            {% endwith %}
          </td>
          <td>
            <a
              href="{% url 'payroll:overtime_edit' p.description %}"
              class="btn btn-sm btn-primary"
            >Edit</a>
            <a
              href="{% url 'payroll:overtime_delete' p.description %}"
              class="btn btn-sm btn-danger"
              onclick="return confirm('Delete Overtime Invoice #{{ p.description }}?');"
            >Delete</a>
          </td>
        </tr>
        {% empty %}
        <tr>
          <td colspan="7" class="text-center">No overtime entries found.</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
{% endblock %}