{% extends 'base.html' %}
{% block title %}Zarządzanie użytkownikami{% endblock %}
{% block content %}

<div class="d-flex justify-content-between align-items-center flex-wrap mb-4">
  <h2 class="mb-2">👥 Zarządzanie użytkownikami</h2>
  <a href="{{ url_for('admin_panel') }}" class="btn btn-outline-secondary">← Powrót do panelu</a>
</div>

{% include 'admin/_nav.html' %}

<!-- Formularz dodawania nowego użytkownika -->
<div class="card bg-secondary bg-opacity-10 text-white mb-4">
  <div class="card-body">
    <h5 class="card-title mb-3">➕ Dodaj nowego użytkownika</h5>
    <form method="post" action="{{ url_for('add_user') }}">
      <div class="row g-3 align-items-end">
        <div class="col-md-4">
          <label for="username" class="form-label text-white-50">Nazwa użytkownika</label>
          <input type="text" id="username" name="username"
            class="form-control bg-dark text-white border-secondary ui-consistent-input" placeholder="np. jan" required>
        </div>
        <div class="col-md-4">
          <label for="password" class="form-label text-white-50">Hasło</label>
          <div class="input-group ui-password-group">
            <input type="password" id="password" name="password"
              class="form-control bg-dark text-white border-secondary ui-consistent-input" placeholder="min. 6 znaków" required>
          </div>
        </div>
        <div class="col-md-4 d-grid">
          <button type="submit" class="btn btn-outline-light">➕ Dodaj użytkownika</button>
        </div>
      </div>
    </form>
  </div>
</div>


<div class="card bg-dark text-white mb-5">
  <div class="card-body">
    <table class="table table-dark align-middle sortable keep-horizontal">
      <thead>
        <tr>
          <th>ID</th>
          <th>Login</th>
          <th>Rola</th>
          <th>Listy</th>
          <th>Produkty</th>
          <th>Paragony</th>
          <th>Akcje</th>
        </tr>
      </thead>
      <tbody>
        {% for entry in user_data %}
        {% set user = entry.user %}
        <tr>
          <td>{{ user.id }}</td>
          <td class="fw-bold">{{ user.username }}</td>
          <td>
            {% if user.is_admin %}
            <span class="badge rounded-pill bg-primary">Admin</span>
            {% else %}
            <span class="badge rounded-pill bg-secondary">Użytkownik</span>
            {% endif %}
          </td>
          <td>{{ entry.list_count }}</td>
          <td>{{ entry.item_count }}</td>
          <td>{{ entry.receipt_count }}</td>
          <td>
            <button class="btn btn-sm btn-outline-light me-1" data-bs-toggle="modal"
              data-bs-target="#resetPasswordModal" data-user-id="{{ user.id }}" data-username="{{ user.username }}">
              🔑 Ustaw hasło
            </button>
            {% if not user.is_admin %}
            <a href="/admin/promote_user/{{ user.id }}" class="btn btn-sm btn-outline-light">⬆️ Ustaw admina</a>
            {% else %}
            <a href="/admin/demote_user/{{ user.id }}" class="btn btn-sm btn-outline-light">⬇️ Usuń admina</a>
            {% endif %}
            {% if user.username == 'admin' %}
            <a class="btn btn-sm btn-outline-light me-1 disabled" aria-disabled="true" tabindex="-1"
              title="Nie można usunąć konta administratora-głównego.">
              🗑️ Usuń
            </a>
            {% else %}
            <a href="/admin/delete_user/{{ user.id }}" class="btn btn-sm btn-outline-light me-1"
              onclick="return confirm('Czy na pewno chcesz usunąć użytkownika {{ user.username }}?\\n\\nWszystkie jego listy zostaną przeniesione na administratora.')">
              🗑️ Usuń
            </a>
            {% endif %}
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

<!-- Modal resetowania hasła -->
<div class="modal fade" id="resetPasswordModal" tabindex="-1" aria-labelledby="resetPasswordModalLabel"
  aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content bg-dark text-white">
      <form method="post" id="resetPasswordForm">
        <div class="modal-header border-0">
          <h5 class="modal-title" id="resetPasswordModalLabel">Ustaw hasło</h5>
          <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Zamknij"></button>
        </div>
        <div class="modal-body">
          <p id="resetUsernameLabel">Dla użytkownika: <strong></strong></p>
          <div class="input-group ui-password-group">
            <input type="password" name="password" placeholder="Nowe hasło"
              class="form-control bg-dark text-white border-secondary ui-consistent-input" required>
          </div>
        </div>
        <div class="modal-footer border-0">
          <button type="submit" class="btn btn-sm btn-outline-light w-100">💾 Zapisz nowe hasło</button>
        </div>
      </form>
    </div>
  </div>
</div>

{% block scripts %}
<script src="{{ static_asset_url('static_bp.serve_js', 'user_management.js') }}"></script>
{% endblock %}


{% endblock %}