{% extends "admin/layout.html" %}

{% block page_title %}مدیریت صفحات سئو{% endblock %}

{% block content %}

<div class="d-flex flex-wrap justify-content-between align-items-center mb-4">
    <div>
        <h4 class="fw-bold mb-0">
            <i class="fas fa-file-alt text-info"></i> مدیریت صفحات سئو
        </h4>
        <p class="text-secondary small mb-0">مدیریت صفحات تولید شده از کلمات کلیدی</p>
    </div>
    <div class="d-flex gap-2">
        <form action="{{ url_for('admin_seo_pages_generate') }}" method="POST" style="display:inline;">
            <button type="submit" class="btn btn-success btn-sm rounded-pill" onclick="return confirm('آیا از تولید خودکار صفحات سئو مطمئن هستید؟')">
                <i class="fas fa-sync-alt"></i> تولید خودکار
            </button>
        </form>
        <a href="{{ url_for('admin_seo') }}" class="btn btn-outline-secondary btn-sm rounded-pill">
            <i class="fas fa-arrow-right"></i> بازگشت
        </a>
    </div>
</div>

<!-- ===== کارت‌های آمار ===== -->
<div class="row g-3 mb-4">
    <div class="col-6 col-md-3">
        <div class="stat-card text-center">
            <div class="h3 text-info mb-0">{{ pages|length|default(0)|persian_numbers }}</div>
            <div class="text-secondary small">مجموع صفحات</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card text-center">
            <div class="h3 text-success mb-0">{{ pages|selectattr('is_active')|list|length|default(0)|persian_numbers }}</div>
            <div class="text-secondary small">فعال</div>
        </div>
    </div>
</div>

<!-- ===== جدول ===== -->
<div class="card border-0 shadow-sm" style="border-radius:16px;overflow:hidden;">
    <div class="card-body p-0">
        <div class="table-responsive">
            <table class="table table-hover mb-0">
                <thead class="table-light">
                    <tr>
                        <th>#</th>
                        <th>عنوان</th>
                        <th>کلمه کلیدی</th>
                        <th>اسلاگ</th>
                        <th>وضعیت</th>
                        <th>بازدید</th>
                        <th>عملیات</th>
                    </tr>
                </thead>
                <tbody>
                    {% if pages %}
                        {% for page in pages %}
                        <tr>
                            <td>{{ loop.index|persian_numbers }}</td>
                            <td>{{ page.title|truncate(30) }}</td>
                            <td>
                                {% if page.keyword %}
                                    <span class="badge bg-primary">{{ page.keyword.keyword }}</span>
                                {% else %}
                                    <span class="badge bg-secondary">بدون کلمه</span>
                                {% endif %}
                            </td>
                            <td><code>{{ page.slug }}</code></td>
                            <td>
                                {% if page.is_active %}
                                    <span class="badge bg-success">فعال</span>
                                {% else %}
                                    <span class="badge bg-danger">غیرفعال</span>
                                {% endif %}
                            </td>
                            <td>{{ page.view_count|default(0)|persian_numbers }}</td>
                            <td>
                                <div class="d-flex gap-1">
                                    <a href="{{ url_for('admin_seo_page_edit', id=page.id) }}" class="btn btn-sm btn-outline-primary rounded-pill">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <a href="{{ url_for('seo_page', slug=page.slug) }}" target="_blank" class="btn btn-sm btn-outline-info rounded-pill">
                                        <i class="fas fa-eye"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                        {% endfor %}
                    {% else %}
                        <tr>
                            <td colspan="7" class="text-center text-secondary py-4">
                                <i class="fas fa-file-alt" style="font-size:2rem;opacity:0.3;"></i>
                                <p class="mt-2 mb-0">هیچ صفحه سئو شده‌ای وجود ندارد.</p>
                                <form action="{{ url_for('admin_seo_pages_generate') }}" method="POST" style="display:inline;">
                                    <button type="submit" class="btn btn-success btn-sm mt-2">
                                        <i class="fas fa-sync-alt"></i> تولید خودکار صفحات
                                    </button>
                                </form>
                            </td>
                        </tr>
                    {% endif %}
                </tbody>
            </table>
        </div>
    </div>
</div>

{% endblock %}