@extends('admin.layouts.admin')

@section('content')
<div class="bg-white p-6 rounded-lg shadow-md">
    <div class="flex justify-between items-center mb-6">
        <h2 class="text-2xl font-bold text-gray-800">إدارة عمليات الدفع</h2>
        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">إجمالي: {{ $payments->total() }}</span>
    </div>

    @if(session('success'))
        <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
            {{ session('success') }}
        </div>
    @endif

    <div class="overflow-x-auto">
        <table class="w-full text-right border-collapse">
            <thead>
                <tr class="bg-gray-100">
                    <th class="p-3 border">المستخدم</th>
                    <th class="p-3 border">رقم الطلب</th>
                    <th class="p-3 border">المبلغ</th>
                    <th class="p-3 border">الطريقة</th>
                    <th class="p-3 border">الإيصال</th>
                    <th class="p-3 border">الحالة</th>
                    <th class="p-3 border">التاريخ</th>
                    <th class="p-3 border">العمليات</th>
                </tr>
            </thead>
            <tbody>
                @forelse($payments as $payment)
                <tr class="hover:bg-gray-50">
                    <td class="p-3 border">
                        <div class="font-bold text-gray-700">{{ $payment->user->name }}</div>
                        <div class="text-xs text-gray-500">{{ $payment->user->phone }}</div>
                    </td>
                    <td class="p-3 border font-mono">{{ $payment->transaction_id }}</td>
                    <td class="p-3 border font-bold text-blue-600">{{ number_format($payment->amount, 2) }} ج.م</td>
                    <td class="p-3 border">
                        @php
                            $methodLabels = ['vodafone' => 'فودافون كاش', 'instapay' => 'InstaPay', 'fawry' => 'فوري (Fawry)'];
                            $methodClasses = ['vodafone' => 'bg-red-50 text-red-700', 'instapay' => 'bg-blue-50 text-blue-700', 'fawry' => 'bg-yellow-50 text-yellow-700'];
                        @endphp
                        <span class="px-2 py-1 rounded text-xs font-bold {{ $methodClasses[$payment->method] ?? 'bg-gray-50' }}">
                            {{ $methodLabels[$payment->method] ?? $payment->method }}
                        </span>
                    </td>
                    <td class="p-3 border text-center">
                        <a href="{{ asset('storage/' . $payment->proof_image) }}" target="_blank" class="text-blue-500 hover:text-blue-700">
                            <i class="fas fa-image text-xl"></i>
                        </a>
                    </td>
                    <td class="p-3 border">
                        @php
                            $statusLabels = ['pending' => 'قيد المراجعة', 'approved' => 'مقبول', 'rejected' => 'مرفوض'];
                            $statusClasses = ['pending' => 'bg-yellow-100 text-yellow-800', 'approved' => 'bg-green-100 text-green-800', 'rejected' => 'bg-red-100 text-red-800'];
                        @endphp
                        <span class="px-2 py-1 rounded text-xs font-bold {{ $statusClasses[$payment->status] ?? 'bg-gray-100' }}">
                            {{ $statusLabels[$payment->status] ?? $payment->status }}
                        </span>
                    </td>
                    <td class="p-3 border text-gray-600 text-sm">{{ $payment->created_at->format('Y-m-d H:i') }}</td>
                    <td class="p-3 border">
                        <div class="flex gap-2">
                            @if($payment->status === 'pending')
                                <form action="{{ route('admin.payments.update-status', $payment->id) }}" method="POST">
                                    @csrf
                                    <input type="hidden" name="status" value="approved">
                                    <button type="submit" class="text-xs bg-green-500 text-white px-2 py-1 rounded hover:bg-green-600" onclick="return confirm('هل تريد الموافقة على الدفع وتفعيل حساب المستخدم؟')">
                                        تأكيد
                                    </button>
                                </form>
                                <form action="{{ route('admin.payments.update-status', $payment->id) }}" method="POST">
                                    @csrf
                                    <input type="hidden" name="status" value="rejected">
                                    <button type="submit" class="text-xs bg-red-500 text-white px-2 py-1 rounded hover:bg-red-600">
                                        رفض
                                    </button>
                                </form>
                            @endif
                            <form action="{{ route('admin.payments.destroy', $payment->id) }}" method="POST" onsubmit="return confirm('هل أنت متأكد من حذف هذا السجل؟')">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="text-gray-400 hover:text-red-600">
                                    <i class="fas fa-trash"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="8" class="p-8 text-center text-gray-500 italic">لا توجد عمليات دفع حالياً.</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

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