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

{% block title %}Reklamlar{% endblock %}
{% block page_title %}Reklam 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_ad_create') }}" class="btn-primary">
                <i class="fas fa-plus mr-2"></i> Yeni Reklam
            </a>
            <a href="{{ path('admin_ad_channels') }}" class="btn-outline">
                <i class="fas fa-th-large mr-2"></i> Reklam Kanalları
            </a>
        </div>
    </div>

    {# Status filter tabs #}
    <div class="border-b border-gray-200 mb-6">
        <nav class="-mb-px flex space-x-6" aria-label="Tabs">
            <a href="{{ path('admin_advertisements') }}"
               class="whitespace-nowrap border-b-2 py-3 px-1 text-sm font-medium {{ currentStatus is null ? 'border-primary-500 text-primary-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700' }}">
                Tümü
            </a>
            <a href="{{ path('admin_advertisements', {status: 'active'}) }}"
               class="whitespace-nowrap border-b-2 py-3 px-1 text-sm font-medium {{ currentStatus == 'active' ? 'border-primary-500 text-primary-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700' }}">
                Aktif
            </a>
            <a href="{{ path('admin_advertisements', {status: 'draft'}) }}"
               class="whitespace-nowrap border-b-2 py-3 px-1 text-sm font-medium {{ currentStatus == 'draft' ? 'border-primary-500 text-primary-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700' }}">
                Taslak
            </a>
            <a href="{{ path('admin_advertisements', {status: 'paused'}) }}"
               class="whitespace-nowrap border-b-2 py-3 px-1 text-sm font-medium {{ currentStatus == 'paused' ? 'border-primary-500 text-primary-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700' }}">
                Duraklatılmış
            </a>
        </nav>
    </div>

    {# Advertisements table #}
    <div class="card overflow-hidden">
        <div class="overflow-x-auto">
            <table class="table">
                <thead>
                    <tr>
                        <th>Ad</th>
                        <th>Pozisyon</th>
                        <th>Tip</th>
                        <th>Durum</th>
                        <th>Gösterim</th>
                        <th>Tıklama</th>
                        <th>Bitiş</th>
                        <th class="w-24">İşlem</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-200 bg-white">
                    {% for ad in advertisements %}
                        <tr>
                            <td>
                                <a href="{{ path('admin_ad_edit', {id: ad.id}) }}"
                                   class="font-medium text-gray-900 hover:text-primary-600">
                                    {{ ad.name }}
                                </a>
                                {% if ad.isPinned %}
                                    <i class="fas fa-thumbtack text-yellow-500 ml-1" title="Sabitlenmiş"></i>
                                {% endif %}
                            </td>
                            <td class="text-sm text-gray-500">
                                <span class="inline-flex items-center rounded bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600">
                                    {{ ad.positionCategory }}
                                </span>
                                <span class="block text-xs text-gray-400 mt-0.5">{{ ad.position }}</span>
                            </td>
                            <td class="text-sm text-gray-500">
                                {% if ad.adType == 'image' %}
                                    <i class="fas fa-image text-blue-500 mr-1"></i> Görsel
                                {% elseif ad.adType == 'adsense' %}
                                    <i class="fab fa-google text-green-500 mr-1"></i> AdSense
                                {% elseif ad.adType == 'custom_html' %}
                                    <i class="fas fa-code text-purple-500 mr-1"></i> HTML
                                {% elseif ad.adType == 'video' %}
                                    <i class="fas fa-video text-red-500 mr-1"></i> Video
                                {% endif %}
                            </td>
                            <td>
                                {% if ad.status == 'active' %}
                                    <span class="badge-success">Aktif</span>
                                {% elseif ad.status == 'draft' %}
                                    <span class="badge-gray">Taslak</span>
                                {% elseif ad.status == 'paused' %}
                                    <span class="inline-flex items-center rounded-full bg-yellow-50 px-2 py-0.5 text-xs font-medium text-yellow-700">Duraklatılmış</span>
                                {% elseif ad.status == 'expired' %}
                                    <span class="inline-flex items-center rounded-full bg-red-50 px-2 py-0.5 text-xs font-medium text-red-700">Süresi Dolmuş</span>
                                {% endif %}
                            </td>
                            <td class="text-sm text-gray-500">
                                {{ ad.impressionCount|number_format(0, ',', '.') }}
                            </td>
                            <td class="text-sm text-gray-500">
                                {{ ad.clickCount|number_format(0, ',', '.') }}
                            </td>
                            <td class="text-sm text-gray-500">
                                {% if ad.endsAt %}
                                    {{ ad.endsAt|date('d.m.Y') }}
                                {% else %}
                                    <span class="text-gray-400">-</span>
                                {% endif %}
                            </td>
                            <td>
                                <div class="flex items-center gap-2">
                                    <a href="{{ path('admin_ad_edit', {id: ad.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_ad_delete', {id: ad.id}) }}"
                                          onsubmit="return confirm('Bu reklamı silmek istediğinize emin misiniz?')">
                                        <input type="hidden" name="_token" value="{{ csrf_token('delete_ad_' ~ ad.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="8" class="text-center text-gray-500 py-12">
                                <i class="fas fa-ad text-4xl text-gray-300 mb-3 block"></i>
                                Henüz reklam eklenmemiş.
                                <br>
                                <a href="{{ path('admin_ad_create') }}" class="text-primary-600 hover:text-primary-500 mt-2 inline-block">
                                    İlk reklamı ekleyin
                                </a>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}
