{% extends "admin/dj_celery_panel/base.html" %}
{% load i18n admin_urls static admin_list %}

{% block content %}
{% include "admin/dj_celery_panel/_tabs.html" %}

{% include "admin/dj_celery_panel/_backend_info.html" %}

<div class="celery-tab-content">
    <div class="content-main">
        <div class="module">
            <h2>{% trans 'Task Execution History' %}</h2>
            <br />
            
            <!-- Search and Filter Form -->
            <form method="get" class="search-form">
                <div class="form-row search-form-row">
                    <div class="search-form-fields">
                        <div class="search-field-group">
                            <label for="searchbar">{% trans 'Search' %}</label>
                            <input 
                            type="text" 
                            name="search" 
                            value="{{ search_query }}" 
                            placeholder="{% trans 'Search tasks by name...' %}"
                            id="searchbar"
                            style="width: 300px;"
                            >
                        </div>
                        {% if show_filters %}
                        <div class="search-field-group">
                            <label for="filter-select">{% trans 'Filter by state' %}</label>
                            <select name="filter" id="filter-select">
                                {% for filter in task_filters %}
                                <option value="{% if filter.value %}{{ filter.value }}{% endif %}" {% if filter.selected %}selected{% endif %}>
                                    {{ filter.label }}
                                </option>
                                {% endfor %}
                            </select>
                        </div>
                        {% endif %}
                        <div class="search-field-group">
                            <label>&nbsp;</label>
                            <input type="submit" value="{% trans 'Search' %}">
                        </div>
                    </div>
                </div>
            </form>
        
        <!-- Tasks Table -->
        {% if tasks %}
        <p class="help">{% trans 'Showing' %} {{ tasks|length }} {% trans 'of' %} {{ total_count }} {% trans 'total tasks' %}</p>
        <div class="results">
            <table id="result_list">
                <thead>
                    <tr>
                        <th scope="col">{% trans 'Task ID' %}</th>
                        <th scope="col">{% trans 'Task Name' %}</th>
                        <th scope="col">{% trans 'Worker' %}</th>
                        <th scope="col">{% trans 'Status' %}</th>
                        <th scope="col">{% trans 'Created' %}</th>
                        <th scope="col">{% trans 'Result' %}</th>
                    </tr>
                </thead>
                <tbody>
                    {% for task in tasks %}
                    <tr>
                        <td>
                            <a href="{% url 'dj_celery_panel:task_detail' task.id %}">
                                <code class="task-name">{{ task.id }}</code>
                            </a>
                        </td>
                        <td>
                            {% if task.name %}
                                <code>{{ task.name }}</code>
                            {% else %}
                                <span class="config-value-muted">{% trans 'Unknown' %}</span>
                            {% endif %}
                        </td>
                        <td>
                            {% if task.worker %}
                                {{ task.worker }}
                            {% else %}
                                <span class="config-value-muted">{% trans 'Unknown' %}</span>
                            {% endif %}
                        </td>
                        <td>
                            {% if task.status == "SUCCESS" %}
                                <span class="task-status task-status-success">{% trans 'SUCCESS' %}</span>
                            {% elif task.status == "FAILURE" %}
                                <span class="task-status task-status-failure">{% trans 'FAILURE' %}</span>
                            {% elif task.status == "STARTED" or task.status == "ACTIVE" %}
                                <span class="task-status task-status-active">{% trans 'ACTIVE' %}</span>
                            {% elif task.status == "PENDING" %}
                                <span class="task-status task-status-reserved">{% trans 'PENDING' %}</span>
                            {% elif task.status == "RESERVED" %}
                                <span class="task-status task-status-reserved">{% trans 'RESERVED' %}</span>
                            {% elif task.status == "RETRY" %}
                                <span class="task-status task-status-retry">{% trans 'RETRY' %}</span>
                            {% elif task.status == "REVOKED" %}
                                <span class="task-status task-status-revoked">{% trans 'REVOKED' %}</span>
                            {% else %}
                                <span class="task-status">{{ task.status }}</span>
                            {% endif %}
                        </td>
                        <td>{{ task.date_created|date:"Y-m-d H:i:s" }}</td>
                        <td>
                            {% if task.result %}
                                <span>{{ task.result|slice:":100" }}{% if task.result|length > 100 %}...{% endif %}</span>
                            {% else %}
                                <span class="config-value-muted">-</span>
                            {% endif %}
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        
        <!-- Pagination -->
        {% if total_pages > 1 %}
        <p class="paginator">
            {{ tasks|length }} {% trans 'of' %} {{ total_count }} {% trans 'tasks' %}
            {% if has_previous %}
                <a href="?page=1{% if search_query %}&search={{ search_query }}{% endif %}{% if current_filter %}&filter={{ current_filter }}{% endif %}">{% trans 'First' %}</a>
                <a href="?page={{ previous_page }}{% if search_query %}&search={{ search_query }}{% endif %}{% if current_filter %}&filter={{ current_filter }}{% endif %}" class="prev">{% trans 'Previous' %}</a>
            {% endif %}
            <span class="this-page">{{ page }} {% trans 'of' %} {{ total_pages }}</span>
            {% if has_next %}
                <a href="?page={{ next_page }}{% if search_query %}&search={{ search_query }}{% endif %}{% if current_filter %}&filter={{ current_filter }}{% endif %}" class="next">{% trans 'Next' %}</a>
                <a href="?page={{ total_pages }}{% if search_query %}&search={{ search_query }}{% endif %}{% if current_filter %}&filter={{ current_filter }}{% endif %}">{% trans 'Last' %}</a>
            {% endif %}
        </p>
        {% endif %}
        
        {% else %}
        <div class="empty-state-row">
            <div class="empty-state-message">
                <div class="empty-state-content">
                    <span class="empty-state-icon">📋</span>
                    {% if search_query %}
                        <p class="empty-state-title">{% trans 'No Tasks Found' %}</p>
                        <p class="empty-state-text">{% trans 'No tasks match your search query.' %}</p>
                        <a href="{% url 'dj_celery_panel:tasks' %}" class="empty-state-link">{% trans 'Clear search' %}</a>
                    {% elif current_filter %}
                        <p class="empty-state-title">{% trans 'No Tasks' %}</p>
                        <p class="empty-state-text">
                            {% blocktrans with filter=current_filter %}No {{ filter }} tasks found. Try a different filter or check that workers are running.{% endblocktrans %}
                        </p>
                    {% else %}
                        <p class="empty-state-title">{% trans 'No Tasks' %}</p>
                        <p class="empty-state-text">{% trans 'No tasks have been executed yet.' %}</p>
                    {% endif %}
                </div>
            </div>
        </div>
        {% endif %}
        </div>
    </div>
</div>
{% endblock %}