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

{% block content %}
<div class="container-fluid py-4">

  <div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="mb-0">
      <i class="fas fa-users text-primary mr-2"></i>Normal Users
    </h2>
    <a href="{% url 'authentication:normal_add' %}" class="btn btn-primary">
      <i class="fas fa-user-plus mr-2"></i>Add User
    </a>
  </div>

  {% if messages %}
  <div class="mb-3">
    {% for message in messages %}
    <div class="alert alert-{{ message.tags }} alert-dismissible fade show">
      {{ message }}
      <button type="button" class="close" data-dismiss="alert">&times;</button>
    </div>
    {% endfor %}
  </div>
  {% endif %}

  <div class="card shadow-sm">
    <div class="card-body p-0">
      <div class="table-responsive">
        <table class="table table-hover mb-0">
          <thead class="bg-light">
            <tr>
              <th>#</th>
              <th>Username</th>
              <th>Email</th>
              <th>Status</th>
              <th>Expiry</th>
              <th>Banks</th>
              <th>Counters</th>
              <th class="text-right">Actions</th>
            </tr>
          </thead>
          <tbody>
            {% for assign in assigns %}
            <tr>
              <td class="text-muted">{{ forloop.counter }}</td>
              <td><strong>{{ assign.user.username }}</strong></td>
              <td class="text-muted">{{ assign.user.email|default:"—" }}</td>
              <td>
                {% if assign.status == 'Active' %}
                  <span class="badge badge-success">Active</span>
                {% else %}
                  <span class="badge badge-secondary">{{ assign.status }}</span>
                {% endif %}
              </td>
              <td>{{ assign.expiry_date|date:"d M Y" }}</td>

              <!-- Bank accounts count (NEW) -->
              <td>
                {% with bc=assign.user.bank_account_assignments.count %}
                {% if bc > 0 %}
                  <span class="badge badge-success">
                    <i class="fas fa-university mr-1"></i>{{ bc }}
                  </span>
                {% else %}
                  <span class="text-muted small">
                    <i class="fas fa-globe mr-1"></i>All
                  </span>
                {% endif %}
                {% endwith %}
              </td>

              <!-- Sub-tenants count -->
              <td>
                {% with sc=assign.user.sub_tenant_assignments.count %}
                {% if sc > 0 %}
                  <span class="badge badge-info">
                    <i class="fas fa-store-alt mr-1"></i>{{ sc }}
                  </span>
                {% else %}
                  <span class="text-muted small">
                    <i class="fas fa-globe mr-1"></i>All
                  </span>
                {% endif %}
                {% endwith %}
              </td>

              <td class="text-right">
                <a href="{% url 'authentication:normal_edit' assign.pk %}"
                   class="btn btn-sm btn-outline-primary" title="Edit">
                  <i class="fas fa-edit"></i>
                </a>
                <a href="{% url 'authentication:normal_delete' assign.pk %}"
                   class="btn btn-sm btn-outline-danger ml-1" title="Delete">
                  <i class="fas fa-trash"></i>
                </a>
              </td>
            </tr>
            {% empty %}
            <tr>
              <td colspan="8" class="text-center py-5">
                <i class="fas fa-users-slash fa-3x text-muted mb-3 d-block"></i>
                <p class="text-muted mb-3">No users found.</p>
                <a href="{% url 'authentication:normal_add' %}" class="btn btn-primary">
                  <i class="fas fa-user-plus mr-2"></i>Add First User
                </a>
              </td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>

</div>
{% endblock %}