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

{% block title %}Settlement Types{% endblock %}

{% block content %}
<div class="container-fluid">
  <div class="d-flex justify-content-between align-items-center mb-3">
    <h1 class="h3 mb-0 text-gray-800">Settlement Types</h1>
    <a class="btn btn-primary" href="{% url 'products:settlements_add' %}">Add Settlement Type</a>
  </div>

  <div class="card shadow mb-4">
    <div class="card-body">
      <div class="table-responsive">
        <table class="table table-bordered table-striped">
          <thead class="thead-light">
            <tr>
              <th style="width:90px;">ID</th>
              <th>Name</th>
              <th>Description</th>
              <th style="width:160px;">Actions</th>
            </tr>
          </thead>
          <tbody>
            {% for s in settlements %}
            <tr>
              <td>{{ s.t_id }}</td>
              <td class="text-uppercase">{{ s.name }}</td>
              <td>{{ s.descp }}</td>
              <td>
                <a href="{% url 'products:settlements_update' s.id %}" class="btn btn-sm btn-info">Edit</a>
                <a href="{% url 'products:settlements_delete' s.id %}" class="btn btn-sm btn-danger"
                   onclick="return confirm('Delete this settlement type?');">Delete</a>
              </td>
            </tr>
            {% empty %}
            <tr>
              <td colspan="4" class="text-center text-muted">No settlement types found.</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock %}