<!-- fortunaisk/templates/fortunaisk/lottery_history.html -->
{% extends "fortunaisk/base.html" %}
{% load i18n humanize fortunaisk_tags my_filters static %}

{% block page_title %}
    {% trans "Lottery History" %}
{% endblock page_title %}

{% block details %}
<div class="container mt-4">
    <div class="text-center mb-4">
        <h2 class="fw-bold">
            <i class="fas fa-history me-2 text-secondary"></i>
            {% trans "Lottery History" %}
        </h2>
        <p class="text-muted">
            {% trans "Check out past lotteries, their winners, and total payouts." %}
        </p>
    </div>

    <!-- Results per page dropdown -->
    <div class="d-flex justify-content-end mb-3">
        <form method="get" class="d-flex align-items-center">
            <label for="perPageSelect" class="me-2 fw-bold">
                {% trans "Results per page" %}:
            </label>
            <select id="perPageSelect" name="per_page" class="form-select w-auto me-2"
                    onchange="this.form.submit()">
                {% for choice in per_page_choices %}
                    <option value="{{ choice }}"
                            {% if per_page|add:"0" == choice %}
                                selected
                            {% endif %}>
                        {{ choice }}
                    </option>
                {% endfor %}
            </select>
            <noscript>
                <button type="submit" class="btn btn-primary btn-sm">
                    {% trans "Apply" %}
                </button>
            </noscript>
        </form>
    </div>

    {% if past_lotteries %}
        <div class="d-flex flex-wrap justify-content-center gap-4">
            {% for lottery in past_lotteries %}
            <div class="card shadow border-0" style="width: 22rem;">
                <div class="card-header bg-secondary text-white">
                    <h5 class="mb-0">
                        <i class="fas fa-ticket-alt me-2"></i>
                        {{ lottery.lottery_reference }}
                    </h5>
                </div>
                <div class="card-body">
                    <p class="mb-2">
                        <strong>{% trans "Ticket Price" %}:</strong>
                        <span class="text-primary fw-bold">
                            {{ lottery.ticket_price|floatformat:2 }} ISK
                        </span>
                    </p>
                    <p class="mb-2">
                        <strong>{% trans "Start Date" %}:</strong>
                        <i class="far fa-clock me-1"></i>
                        {{ lottery.start_date|date:"Y-m-d H:i" }}
                    </p>
                    <p class="mb-2">
                        <strong>{% trans "End Date" %}:</strong>
                        <i class="far fa-clock me-1"></i>
                        {{ lottery.end_date|date:"Y-m-d H:i" }}
                    </p>
                    <p class="mb-2">
                        <strong>{% trans "Status" %}:</strong>
                        {% if lottery.status == "completed" %}
                            <span class="badge bg-success text-light">
                                <i class="fas fa-check-circle me-1"></i>
                                {{ lottery.get_status_display }}
                            </span>
                        {% elif lottery.status == "cancelled" %}
                            <span class="badge bg-danger">
                                <i class="fas fa-ban me-1"></i>
                                {{ lottery.get_status_display }}
                            </span>
                        {% else %}
                            {{ lottery.get_status_display }}
                        {% endif %}
                    </p>
                    <p class="mb-2">
                        <strong>{% trans "Participants" %}:</strong>
                        {{ lottery.participant_count }}
                    </p>
                    <p class="mb-2">
                        <strong>{% trans "Total Pot" %}:</strong>
                        <span class="text-warning fw-bold">
                            {{ lottery.total_pot|intcomma }} ISK
                        </span>
                    </p>
                    <div>
                        <strong>{% trans "Winners" %}:</strong>
                        {% with winners_list=lottery.winners.all %}
                            {% if winners_list %}
                                <ul class="list-unstyled mt-2">
                                    {% for winner in winners_list %}
                                    <li>
                                        <i class="fas fa-crown text-warning me-1"></i>
                                        <span class="fw-semibold">
                                            {{ winner.character.character_name }}
                                        </span>
                                        <small class="text-muted">
                                            ({{ winner.prize_amount|intcomma }} ISK)
                                        </small>
                                    </li>
                                    {% endfor %}
                                </ul>
                            {% else %}
                                <span class="text-muted">
                                    {% trans "No winner" %}
                                </span>
                            {% endif %}
                        {% endwith %}
                    </div>
                </div>

                {% if perms.fortunaisk.admin %}
                <div class="card-footer text-end">
                    <a href="{% url 'fortunaisk:lottery_detail' lottery.id %}"
                        class="btn btn-sm btn-info">
                        <i class="fas fa-eye"></i>
                        {% trans "Details" %}
                    </a>
                </div>
                {% endif %}
            </div>
            {% endfor %}
        </div>

        <!-- Pagination -->
        <nav aria-label="Page navigation" class="my-4">
            <ul class="pagination justify-content-center">
                {% if page_obj.has_previous %}
                <li class="page-item">
                    <a class="page-link"
                        href="?page={{ page_obj.previous_page_number }}&per_page={{ per_page }}"
                        aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                {% else %}
                <li class="page-item disabled">
                    <span class="page-link" aria-hidden="true">&laquo;</span>
                </li>
                {% endif %}

                {% for num in page_obj.paginator.page_range %}
                    {% if page_obj.number == num %}
                        <li class="page-item active">
                            <span class="page-link">{{ num }}</span>
                        </li>
                    {% else %}
                        <li class="page-item">
                            <a class="page-link"
                                href="?page={{ num }}&per_page={{ per_page }}">
                                {{ num }}
                            </a>
                        </li>
                    {% endif %}
                {% endfor %}

                {% if page_obj.has_next %}
                <li class="page-item">
                    <a class="page-link"
                        href="?page={{ page_obj.next_page_number }}&per_page={{ per_page }}"
                        aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
                {% else %}
                <li class="page-item disabled">
                    <span class="page-link" aria-hidden="true">&raquo;</span>
                </li>
                {% endif %}
            </ul>
        </nav>
    {% else %}
        <div class="alert alert-warning text-center">
            <i class="fas fa-exclamation-circle alert-icon me-2"></i>
            {% trans "No past lotteries found." %}
        </div>
    {% endif %}
</div>
{% endblock details %}
