@extends('layouts.landlord')
@section('title', 'العملاء')

@section('content')
<div class="flex justify-between items-center mb-6">
    <h2 class="text-2xl font-bold">العملاء (المواقع المستضافة)</h2>
    <div class="flex items-center gap-4">
        <span class="text-sm text-gray-500">الإجمالي: {{ $tenants->total() }}</span>
        <a href="{{ route('landlord.tenants.create') }}" class="bg-blue-600 text-white px-4 py-2 rounded">+ إضافة موقع يدوياً</a>
    </div>
</div>

<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>
        @foreach ($tenants as $tenant)
        <tr class="border-t">
            <td class="p-3 font-medium">{{ $tenant->name }}</td>
            <td class="p-3 text-gray-500" dir="ltr">
                {{ $tenant->domains->first()->domain ?? $tenant->custom_domain ?? $tenant->slug.'.'.(config('app.central_domains')[0] ?? 'zeena.app') }}
            </td>
            <td class="p-3">{{ $tenant->plan->name ?? '—' }}</td>
            <td class="p-3">
                <span @class([
                    'px-2 py-1 rounded text-xs',
                    'bg-green-100 text-green-700' => $tenant->status === 'active',
                    'bg-yellow-100 text-yellow-700' => $tenant->status === 'provisioning',
                    'bg-red-100 text-red-700' => $tenant->status === 'suspended',
                ])>
                    {{ ['active' => 'نشط', 'provisioning' => 'جاري التجهيز', 'suspended' => 'موقوف'][$tenant->status] ?? $tenant->status }}
                </span>
            </td>
            <td class="p-3 text-gray-500">{{ $tenant->provisioned_at?->format('Y-m-d') ?? '—' }}</td>
            <td class="p-3 space-x-2 space-x-reverse whitespace-nowrap">
                <a href="{{ route('landlord.tenants.edit', $tenant) }}" class="text-blue-600 hover:underline">تعديل</a>
                @if ($tenant->status === 'active')
                    <form action="{{ route('landlord.tenants.suspend', $tenant) }}" method="post" class="inline">
                        @csrf
                        <button class="text-red-600 hover:underline">إيقاف</button>
                    </form>
                @else
                    <form action="{{ route('landlord.tenants.activate', $tenant) }}" method="post" class="inline">
                        @csrf
                        <button class="text-green-600 hover:underline">تفعيل</button>
                    </form>
                @endif
            </td>
        </tr>
        @endforeach
    </tbody>
</table>

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