@extends('layouts.app')

@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-7xl mx-auto">
            <!-- رأس الصفحة -->
            <div class="mb-8">
                <h1 class="text-3xl font-bold text-black mb-2">تقرير حركة الأصناف</h1>
                <p class="text-black">عرض جميع حركات الأصناف في المخازن (وارد - منصرف - تحويل)</p>
            </div>

            <!-- عناصر البحث والفلترة -->
            <form action="{{ route('inventory.reports.item-movements') }}" method="GET" class="bg-white rounded-xl shadow-lg p-6 mb-8 border border-gray-200">
                <div class="grid grid-cols-1 md:grid-cols-5 gap-4 mb-4">
                    <!-- البحث النصي -->
                    <div>
                        <label for="search" class="block text-sm font-medium text-black mb-2">البحث</label>
                        <input type="text" id="search" name="search" 
                            placeholder="ابحث بالصنف أو المستند..."
                            value="{{ request('search') }}"
                            class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
                    </div>

                    <!-- المخزن -->
                    <div>
                        <label for="warehouse_id" class="block text-sm font-medium text-black mb-2">المخزن</label>
                        <select id="warehouse_id" name="warehouse_id" 
                            class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
                            <option value="">كل المخازن</option>
                            @foreach ($warehouses as $warehouse)
                                <option value="{{ $warehouse->id }}" 
                                    {{ request('warehouse_id') == $warehouse->id ? 'selected' : '' }}>
                                    {{ $warehouse->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <!-- الصنف -->
                    <div>
                        <label for="item_id" class="block text-sm font-medium text-black mb-2">الصنف</label>
                        <select id="item_id" name="item_id" 
                            class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
                            <option value="">كل الأصناف</option>
                            @foreach ($items as $item)
                                <option value="{{ $item->id }}" 
                                    {{ request('item_id') == $item->id ? 'selected' : '' }}>
                                    {{ $item->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <!-- من التاريخ -->
                    <div>
                        <label for="date_from" class="block text-sm font-medium text-black mb-2">من التاريخ</label>
                        <input type="date" id="date_from" name="date_from"
                            value="{{ request('date_from') }}"
                            class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
                    </div>

                    <!-- إلى التاريخ -->
                    <div>
                        <label for="date_to" class="block text-sm font-medium text-black mb-2">إلى التاريخ</label>
                        <input type="date" id="date_to" name="date_to"
                            value="{{ request('date_to') }}"
                            class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
                    </div>
                </div>

                <!-- أزرار الإجراءات -->
                <div class="flex gap-3 justify-between items-center">
                    <div class="flex gap-3">
                        <button type="submit" class="inline-flex items-center px-6 py-2 bg-gradient-to-r from-blue-600 to-blue-700 text-white font-semibold rounded-lg hover:from-blue-700 hover:to-blue-800 transition-all duration-200 shadow-md hover:shadow-lg">
                            <i class="fas fa-search ml-2"></i>
                            <span>بحث</span>
                        </button>
                        <a href="{{ route('inventory.reports.item-movements') }}" class="inline-flex items-center px-6 py-2 bg-gray-200 text-black font-semibold rounded-lg hover:bg-gray-300 transition-all duration-200">
                            <i class="fas fa-redo ml-2"></i>
                            <span>إعادة تعيين</span>
                        </a>
                    </div>
                    <div class="flex gap-2">
                        <!-- تصدير Excel -->
                        <a href="{{ route('inventory.reports.item-movements') }}?{{ request()->getQueryString() }}&export=excel" 
                            class="inline-flex items-center px-4 py-2 bg-green-100 text-green-700 font-semibold rounded-lg hover:bg-green-200 transition-all duration-200" title="تصدير إلى Excel">
                            <i class="fas fa-file-excel ml-2"></i>
                            <span class="hidden md:inline">Excel</span>
                        </a>
                        <!-- طباعة -->
                        <button type="button" onclick="window.print()" class="inline-flex items-center px-4 py-2 bg-blue-100 text-blue-700 font-semibold rounded-lg hover:bg-blue-200 transition-all duration-200" title="طباعة">
                            <i class="fas fa-print ml-2"></i>
                            <span class="hidden md:inline">طباعة</span>
                        </button>
                    </div>
                </div>
            </form>

            <!-- ملخص الحركات -->
            @if ($movements && $movements->count() > 0)
                @php
                    // حساب أرصدة كل صنف بناءً على آخر حركة
                    $itemBalances = [];
                    $balances = [];
                    foreach ($movements as $mov) {
                        $key = $mov->item_name . '_' . ($mov->to_warehouse ?? $mov->from_warehouse ?? 'unknown');
                        $currentBalance = $balances[$key] ?? 0;
                        
                        if ($mov->document_type === 'receipt') {
                            $currentBalance += floatval($mov->quantity);
                        } elseif ($mov->document_type === 'issue') {
                            $currentBalance -= floatval($mov->quantity);
                        } elseif ($mov->document_type === 'transfer') {
                            $currentBalance += floatval($mov->quantity);
                        }
                        
                        $balances[$key] = $currentBalance;
                        $itemBalances[$mov->item_name] = $currentBalance;
                    }
                    
                    // الرصيد النهائي الكلي
                    $finalBalance = array_sum($itemBalances);
                @endphp
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
                    <!-- إجمالي الوارد -->
                    <div class="bg-white rounded-lg shadow-md border-l-4 border-green-500 p-4">
                        <p class="text-black text-sm font-medium">إجمالي الوارد</p>
                        <p class="text-2xl font-bold text-green-600 mt-1">
                            {{ number_format($movements->where('document_type', 'receipt')->sum('quantity'), 2) }}</p>
                    </div>

                    <!-- إجمالي المنصرف -->
                    <div class="bg-white rounded-lg shadow-md border-l-4 border-red-500 p-4">
                        <p class="text-black text-sm font-medium">إجمالي المنصرف</p>
                        <p class="text-2xl font-bold text-red-600 mt-1">
                            {{ number_format($movements->where('document_type', 'issue')->sum('quantity'), 2) }}</p>
                    </div>

                    <!-- إجمالي المحول -->
                    <div class="bg-white rounded-lg shadow-md border-l-4 border-blue-500 p-4">
                        <p class="text-black text-sm font-medium">إجمالي المحول</p>
                        <p class="text-2xl font-bold text-blue-600 mt-1">
                            {{ number_format($movements->where('document_type', 'transfer')->sum('quantity'), 2) }}</p>
                    </div>

                    <!-- الرصيد النهائي -->
                    <div class="bg-white rounded-lg shadow-md border-l-4 border-purple-500 p-4">
                        <p class="text-black text-sm font-medium">الرصيد النهائي</p>
                        <p class="text-2xl font-bold text-purple-600 mt-1">
                            {{ number_format($finalBalance, 2) }}
                        </p>
                    </div>
                </div>
            @endif

            <!-- جدول الحركات -->
            <div class="bg-white rounded-xl shadow-lg overflow-hidden border border-gray-200">
                <div class="overflow-x-auto">
                    <table class="w-full">
                        <thead class="bg-gradient-to-r from-gray-800 to-gray-900 text-white">
                            <tr>
                                <th class="px-6 py-4 text-right font-semibold text-sm">#</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">التاريخ</th>
                                <th class="px-6 py-4 text-center font-semibold text-sm">نوع الحركة</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">الصنف</th>
                                <th class="px-6 py-4 text-center font-semibold text-sm text-green-300">🟢 وارد</th>
                                <th class="px-6 py-4 text-center font-semibold text-sm text-red-300">🔴 منصرف</th>
                                <th class="px-6 py-4 text-center font-semibold text-sm text-blue-300">🔵 محول</th>
                                <th class="px-6 py-4 text-center font-semibold text-sm">الرصيد</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">الوحدة</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">السعر</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">المجموع</th>
                                <th class="px-6 py-4 text-right font-semibold text-sm">المستند</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-gray-200">
                            @php
                                // حساب الرصيد الجاري الصحيح لكل حركة
                                $balances = [];
                                foreach ($movements ?? [] as $mov) {
                                    // مفتاح فريد لكل صنف + مخزن
                                    $key = $mov->item_name . '_' . ($mov->to_warehouse ?? $mov->from_warehouse ?? 'unknown');
                                    
                                    // احصل على الرصيد الحالي (أو 0 إذا لم يكن موجوداً)
                                    $currentBalance = $balances[$key] ?? 0;
                                    
                                    // تحديث الرصيد حسب نوع الحركة
                                    if ($mov->document_type === 'receipt') {
                                        $currentBalance += floatval($mov->quantity);
                                    } elseif ($mov->document_type === 'issue') {
                                        $currentBalance -= floatval($mov->quantity);
                                    } elseif ($mov->document_type === 'transfer') {
                                        // التحويل يضيف للمخزن المستقبل
                                        $currentBalance += floatval($mov->quantity);
                                    }
                                    
                                    // احفظ الرصيد الجديد
                                    $balances[$key] = $currentBalance;
                                    
                                    // أضف الرصيد للحركة الحالية
                                    $mov->running_balance = $currentBalance;
                                }
                            @endphp
                            @forelse($movements ?? [] as $movement)
                                @php
                                    $isIn = $movement->movement_type === 'in';
                                    $isOut = $movement->movement_type === 'out';
                                    $isTransfer = $movement->movement_type === 'transfer';
                                @endphp
                                <tr class="hover:bg-blue-50 transition">
                                    <td class="px-6 py-4 text-black font-medium text-sm">{{ $loop->iteration }}</td>
                                    <td class="px-6 py-4 text-sm">{{ \Carbon\Carbon::parse($movement->document_date)->format('Y-m-d') }}</td>
                                    
                                    <!-- نوع الحركة -->
                                    <td class="px-6 py-4 text-center">
                                        @if ($isIn)
                                            <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-green-100 text-green-700">
                                                <i class="fas fa-arrow-down ml-1"></i>وارد
                                            </span>
                                        @elseif($isOut)
                                            <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-red-100 text-red-700">
                                                <i class="fas fa-arrow-up ml-1"></i>منصرف
                                            </span>
                                        @else
                                            <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-blue-100 text-blue-700">
                                                <i class="fas fa-exchange-alt ml-1"></i>تحويل
                                            </span>
                                        @endif
                                    </td>
                                    
                                    <td class="px-6 py-4 font-semibold text-sm">{{ $movement->item_name }}</td>
                                    
                                    <!-- 🟢 الكمية الواردة -->
                                    <td class="px-6 py-4 text-center font-bold text-green-600">
                                        {{ $isIn ? number_format($movement->quantity, 2) : '-' }}
                                    </td>
                                    
                                    <!-- 🔴 الكمية المنصرفة -->
                                    <td class="px-6 py-4 text-center font-bold text-red-600">
                                        {{ $isOut ? number_format($movement->quantity, 2) : '-' }}
                                    </td>
                                    
                                    <!-- 🔵 الكمية المحولة -->
                                    <td class="px-6 py-4 text-center font-bold text-blue-600">
                                        {{ $isTransfer ? number_format($movement->quantity, 2) : '-' }}
                                    </td>
                                    
                                    <!-- الرصيد الجاري -->
                                    <td class="px-6 py-4 text-center font-bold text-purple-600">
                                        {{ number_format($movement->running_balance ?? 0, 2) }}
                                    </td>
                                    
                                    <td class="px-6 py-4 text-right text-sm">{{ $movement->unit_name ?? '-' }}</td>
                                    <td class="px-6 py-4 text-center text-sm">{{ number_format($movement->unit_price ?? 0, 2) }}</td>
                                    <td class="px-6 py-4 text-center font-bold">{{ number_format($movement->total_cost ?? 0, 2) }}</td>
                                    <td class="px-6 py-4 text-right text-sm"><span class="bg-gray-100 px-2 py-1 rounded">{{ $movement->document_number }}</span></td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="12" class="px-6 py-12 text-center text-black">
                                        <i class="fas fa-inbox text-4xl mb-3 block opacity-30"></i>
                                        لا توجد حركات مخزن
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    @push('scripts')
    <style>
        @media print {
            .bg-gradient-to-br, form, button:not(.no-print) {
                display: none !important;
            }
            body {
                background: white;
            }
            .max-w-7xl {
                max-width: 100%;
            }
            table {
                border-collapse: collapse;
            }
        }
    </style>
    @endpush
@endsection