@extends('layouts.tenant-admin')
@section('title', 'المقالات')

@section('content')
<div class="flex justify-between items-center mb-6">
    <div>
        <h2 class="text-2xl font-bold">المقالات</h2>
        @if ($articleLimit !== null)
            <p class="text-sm {{ $articleCount >= $articleLimit ? 'text-red-600' : 'text-gray-500' }}">
                {{ $articleCount }} / {{ $articleLimit }} مقال ضمن خطتك الحالية
            </p>
        @endif
    </div>
    @if ($articleLimit !== null && $articleCount >= $articleLimit)
        <span class="bg-gray-200 text-gray-500 px-4 py-2 rounded" title="وصلت للحد الأقصى — رقّي خطتك لإضافة المزيد">+ مقال جديد (وصلت للحد)</span>
    @else
        <a href="{{ route('tenant.articles.create') }}" class="bg-blue-600 text-white px-4 py-2 rounded">+ مقال جديد</a>
    @endif
</div>

<form method="get" class="flex gap-3 mb-4">
    <select name="category_id" onchange="this.form.submit()" class="border rounded p-2 text-sm">
        <option value="">كل الأقسام</option>
        @foreach ($categories as $cat)
            <option value="{{ $cat->id }}" @selected(request('category_id') == $cat->id)>{{ $cat->name }}</option>
        @endforeach
    </select>
    <select name="status" onchange="this.form.submit()" class="border rounded p-2 text-sm">
        <option value="">كل الحالات</option>
        <option value="draft" @selected(request('status') === 'draft')>مسودة</option>
        <option value="published" @selected(request('status') === 'published')>منشور</option>
        <option value="scheduled" @selected(request('status') === 'scheduled')>مجدول</option>
    </select>
    @if (request('category_id') || request('status'))
        <a href="{{ route('tenant.articles.index') }}" class="text-sm text-gray-500 self-center hover:underline">مسح الفلاتر</a>
    @endif
</form>

<table class="w-full bg-white rounded-lg shadow overflow-hidden text-sm">
    <thead class="bg-gray-100 text-gray-600">
        <tr>
            <th class="p-3 text-right">العنوان</th>
            <th class="p-3 text-right">القسم</th>
            <th class="p-3 text-right">الحالة</th>
            <th class="p-3 text-right">درجة السيو</th>
            <th class="p-3 text-right">تاريخ النشر</th>
            <th class="p-3 text-right">إجراءات</th>
        </tr>
    </thead>
    <tbody>
        @forelse ($articles as $article)
        <tr class="border-t">
            <td class="p-3 font-medium">
                {{ $article->title }}
                @if ($article->is_auto_generated)
                    <span class="text-xs bg-purple-100 text-purple-700 px-2 py-0.5 rounded mr-1">🤖 آلي</span>
                @endif
            </td>
            <td class="p-3 text-gray-500">{{ $article->category->name ?? '—' }}</td>
            <td class="p-3">
                <span @class([
                    'px-2 py-1 rounded text-xs',
                    'bg-green-100 text-green-700' => $article->status === 'published',
                    'bg-yellow-100 text-yellow-700' => $article->status === 'draft',
                    'bg-blue-100 text-blue-700' => $article->status === 'scheduled',
                ])>
                    {{ ['draft' => 'مسودة', 'published' => 'منشور', 'scheduled' => 'مجدول'][$article->status] ?? $article->status }}
                </span>
            </td>
            <td class="p-3">{{ $article->seo_score }}/100</td>
            <td class="p-3 text-gray-500">{{ $article->published_at?->format('Y-m-d') ?? '—' }}</td>
            <td class="p-3 space-x-2 space-x-reverse whitespace-nowrap">
                @if ($article->status === 'published')
                    <a href="{{ route('tenant.article.show', $article->slug) }}" target="_blank" class="text-gray-500 hover:underline">عرض</a>
                @endif
                <a href="{{ route('tenant.articles.edit', $article) }}" class="text-blue-600 hover:underline">تعديل</a>
                <form action="{{ route('tenant.articles.destroy', $article) }}" method="post" class="inline"
                      onsubmit="return confirm('متأكد تبي تحذف هذا المقال؟')">
                    @csrf @method('DELETE')
                    <button class="text-red-600 hover:underline">حذف</button>
                </form>
            </td>
        </tr>
        @empty
        <tr><td colspan="6" class="p-6 text-center text-gray-500">لا توجد مقالات بعد.</td></tr>
        @endforelse
    </tbody>
</table>

<div class="mt-4">{{ $articles->links() }}</div>
@endsection