{# fortunaisk/templates/fortunaisk/USER_DASHBOARD.html #}
{% extends "fortunaisk/base.html" %}
{% load i18n static humanize fortunaisk_tags %}

{% block page_title %}
    {% trans "My Dashboard" %}
{% endblock page_title %}

{% block details %}
<div class="container my-5">
    <!-- Dashboard Header -->
    <div class="text-center mb-5">
        <h2 class="fw-bold" style="color: #27ae60;">
            <i class="fas fa-wallet me-2" style="color: #f1c40f;"></i>
            {% trans "My Dashboard" %}
        </h2>
        <p class="text-muted fs-5">
            {% trans "Keep track of your ticket purchases and winnings to see your luck in action!" %}
        </p>
    </div>

    <!-- Ticket Purchases Section -->
    <h3 class="mb-4" style="color: #3498db;">
        <i class="fas fa-ticket-alt me-2"></i> {% trans "My Ticket Purchases" %}
    </h3>
    {% if ticket_purchases %}
        {% regroup ticket_purchases by lottery as grouped_tickets %}
        <div class="row g-4 mb-5">
            {% for group in grouped_tickets %}
            <div class="col-md-6 col-lg-4">
                <div class="card shadow-sm border-0" style="width: 20rem;">
                    <div class="card-header bg-info text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-ticket-alt me-1"></i>
                            {% trans "Ticket for" %} {{ group.grouper.lottery_reference }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <p>
                            <strong>{% trans "Tickets Purchased:" %}</strong>
                            {{ group.list.0.quantity|intcomma }} Ticket(s)
                        </p>
                        <p>
                            <strong>{% trans "Total Spent:" %}</strong>
                            {{ group.list.0.amount|floatformat:2|intcomma }} ISK
                        </p>
                        <p>
                            <strong>{% trans "Last Purchase:" %}</strong>
                            {% with last_purchase=group.list|last %}
                                {{ last_purchase.purchase_date|date:"Y-m-d H:i" }}
                            {% endwith %}
                        </p>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
    {% else %}
        <div class="alert alert-info text-center">
            <i class="fas fa-info-circle me-2"></i>
            {% trans "You have not made any ticket purchases." %}
        </div>
    {% endif %}


    <!-- My Payments Section -->
    <h3 class="mb-4" style="color: #e67e22;">
        <i class="fas fa-credit-card me-2"></i> {% trans "My Payments" %}
    </h3>
    {% if payments_page %}
      <div class="table-responsive mb-3">
        <table class="table table-striped table-hover align-middle">
          <thead class="table-dark">
            <tr>
              <th>{% trans "Payment ID" %}</th>
              <th>{% trans "Character ID" %}</th>
              <th>{% trans "Amount (ISK)" %}</th>
              <th>{% trans "Paid At" %}</th>
              <th>{% trans "Processed At" %}</th>
            </tr>
          </thead>
          <tbody>
            {% for p in payments_page %}
            <tr>
              <td>{{ p.payment_id }}</td>
              <td>{{ p.character.character_id|default:"—" }}</td>
              <td>{{ p.amount|floatformat:2|intcomma }}</td>
              <td>{{ p.payed_at|date:"Y-m-d H:i" }}</td>
              <td>{{ p.processed_at|date:"Y-m-d H:i" }}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>

      {# Pagination controls #}
      <nav aria-label="Payments pagination">
        <ul class="pagination justify-content-center">
          {% if payments_page.has_previous %}
            <li class="page-item">
              <a class="page-link" href="?payments_page={{ payments_page.previous_page_number }}">
                &laquo; {% trans "Previous" %}
              </a>
            </li>
          {% else %}
            <li class="page-item disabled">
              <span class="page-link">&laquo; {% trans "Previous" %}</span>
            </li>
          {% endif %}

          <li class="page-item disabled">
            <span class="page-link">
              {% trans "Page" %} {{ payments_page.number }} {% trans "of" %} {{ payments_page.paginator.num_pages }}
            </span>
          </li>

          {% if payments_page.has_next %}
            <li class="page-item">
              <a class="page-link" href="?payments_page={{ payments_page.next_page_number }}">
                {% trans "Next" %} &raquo;
              </a>
            </li>
          {% else %}
            <li class="page-item disabled">
              <span class="page-link">{% trans "Next" %} &raquo;</span>
            </li>
          {% endif %}
        </ul>
      </nav>
    {% else %}
      <div class="alert alert-info text-center mb-5">
        <i class="fas fa-info-circle me-2"></i>
        {% trans "You have no raw payment entries yet." %}
      </div>
    {% endif %}


    <!-- Winnings Section -->
    <h3 class="mb-4" style="color: #2ecc71;">
        <i class="fas fa-trophy me-2"></i> {% trans "My Winnings" %}
    </h3>
    {% if winnings %}
    <div class="row g-4">
        {% for win in winnings %}
        <div class="col-md-6 col-lg-4">
            <div class="card shadow-sm border-0" style="width: 20rem;">
                <div class="card-header bg-success text-white">
                    <h5 class="mb-0">
                        <i class="fas fa-trophy me-1"></i> {% trans "Winner" %}
                    </h5>
                </div>
                <div class="card-body">
                    <p>
                        <strong>{% trans "Lottery Reference:" %}</strong>
                        {{ win.ticket.lottery.lottery_reference }}
                    </p>
                    <p>
                        <strong>{% trans "Win Date:" %}</strong>
                        {{ win.won_at|date:"Y-m-d H:i" }}
                    </p>
                    <p>
                        <strong>{% trans "Prize:" %}</strong>
                        <span class="text-warning fw-bold">{{ win.prize_amount|floatformat:2|intcomma }} ISK</span>
                    </p>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>
    {% else %}
    <div class="alert alert-info text-center">
        <i class="fas fa-info-circle me-2"></i>
        {% trans "You have not won any lotteries yet." %}
    </div>
    {% endif %}
</div>
{% endblock details %}
