@extends('layouts.app')

@section('title', 'مقارنة عروض الأسعار')

@section('content')
<div class="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 py-8 px-4 md:px-8">
    <div class="max-w-full mx-auto">
        <div class="mb-8">
            <div class="flex items-center justify-between mb-6">
                <div>
                    <h1 class="text-3xl font-bold text-black mb-2">مقارنة عروض الأسعار</h1>
                    <p class="text-black">تحليل ومقارنة العروض المقدمة من الموردين</p>
                </div>
                <div class="flex gap-3">
                    <button onclick="window.print()" class="inline-flex items-center px-6 py-3 bg-white border border-gray-300 text-black font-semibold rounded-lg hover:bg-gray-50 transition-all duration-200 shadow-sm">
                        <i class="fas fa-print ml-2"></i>
                        <span>طباعة</span>
                    </button>
                    <a href="{{ route('quotations.index') }}" class="inline-flex items-center px-6 py-3 bg-gray-600 text-white font-semibold rounded-lg hover:bg-gray-700 transition-all duration-200 shadow-lg">
                        <i class="fas fa-arrow-right ml-2"></i>
                        <span>العودة</span>
                    </a>
                </div>
            </div>
        </div>

        @if($quotations->isEmpty())
            <div class="bg-white rounded-xl shadow-lg p-12 text-center border border-gray-200">
                <div class="flex flex-col items-center justify-center">
                    <i class="fas fa-search text-black text-6xl mb-4"></i>
                    <h2 class="text-2xl font-bold text-black mb-2">لا توجد عروض للمقارنة</h2>
                    <p class="text-black max-w-md mx-auto">يرجى اختيار طلبات عروض الأسعار التي ترغب في مقارنة عروضها من صفحة طلبات عروض الأسعار.</p>
                </div>
            </div>
        @else
            <div class="space-y-8">
                <!-- Summary Section -->
                <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                    <div class="bg-white p-6 rounded-xl shadow-sm border border-gray-100">
                        <h3 class="text-sm font-medium text-black mb-1">عدد العروض</h3>
                        <p class="text-3xl font-bold text-blue-600">{{ $quotations->count() }}</p>
                    </div>
                    <div class="bg-white p-6 rounded-xl shadow-sm border border-gray-100">
                        <h3 class="text-sm font-medium text-black mb-1">أقل سعر إجمالي</h3>
                        <p class="text-3xl font-bold text-green-600">{{ number_format($quotations->min('total_amount'), 2) }} ريال</p>
                    </div>
                    <div class="bg-white p-6 rounded-xl shadow-sm border border-gray-100">
                        <h3 class="text-sm font-medium text-black mb-1">أعلى سعر إجمالي</h3>
                        <p class="text-3xl font-bold text-red-600">{{ number_format($quotations->max('total_amount'), 2) }} ريال</p>
                    </div>
                </div>

                <!-- Comparison Table -->
                <div class="bg-white rounded-xl shadow-lg overflow-hidden border border-gray-200">
                    <div class="overflow-x-auto">
                        <table class="w-full border-collapse">
                            <thead>
                                <tr class="bg-gray-900 text-white">
                                    <th class="px-6 py-5 text-right font-semibold text-sm border-b border-gray-700 w-64">الصنف / المورد</th>
                                    @foreach($quotations as $quotation)
                                        <th class="px-6 py-5 text-center font-semibold text-sm border-b border-gray-700 min-w-[200px]">
                                            <div class="text-base">{{ $quotation->supplier->name ?? '-' }}</div>
                                            <div class="text-xs text-black mt-1">{{ $quotation->quotation_number }}</div>
                                        </th>
                                    @endforeach
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-gray-200">
                                @foreach($items as $item)
                                    <tr class="hover:bg-slate-50 transition-colors">
                                        <td class="px-6 py-4 bg-gray-50">
                                            <div class="font-semibold text-black">{{ $item->name }}</div>
                                            <div class="text-xs text-black">{{ $item->code }}</div>
                                        </td>
                                        @foreach($quotations as $quotation)
                                            @php
                                                $qItem = $quotation->items->where('item_id', $item->id)->first();
                                                $isLowest = false;
                                                if ($qItem) {
                                                    $allPricesForItem = [];
                                                    foreach($quotations as $q) {
                                                        $qi = $q->items->where('item_id', $item->id)->first();
                                                        if ($qi) $allPricesForItem[] = $qi->unit_price;
                                                    }
                                                    if (count($allPricesForItem) > 0 && $qItem->unit_price == min($allPricesForItem)) {
                                                        $isLowest = true;
                                                    }
                                                }
                                            @endphp
                                            <td class="px-6 py-4 text-center @if($isLowest) bg-green-50 @endif">
                                                @if($qItem)
                                                    <div class="text-lg font-bold @if($isLowest) text-green-700 @else text-black @endif">
                                                        {{ number_format($qItem->unit_price, 2) }} ريال
                                                    </div>
                                                    <div class="text-xs text-black mt-1">
                                                        الكمية: {{ $qItem->quantity }} {{ $qItem->unit->name ?? '' }}
                                                    </div>
                                                @else
                                                    <span class="text-black text-sm">غير متوفر</span>
                                                @endif
                                            </td>
                                        @endforeach
                                    </tr>
                                @endforeach
                                
                                <!-- Totals Row -->
                                <tr class="bg-gray-100 font-bold border-t-2 border-gray-300">
                                    <td class="px-6 py-6 text-lg">الإجمالي النهائي</td>
                                    @foreach($quotations as $quotation)
                                        @php
                                            $isLowestTotal = $quotation->total_amount == $quotations->min('total_amount');
                                        @endphp
                                        <td class="px-6 py-6 text-center">
                                            <div class="text-xl @if($isLowestTotal) text-green-600 @else text-black @endif">
                                                {{ number_format($quotation->total_amount, 2) }} ريال
                                            </div>
                                            @if($isLowestTotal)
                                                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800 mt-2">
                                                    الأقل سعراً
                                                </span>
                                            @endif
                                        </td>
                                    @endforeach
                                </tr>

                                <!-- Status and Actions -->
                                <tr class="bg-white">
                                    <td class="px-6 py-4 font-medium text-black">الإجراءات</td>
                                    @foreach($quotations as $quotation)
                                        <td class="px-6 py-4 text-center">
                                            @if($quotation->status === 'accepted')
                                                <span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-green-100 text-green-700">
                                                    <i class="fas fa-check-circle ml-1"></i>
                                                    تم القبول
                                                </span>
                                            @else
                                                <div class="flex flex-col gap-2">
                                                    <form action="{{ route('quotations.accept', $quotation) }}" method="POST">
                                                        @csrf
                                                        <button type="submit" class="w-full px-4 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition text-sm font-medium">
                                                            قبول العرض
                                                        </button>
                                                    </form>
                                                    <a href="{{ route('quotations.show', $quotation) }}" class="text-blue-600 hover:text-blue-800 text-sm font-medium underline">
                                                        عرض التفاصيل
                                                    </a>
                                                </div>
                                            @endif
                                        </td>
                                    @endforeach
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- Detailed Info Section -->
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    @foreach($quotations as $quotation)
                        <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
                            <div class="px-4 py-3 bg-gray-50 border-b border-gray-200 flex justify-between items-center">
                                <h4 class="font-bold text-black">{{ $quotation->supplier->name }}</h4>
                                <span class="text-xs bg-gray-200 px-2 py-1 rounded text-black">{{ $quotation->quotation_number }}</span>
                            </div>
                            <div class="p-4 space-y-3">
                                <div class="flex justify-between text-sm">
                                    <span class="text-black">تاريخ الصلاحية:</span>
                                    <span class="font-medium">{{ $quotation->validity_date->format('Y-m-d') }}</span>
                                </div>
                                <div class="flex justify-between text-sm">
                                    <span class="text-black">مدة التوريد:</span>
                                    <span class="font-medium">{{ $quotation->notes ?? 'حسب الاتفاق' }}</span>
                                </div>
                                @if($quotation->attachment)
                                    <div class="mt-4 pt-4 border-t border-gray-100 text-center">
                                        <a href="{{ asset('storage/' . $quotation->attachment) }}" target="_blank" class="text-blue-600 hover:text-blue-800 text-sm font-semibold flex items-center justify-center">
                                            <i class="fas fa-file-pdf ml-2"></i>
                                            تحميل العرض المرفق
                                        </a>
                                    </div>
                                @endif
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        @endif
    </div>
</div>

<style>
    @media print {
        .no-print { display: none !important; }
        body { background: white; }
        .min-h-screen { min-height: 0 !important; }
        .shadow-lg, .shadow-sm { shadow: none !important; box-shadow: none !important; }
        .bg-gradient-to-br { background: white !important; }
    }
</style>
@endsection