{% extends 'administration/base.html.twig' %}

{% block title %}{{ 'admin.pages_management'|trans }}{% endblock %}

{% block body %}
    {% set canCategoryView = has_permission('ALLOW_CATEGORY_VIEW', app.user) %}
    {% set canPageCreate = has_permission('ALLOW_PAGE_CREATE', app.user) %}
    {% set canPageEdit = has_permission('ALLOW_PAGE_EDIT', app.user) %}
    {% set canPageDelete = has_permission('ALLOW_PAGE_DELETE', app.user) %}
    <div class="container-fluid">
        {# Kopfzeile #}
        <div class="row mb-3">
            <div class="col-12">
                <div class="admin-card p-4">
                    <div class="d-flex flex-column flex-lg-row justify-content-between align-items-start gap-3">
                        <div>
                            <h2 class="gradient-text fw-bold mb-2">
                                <i class="bi bi-file-earmark-text-fill me-2"></i>
                                {{ 'admin.pages_management'|trans }}
                            </h2>
                            <p class="text-muted mb-0">{{ 'admin.pages_list_hint'|trans }}</p>
                            {% if totalCount > 0 %}
                                <p class="text-muted small mb-0 mt-2">
                                    {{ 'admin.pages_results_range'|trans({
                                        '%from%': ((currentPage - 1) * limit) + 1,
                                        '%to%': min(currentPage * limit, totalCount),
                                        '%total%': totalCount
                                    }) }}
                                </p>
                            {% endif %}
                        </div>
                        <div class="d-flex flex-wrap gap-2">
                            {% if canCategoryView %}
                            <a href="{{ path('admin_categories') }}" class="btn btn-outline-secondary">
                                <i class="bi bi-folder2-open me-1"></i>
                                {{ 'admin.pages_open_categories'|trans }}
                            </a>
                            {% endif %}
                            {% if canPageCreate %}
                            <a href="{{ path('admin_new_page') }}" class="btn btn-success">
                                <i class="bi bi-plus-circle me-1"></i>
                                {{ 'admin.createPage'|trans }}
                            </a>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {# Filterleiste (GET) #}
        <div class="row mb-3">
            <div class="col-12">
                <div class="admin-card p-3">
                    <form method="get" action="{{ path('admin_pages') }}" class="row g-2 g-lg-3 align-items-end">
                        <div class="col-12 col-md-6 col-xl-4">
                            <label for="searchInput" class="form-label small text-muted mb-1">{{ 'admin.search'|trans }}</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-search"></i></span>
                                <input type="text" id="searchInput" name="search" class="form-control"
                                       placeholder="{{ 'admin.search_placeholder'|trans }}"
                                       value="{{ search }}">
                            </div>
                        </div>
                        <div class="col-6 col-md-3 col-xl-2">
                            <label for="filterCategory" class="form-label small text-muted mb-1">{{ 'admin.filter_category'|trans }}</label>
                            <select id="filterCategory" name="category" class="form-select">
                                <option value="">{{ 'admin.filter_category_all'|trans }}</option>
                                <option value="none" {% if filterCategory == 'none' %}selected{% endif %}>{{ 'admin.filter_category_none'|trans }}</option>
                                {% for cat in categories %}
                                    <option value="{{ cat.id }}" {% if filterCategory == (cat.id ~ '') %}selected{% endif %}>{{ cat.title }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="col-6 col-md-3 col-xl-2">
                            <label for="filterStatus" class="form-label small text-muted mb-1">{{ 'admin.filter_status'|trans }}</label>
                            <select id="filterStatus" name="status" class="form-select">
                                <option value="all" {% if filterStatus == 'all' %}selected{% endif %}>{{ 'admin.filter_status_all'|trans }}</option>
                                <option value="live" {% if filterStatus == 'live' %}selected{% endif %}>{{ 'admin.filter_status_live'|trans }}</option>
                                <option value="not_live" {% if filterStatus == 'not_live' %}selected{% endif %}>{{ 'admin.filter_status_not_live'|trans }}</option>
                                <option value="draft" {% if filterStatus == 'draft' %}selected{% endif %}>{{ 'admin.filter_status_draft'|trans }}</option>
                                <option value="scheduled" {% if filterStatus == 'scheduled' %}selected{% endif %}>{{ 'admin.filter_status_scheduled'|trans }}</option>
                                <option value="published" {% if filterStatus == 'published' %}selected{% endif %}>{{ 'admin.filter_status_published'|trans }}</option>
                            </select>
                        </div>
                        <div class="col-12 col-md-6 col-xl-2">
                            <label for="filterSort" class="form-label small text-muted mb-1">{{ 'admin.sort_label'|trans }}</label>
                            <select id="filterSort" name="sort" class="form-select">
                                <option value="created_desc" {% if filterSort == 'created_desc' %}selected{% endif %}>{{ 'admin.sort_created_desc'|trans }}</option>
                                <option value="created_asc" {% if filterSort == 'created_asc' %}selected{% endif %}>{{ 'admin.sort_created_asc'|trans }}</option>
                                <option value="title_asc" {% if filterSort == 'title_asc' %}selected{% endif %}>{{ 'admin.sort_title_asc'|trans }}</option>
                                <option value="title_desc" {% if filterSort == 'title_desc' %}selected{% endif %}>{{ 'admin.sort_title_desc'|trans }}</option>
                            </select>
                        </div>
                        <div class="col-12 col-md-6 col-xl-2 d-flex gap-2">
                            <button type="submit" class="btn btn-primary flex-grow-1">
                                <i class="bi bi-funnel me-1"></i>{{ 'admin.search_button'|trans }}
                            </button>
                            <a href="{{ path('admin_pages') }}" class="btn btn-outline-secondary" title="{{ 'admin.pages_reset_filters'|trans }}">
                                <i class="bi bi-x-lg"></i>
                            </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        {% set pagination_query = {} %}
        {% if search != '' %}{% set pagination_query = pagination_query|merge({search: search}) %}{% endif %}
        {% if filterCategory != '' %}{% set pagination_query = pagination_query|merge({category: filterCategory}) %}{% endif %}
        {% if filterStatus != 'all' %}{% set pagination_query = pagination_query|merge({status: filterStatus}) %}{% endif %}
        {% if filterSort != 'created_desc' %}{% set pagination_query = pagination_query|merge({sort: filterSort}) %}{% endif %}

        {# Tabelle #}
        {% if pages|length > 0 %}
            <div class="row">
                <div class="col-12">
                    <div class="admin-card p-0 overflow-hidden">
                        <div class="table-responsive">
                            <table class="table table-hover table-striped align-middle mb-0 pages-admin-table">
                                <thead class="table-light">
                                    <tr>
                                        <th scope="col" class="ps-4">{{ 'admin.pages_table_title'|trans }}</th>
                                        <th scope="col" class="d-none d-md-table-cell">{{ 'admin.pages_table_category'|trans }}</th>
                                        <th scope="col" class="d-none d-lg-table-cell">{{ 'admin.pages_table_url'|trans }}</th>
                                        <th scope="col" class="text-center">{{ 'admin.pages_table_status'|trans }}</th>
                                        <th scope="col" class="d-none d-xl-table-cell text-nowrap">{{ 'admin.pages_table_created'|trans }}</th>
                                        <th scope="col" class="text-end pe-4" style="width: 1%;">{{ 'admin.actions'|trans }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for page in pages %}
                                        <tr>
                                            <td class="ps-4">
                                                <div class="fw-semibold">{{ page.title }}</div>
                                                <div class="d-md-none small text-muted mt-1">
                                                    <i class="bi bi-folder2 me-1"></i>{{ page.category ? page.category.title : ('admin.no_category'|trans) }}
                                                </div>
                                                <div class="d-lg-none small text-truncate mt-1" style="max-width: 280px;">
                                                    {% if page.isPubliclyVisible() %}
                                                        <a href="{{ get_page_url(page) }}" target="_blank" rel="noopener" class="text-decoration-none text-muted">
                                                            {{ get_page_url(page) }}
                                                        </a>
                                                    {% else %}
                                                        <span class="text-muted text-decoration-line-through user-select-all" title="{{ 'admin.pages_inactive_url_hint'|trans }}">{{ get_page_url(page) }}</span>
                                                    {% endif %}
                                                </div>
                                            </td>
                                            <td class="d-none d-md-table-cell">
                                                {% if page.category %}
                                                    <span class="badge bg-light text-dark border">{{ page.category.title }}</span>
                                                {% else %}
                                                    <span class="text-muted small">{{ 'admin.no_category'|trans }}</span>
                                                {% endif %}
                                            </td>
                                            <td class="d-none d-lg-table-cell small">
                                                {% if page.isPubliclyVisible() %}
                                                    <a href="{{ get_page_url(page) }}" target="_blank" rel="noopener" class="text-truncate d-inline-block text-decoration-none" style="max-width: 220px;" title="{{ get_page_url(page) }}">
                                                        {{ get_page_url(page) }}
                                                    </a>
                                                {% else %}
                                                    <span class="text-truncate d-inline-block text-muted text-decoration-line-through user-select-all" style="max-width: 220px;" title="{{ 'admin.pages_inactive_url_hint'|trans }}">{{ get_page_url(page) }}</span>
                                                {% endif %}
                                            </td>
                                            <td class="text-center">
                                                {% set ps = page.publicationStatus.value %}
                                                <div class="d-flex flex-column align-items-center gap-1">
                                                    <span class="badge bg-info text-dark">{{ ('form.page.publication_status_' ~ ps)|trans }}</span>
                                                    {% if page.isPubliclyVisible() %}
                                                        <span class="badge bg-success">{{ 'admin.filter_status_live'|trans }}</span>
                                                    {% elseif page.active %}
                                                        <span class="badge bg-warning text-dark">{{ 'admin.page_status_not_routable'|trans }}</span>
                                                    {% else %}
                                                        <span class="badge bg-secondary">{{ 'admin.inactive'|trans }}</span>
                                                    {% endif %}
                                                </div>
                                            </td>
                                            <td class="d-none d-xl-table-cell small text-muted text-nowrap">
                                                {{ page.createdAt|date('d.m.Y H:i') }}
                                            </td>
                                            <td class="text-end pe-4">
                                                <div class="btn-group btn-group-sm">
                                                    {% if canPageEdit %}
                                                    <a href="{{ path('admin_edit_page', {id: page.id}) }}" class="btn btn-outline-primary" title="{{ 'admin.edit'|trans }}">
                                                        <i class="bi bi-pencil"></i>
                                                    </a>
                                                    {% endif %}
                                                    {% if page.isPubliclyVisible() %}
                                                        <a href="{{ get_page_url(page) }}" target="_blank" class="btn btn-outline-secondary" title="{{ 'admin.view'|trans }}">
                                                            <i class="bi bi-box-arrow-up-right"></i>
                                                        </a>
                                                    {% else %}
                                                        <a href="{{ get_page_preview_url(page) }}" target="_blank" class="btn btn-outline-warning" title="{{ 'admin.preview'|trans }}">
                                                            <i class="bi bi-box-arrow-up-right"></i>
                                                        </a>
                                                    {% endif %}
                                                    {% if canPageCreate %}
                                                    <a href="{{ path('admin_duplicate_page', {id: page.id}) }}" class="btn btn-outline-success" title="{{ 'admin.duplicate'|trans }}">
                                                        <i class="bi bi-copy"></i>
                                                    </a>
                                                    {% endif %}
                                                    {% if canPageDelete %}
                                                    <button type="button" class="btn btn-outline-danger" title="{{ 'admin.delete'|trans }}"
                                                            onclick="handleDeletePage('{{ page.id }}', '{{ page.title|e('js') }}')">
                                                        <i class="bi bi-trash"></i>
                                                    </button>
                                                    {% endif %}
                                                </div>
                                            </td>
                                        </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row mt-3">
                <div class="col-12">
                    {% include 'administration/pagination.html.twig' with {
                        paginationPath: 'admin_pages',
                        pagination_query: pagination_query,
                        totalPages: totalPages,
                        currentPage: currentPage,
                        search: search
                    } %}
                </div>
            </div>
        {% else %}
            <div class="row">
                <div class="col-12">
                    <div class="empty-state admin-card py-5">
                        <div class="empty-state-icon"><i class="bi bi-file-earmark-text"></i></div>
                        <h4 class="text-muted mb-2">{{ 'admin.no_pages_found'|trans }}</h4>
                        <p class="text-muted mb-4">{{ 'admin.pages_empty_filtered'|trans }}</p>
                        <div class="d-flex flex-wrap gap-2 justify-content-center">
                            <a href="{{ path('admin_pages') }}" class="btn btn-outline-primary">{{ 'admin.pages_reset_filters'|trans }}</a>
                            {% if canPageCreate %}
                            <a href="{{ path('admin_new_page') }}" class="btn btn-primary">
                                <i class="bi bi-plus-circle me-1"></i>{{ 'admin.createPage'|trans }}
                            </a>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        {% endif %}
    </div>

    <script>
        async function handleDeletePage(pageId, pageTitle) {
            const confirmed = await showDeleteConfirm(`{{ 'admin.page.delete_confirm_prefix'|trans }} "${pageTitle}"`);
            if (confirmed) {
                window.location.href = '{{ path('admin_delete_page', {id: '__ID__'}) }}'.replace('__ID__', pageId);
            }
        }
    </script>
{% endblock %}