{% for task in tasks %}
    <div data-task="{{ task.id }}" class="col mb-3">
        <div class="card">
            <div class="card-body">
                <h3 class="card-title">{{ task.name }}</h3>
            </div>
            <ul class="list-group list-group-flush">
                <li class="list-group-item">Статус: {{ task.status }}</li>
                <li class="list-group-item">Сообщение: {{ task.status_message }}</li>
                <li class="list-group-item">Действие: {{ task.type }}</li>
                
                <li class="list-group-item">
                    <label class="form-label">Сессия:</label>
                    <select
                        name="session"
                        hx-put="/api/tasks/{{task.id}}/change"
                        hx-trigger="change"
                        hx-confirm="Вы уверены, что хотите поменять сессию?"
                        hx-swap="none"
                        class="form-select form-select-lg mb-3"
                    >
                        {% for session in sessions %}
                            {% if task.session.name == session.name %}
                                <option selected value="{{ session.id }}">{{ session.name }}</option>
                            {% else %}
                                <option value="{{ session.id }}">{{ session.name }}</option>
                            {% endif %}
                        {% endfor %}
                    </select>
                </li>
            </ul>
            <div class="card-body">
                <div class="btn-group mx-2" role="group">
                    <button
                        hx-delete="/api/tasks/{{task.id}}"
                        hx-swap="delete"
                        hx-target='[data-task="{{ task.id }}"]'
                        hx-confirm="Вы уверены, что хотите удалить эту задачу?"
                        class="btn btn-outline-danger"
                    >
                        Удалить
                    </button>
                    <button hx-put="/api/tasks/{{task.id}}/stop" hx-swap="none" class="btn btn-outline-secondary">
                        Стоп
                    </button>
                    <button hx-put="/api/tasks/{{task.id}}/start" hx-swap="none" class="btn btn-outline-success">
                        Запустить
                    </button>
                </div>
            </div>
            <div class="card-footer">
                <small class="text-body-secondary">Создано {{ task.datetime.strftime("%d.%m.%y") }} в {{ task.datetime.strftime("%H:%M") }}</small>
            </div>
        </div>
    </div>
{% else %}
    <small id="helpId" class="form-text">Здесь ничего нет.</small>
{% endfor %}