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

{% block title %}Sayfalar{% endblock %}
{% block page_title %}Sayfa Yönetimi{% endblock %}

{% block body %}
    {# Actions bar #}
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between mb-6 gap-4">
        <div class="flex items-center gap-3">
            <a href="{{ path('admin_page_create') }}" class="btn-primary">
                <i class="fas fa-plus mr-2"></i> Yeni Sayfa
            </a>
        </div>
    </div>

    {# Pages table #}
    <div class="card overflow-hidden">
        <div class="overflow-x-auto">
            <table class="table">
                <thead>
                    <tr>
                        <th>Başlık</th>
                        <th>Slug</th>
                        <th>Şablon</th>
                        <th>Durum</th>
                        <th>Sıra</th>
                        <th class="w-24">İşlem</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-200 bg-white">
                    {% for page in pages %}
                        <tr>
                            <td>
                                <a href="{{ path('admin_page_edit', {id: page.id}) }}"
                                   class="font-medium text-gray-900 hover:text-primary-600">
                                    {{ page.title }}
                                </a>
                            </td>
                            <td class="text-gray-500 text-sm">
                                {{ page.slug }}
                            </td>
                            <td>
                                <span class="badge-info">{{ page.template }}</span>
                            </td>
                            <td>
                                {% if page.status == 'published' %}
                                    <span class="badge-success">Yayında</span>
                                {% elseif page.status == 'draft' %}
                                    <span class="badge-gray">Taslak</span>
                                {% endif %}
                            </td>
                            <td class="text-gray-500">
                                {{ page.position }}
                            </td>
                            <td>
                                <div class="flex items-center gap-2">
                                    <a href="{{ path('admin_page_edit', {id: page.id}) }}"
                                       class="text-primary-600 hover:text-primary-900" title="Düzenle">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <form method="post" action="{{ path('admin_page_delete', {id: page.id}) }}"
                                          onsubmit="return confirm('Bu sayfayı silmek istediğinize emin misiniz?')">
                                        <input type="hidden" name="_token" value="{{ csrf_token('delete_page_' ~ page.id) }}">
                                        <button type="submit" class="text-red-600 hover:text-red-900" title="Sil">
                                            <i class="fas fa-trash-alt"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    {% else %}
                        <tr>
                            <td colspan="6" class="text-center text-gray-500 py-12">
                                <i class="fas fa-file-alt text-4xl text-gray-300 mb-3 block"></i>
                                Henüz sayfa eklenmemiş.
                                <br>
                                <a href="{{ path('admin_page_create') }}" class="text-primary-600 hover:text-primary-500 mt-2 inline-block">
                                    İlk sayfayı ekleyin
                                </a>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}
