@extends('layouts.app')
@section('content')
<div class="p-6">
    <div class="mb-6">
        <h1 class="text-3xl font-bold text-black mb-2">ملخص مشتريات الموردين (طلبات الشراء)</h1>
        <p class="text-black">تقرير إحصائي لحجم التعاقدات وأداء الموردين بناءً على طلبات الشراء المصدرة</p>
    </div>

    <div class="bg-white rounded-lg shadow-md p-6">
        <form method="GET" class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
            <div>
                <label class="block text-sm font-medium text-black mb-2">تاريخ البداية</label>
                <input type="date" name="start_date" value="{{ request('start_date') }}" class="w-full px-3 py-2 border border-gray-300 rounded-md">
            </div>
            <div>
                <label class="block text-sm font-medium text-black mb-2">تاريخ النهاية</label>
                <input type="date" name="end_date" value="{{ request('end_date') }}" class="w-full px-3 py-2 border border-gray-300 rounded-md">
            </div>
            <div>
                <label class="block text-sm font-medium text-black mb-2">المورد</label>
                <select name="supplier_id" class="w-full px-3 py-2 border border-gray-300 rounded-md">
                    <option value="">جميع الموردين</option>
                </select>
            </div>
            <div class="flex items-end">
                <button type="submit" class="w-full px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">بحث</button>
            </div>
        </form>

        <div class="overflow-x-auto">
            <table class="w-full border-collapse">
                <thead>
                    <tr class="bg-gray-100 border-b border-gray-300">
                        <th class="px-4 py-3 text-right font-semibold text-black">المورد</th>
                        <th class="px-4 py-3 text-right font-semibold text-black">المدينة</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">عدد طلبات الشراء</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">إجمالي المشتريات</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">متوسط الطلب</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">النسبة المئوية</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">تقييم الأداء</th>
                        <th class="px-4 py-3 text-center font-semibold text-black">الحالة</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($data as $supplier)
                    <tr class="border-b border-gray-200 hover:bg-gray-50">
                        <td class="px-4 py-3 text-right font-medium text-black">{{ $supplier['name'] }}</td>
                        <td class="px-4 py-3 text-right text-black">{{ $supplier['city'] }}</td>
                        <td class="px-4 py-3 text-center text-black">{{ $supplier['po_count'] }}</td>
                        <td class="px-4 py-3 text-center font-medium text-black">{{ number_format($supplier['total_purchases'], 2) }}</td>
                        <td class="px-4 py-3 text-center text-black">{{ number_format($supplier['average_po'], 2) }}</td>
                        <td class="px-4 py-3 text-center">
                            <span class="inline-block px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm font-medium">
                                {{ number_format($supplier['percentage'], 2) }}%
                            </span>
                        </td>
                        <td class="px-4 py-3 text-center">
                            <span class="inline-block px-3 py-1 rounded-full text-sm font-medium
                                @if($supplier['performance_rating'] >= 4.5)
                                    bg-green-100 text-green-800
                                @elseif($supplier['performance_rating'] >= 3.5)
                                    bg-yellow-100 text-yellow-800
                                @else
                                    bg-red-100 text-red-800
                                @endif
                            ">
                                {{ number_format($supplier['performance_rating'], 2) }}
                            </span>
                        </td>
                        <td class="px-4 py-3 text-center">
                            <span class="inline-block px-3 py-1 
                                @if($supplier['status'] === 'active')
                                    bg-green-100 text-green-800
                                @else
                                    bg-gray-100 text-black
                                @endif
                                rounded-full text-sm font-medium">
                                @if($supplier['status'] === 'active')
                                    نشط
                                @else
                                    غير نشط
                                @endif
                            </span>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="8" class="px-4 py-8 text-center text-black">لا توجد بيانات متاحة</td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if($data && count($data) > 0)
        <div class="mt-6 grid grid-cols-1 md:grid-cols-4 gap-4">
            <div class="bg-blue-50 rounded-lg p-4">
                <p class="text-sm text-black mb-1">إجمالي الموردين</p>
                <p class="text-2xl font-bold text-blue-600">{{ count($data) }}</p>
            </div>
            <div class="bg-green-50 rounded-lg p-4">
                <p class="text-sm text-black mb-1">إجمالي طلبات الشراء</p>
                <p class="text-2xl font-bold text-green-600">{{ $data->sum('po_count') }}</p>
            </div>
            <div class="bg-purple-50 rounded-lg p-4">
                <p class="text-sm text-black mb-1">إجمالي المشتريات</p>
                <p class="text-2xl font-bold text-purple-600">{{ number_format($data->sum('total_purchases'), 2) }}</p>
            </div>
            <div class="bg-orange-50 rounded-lg p-4">
                <p class="text-sm text-black mb-1">متوسط الأداء</p>
                <p class="text-2xl font-bold text-orange-600">{{ number_format($data->average('performance_rating'), 2) }}</p>
            </div>
        </div>
        @endif
    </div>
</div>
@endsection