@extends('layouts.app')

@section('content')
<div class="container m-auto p-4 sm:p-6 lg:p-8">
    <div class="bg-white rounded-lg shadow-lg p-6">
        <h1 class="text-2l font-bold text-black mb-6">أرصدة المخزون</h1>

        <!-- فلاتر البحث -->
        <div class="mb-6 bg-gray-50 p-4 rounded-lg">
            <form action="{{ route('inventory.balances.index') }}" method="GET" class="grid grid-cols-1 md:grid-cols-3 gap-4">
                <div>
                    <label for="warehouse_id" class="block text-sm font-medium text-black mb-1">المخزن</label>
                    <select id="warehouse_id" name="warehouse_id" class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring focus:ring-primary-500 focus:ring-opacity-50">
                        <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-1">الصنف</label>
                    <select id="item_id" name="item_id" class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring focus:ring-primary-500 focus:ring-opacity-50">
                        <option value="">جميع الأصناف</option>
                        @foreach($items as $item)
                            <option value="{{ $item->id }}" {{ request('item_id') == $item->id ? 'selected' : '' }}>
                                {{ $item->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="flex items-end">
                    <button type="submit" class="inline-flex items-center p-4 py-2 bg-primary-600 text-white rounded-md hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-1" viewBox="0 0 20 20" fill="currentColor">
                            <path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd" />
                        </svg>
                        بحث
                    </button>
                    <a href="{{ route('inventory.balances.index') }}" class="inline-flex items-center p-4 py-2 bg-gray-200 text-black rounded-md hover:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 mr-2">
                        إعادة تعيين
                    </a>
                </div>
            </form>
        </div>

        <!-- ملخص الأرصدة -->
        <div class="mb-6 bg-primary-50 p-4 rounded-lg">
            <div class="flex flex-wrap justify-between items-center">
                <div class="mb-2 md:mb-0">
                    <span class="text-black">إجمالي عدد الأصناف:</span>
                    <span class="font-bold text-primary-700 mr-1">{{ $balances->count() }}</span>
                </div>
                <div>
                    <span class="text-black">إجمالي قيمة المخزون:</span>
                    <span class="font-bold text-primary-700 mr-1">{{ number_format($totalValue, 2) }}</span>
                </div>
            </div>
        </div>

        <!-- جدول الأرصدة -->
        <div class="overflow--auto">
            <table class="min-w-full divide-y divide-gray-200">
                <thead class="bg-gray-50">
                    <tr>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            المخزن
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            الصنف
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            الوحدة
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            الكمية
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            التكلفة
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            القيمة الإجمالية
                        </th>
                        <th scope="col" class="p-6 py-3 text-right text-s font-medium text-black uppercase tracking-wider">
                            الإجراءات
                        </th>
                    </tr>
                </thead>
                <tbody class="bg-white divide-y divide-gray-200">
                    @forelse($balances as $balance)
                        <tr>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ $balance->warehouse->name }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ $balance->item->name }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ $balance->unit->name }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ number_format($balance->quantity, 2) }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ number_format($balance->cost, 2) }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                {{ number_format($balance->total_value, 2) }}
                            </td>
                            <td class="p-6 py-4 whitespace-nowrap text-sm text-black">
                                <div class="flex space-y-2 space-y-reverse">
                                    <a href="{{ route('inventory.balances.warehouse', $balance->warehouse_id) }}" class="text-primary-600 hover:text-primary-900">
                                        عرض المخزن
                                    </a>
                                    <a href="{{ route('inventory.balances.item', $balance->item_id) }}" class="text-primary-600 hover:text-primary-900 mr-2">
                                        عرض الصنف
                                    </a>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="7" class="p-6 py-4 whitespace-nowrap text-sm text-black text-center">
                                لا توجد أرصدة مخزون متاحة
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection