﻿<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between">
            <h2 class="font-semibold text-l text-gray-800 leading-tight">
{{ \App\Helpers\TranslationHelper::transFromDatabase('Bank Withdrawals', __('سندات السحب البنكية')) }}
            </h2>
            @permission('banking.withdrawals.create')
                <a href="{{ route('banking.withdrawals.create') }}" class="inline-flex items-center p-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-s text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150">
                    {{ __('إنشاء سند سحب جديد') }}
                </a>
            @endpermission
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7l m-auto sm:p-6 lg:p-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 bg-white border-b border-gray-200">
                    <!-- فلاتر البحث -->
                    <div class="mb-6">
                        <form method="GET" action="{{ route('banking.withdrawals.index') }}" class="grid grid-cols-1 md:grid-cols-4 gap-4">
                            <div>
                                <x-input-label for="bank_account_id" :value="__('الحساب البنكي')" />
                                <select id="bank_account_id" name="bank_account_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                                    <option value="">{{ __('جميع الحسابات') }}</option>
                                    @foreach($bankAccounts as $account)
                                        <option value="{{ $account->id }}" {{ request('bank_account_id') == $account->id ? 'selected' : '' }}>
                                            {{ $account->bank->name }} - {{ $account->account_name }} - {{ $account->account_number }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>

                            <div>
                                <x-input-label for="status" :value="__('الحالة')" />
                                <select id="status" name="status" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                                    <option value="">{{ __('جميع الحالات') }}</option>
                                    <option value="pending" {{ request('status') == 'pending' ? 'selected' : '' }}>{{ __('قيد الانتظار') }}</option>
                                    <option value="approved" {{ request('status') == 'approved' ? 'selected' : '' }}>{{ __('معتمد') }}</option>
                                    <option value="rejected" {{ request('status') == 'rejected' ? 'selected' : '' }}>{{ __('مرفوض') }}</option>
                                </select>
                            </div>

                            <div>
                                <x-input-label for="date_from" :value="__('من تاريخ')" />
                                <x-text-input id="date_from" class="block mt-1 w-full" type="date" name="date_from" :value="request('date_from')" />
                            </div>

                            <div>
                                <x-input-label for="date_to" :value="__('إلى تاريخ')" />
                                <x-text-input id="date_to" class="block mt-1 w-full" type="date" name="date_to" :value="request('date_to')" />
                            </div>

                            <div class="md:col-span-4 flex justify-end">
                                <x-primary-button class="ms-3">
                                    {{ __('بحث') }}
                                </x-primary-button>
                                <a href="{{ route('banking.withdrawals.index') }}" class="inline-flex items-center p-4 py-2 bg-gray-300 border border-transparent rounded-md font-semibold text-s text-gray-800 uppercase tracking-widest hover:bg-gray-400 active:bg-gray-500 focus:outline-none focus:border-gray-500 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150">
                                    {{ __('إعادة تعيين') }}
                                </a>
                            </div>
                        </form>
                    </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-gray-500 uppercase tracking-wider">
                                        {{ __('رقم السند') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('الحساب البنكي') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('التاريخ') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('المبلغ') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('المستفيد') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('الحالة') }}
                                    </th>
                                    <th scope="col" class="p-6 py-3 text-right text-s font-medium text-gray-500 uppercase tracking-wider">
                                        {{ __('الإجراءات') }}
                                    </th>
                                </tr>
                            </thead>
                            <tbody class="bg-white divide-y divide-gray-200">
                                @forelse($withdrawals as $withdrawal)
                                    <tr>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
                                            {{ $withdrawal->reference_number ?: $withdrawal->id }}
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                            {{ $withdrawal->bankAccount->bank->name }} - {{ $withdrawal->bankAccount->account_name }} - {{ $withdrawal->bankAccount->account_number }}
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                            {{ $withdrawal->withdrawal_date ? $withdrawal->withdrawal_date->format('Y-m-d') : '-' }}
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                            {{ number_format($withdrawal->amount, 2) }}
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                            {{ $withdrawal->beneficiary ?: '-' }}
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap">
                                            <span class="p-2 inline-flex text-s leading-5 font-semibold rounded-full
                                                @if($withdrawal->status == 'pending') bg-yellow-100 text-yellow-800
                                                @elseif($withdrawal->status == 'approved') bg-green-100 text-green-800
                                                @elseif($withdrawal->status == 'rejected') bg-red-100 text-red-800
                                                @endif">
                                                @if($withdrawal->status == 'pending') {{ __('قيد الانتظار') }}
                                                @elseif($withdrawal->status == 'approved') {{ __('معتمد') }}
                                                @elseif($withdrawal->status == 'rejected') {{ __('مرفوض') }}
                                                @endif
                                            </span>
                                        </td>
                                        <td class="p-6 py-4 whitespace-nowrap text-sm font-medium">
                                            <div class="flex space-y-2 space-y-reverse">
                                                <a href="{{ route('banking.withdrawals.show', $withdrawal) }}" class="text-indigo-600 hover:text-indigo-900">
                                                    {{ __('عرض') }}
                                                </a>

                                                @permission('banking.withdrawals.edit')
                                                    <a href="{{ route('banking.withdrawals.edit', $withdrawal) }}" class="text-yellow-600 hover:text-yellow-900">
                                                        {{ __('تعديل') }}
                                                    </a>
                                                @endpermission

                                                @permission('banking.withdrawals.delete')
                                                    <form action="{{ route('banking.withdrawals.destroy', $withdrawal) }}" method="POST" onsubmit="return confirm('{{ __('هل أنت متأكد من رغبتك في حذف هذا السند؟') }}');">
                                                        @csrf
                                                        @method('DELETE')
                                                        <button type="submit" class="text-red-600 hover:text-red-900">
                                                            {{ __('حذف') }}
                                                        </button>
                                                    </form>
                                                @endpermission
                                            </div>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="7" class="p-6 py-4 whitespace-nowrap text-sm text-gray-500 text-center">
                                            {{ __('لا توجد سندات سحب بنكية') }}
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    <!-- الترقيم -->
                    <div class="mt-4">
                        {{ $withdrawals->links() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</x-app-layout>
