@extends('layouts.app')

@section('title', 'Loan Settlement')

@section('content')
<div class="container mx-auto px-4 py-8">
    <div class="max-w-6xl mx-auto">
        <!-- Header -->
        <div class="mb-8">
            <h1 class="text-3xl font-bold text-gray-900 mb-2">Loan Settlement</h1>
            <p class="text-gray-600">Search for loans and process full settlements</p>
        </div>

        <!-- Search Form -->
        <div class="bg-white rounded-lg shadow-md p-6 mb-8">
            <h2 class="text-xl font-semibold text-gray-800 mb-4">Search for Loan</h2>
            
            <form method="GET" action="{{ route('loan-settlement.index') }}" class="space-y-4">
                <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                    <div>
                        <label for="search_term" class="block text-sm font-medium text-gray-700 mb-1">
                            Search Term
                        </label>
                        <input type="text" 
                               id="search_term" 
                               name="search_term" 
                               value="{{ $searchTerm }}"
                               placeholder="Loan ID, Member NIC, or Member Name"
                               class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                               required>
                    </div>

                    <div>
                        <label for="loan_type" class="block text-sm font-medium text-gray-700 mb-1">
                            Loan Type (Optional)
                        </label>
                        <select id="loan_type" 
                                name="loan_type" 
                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                            <option value="">All Loan Types</option>
                            @foreach($loanTypes as $key => $label)
                                <option value="{{ $key }}" {{ $selectedLoanType == $key ? 'selected' : '' }}>
                                    {{ $label }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div>
                        <label for="branch_id" class="block text-sm font-medium text-gray-700 mb-1">
                            Branch (Optional)
                        </label>
                        <select id="branch_id" 
                                name="branch_id" 
                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                            <option value="">All Branches</option>
                            @foreach($branches as $branch)
                                <option value="{{ $branch->id }}" {{ $selectedBranch == $branch->id ? 'selected' : '' }}>
                                    {{ $branch->branch_name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="flex justify-end">
                    <button type="submit" 
                            class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-6 rounded-md transition duration-200">
                        Search Loan
                    </button>
                </div>
            </form>
        </div>

        <!-- Settlement Details -->
        @if($settlementDetails)
            <div class="bg-white rounded-lg shadow-md p-6">
                <div class="flex justify-between items-center mb-6">
                    <h2 class="text-xl font-semibold text-gray-800">Settlement Details</h2>
                    <a href="{{ route('loan-settlement.show', [$settlementDetails['loan_type'], $settlementDetails['loan_id']]) }}" 
                       class="bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-md transition duration-200">
                        View Full Details
                    </a>
                </div>

                <!-- Loan Information -->
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
                    <div>
                        <h3 class="text-lg font-medium text-gray-800 mb-3">Loan Information</h3>
                        <div class="space-y-2">
                            <div class="flex justify-between">
                                <span class="text-gray-600">Loan ID:</span>
                                <span class="font-medium">{{ $settlementDetails['loan_id'] }}</span>
                            </div>
                            <div class="flex justify-between">
                                <span class="text-gray-600">Loan Type:</span>
                                <span class="font-medium">{{ ucfirst(str_replace('_', ' ', $settlementDetails['loan_type'])) }}</span>
                            </div>
                            <div class="flex justify-between">
                                <span class="text-gray-600">Member:</span>
                                <span class="font-medium">{{ $settlementDetails['loan']->member->initials ?? 'N/A' }}</span>
                            </div>
                            <div class="flex justify-between">
                                <span class="text-gray-600">NIC:</span>
                                <span class="font-medium">{{ $settlementDetails['loan']->member->nic ?? 'N/A' }}</span>
                            </div>
                        </div>
                    </div>

                    <div>
                        <h3 class="text-lg font-medium text-gray-800 mb-3">Settlement Summary</h3>
                        <div class="space-y-2">
                            <div class="flex justify-between">
                                <span class="text-gray-600">Total Interest Due:</span>
                                <span class="font-medium text-red-600">Rs {{ number_format($settlementDetails['total_interest_due'], 2) }}</span>
                            </div>
                            <div class="flex justify-between">
                                <span class="text-gray-600">Total Capital Due:</span>
                                <span class="font-medium text-red-600">Rs {{ number_format($settlementDetails['total_capital_due'], 2) }}</span>
                            </div>
                            <div class="flex justify-between border-t pt-2">
                                <span class="text-gray-800 font-semibold">Total Due:</span>
                                <span class="text-red-800 font-bold text-lg">Rs {{ number_format($settlementDetails['total_due'], 2) }}</span>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Payment History -->
                <div class="mb-6">
                    <h3 class="text-lg font-medium text-gray-800 mb-3">Payment History</h3>
                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                        <div class="bg-gray-50 p-4 rounded-lg">
                            <div class="text-sm text-gray-600">Total Payments Made</div>
                            <div class="text-2xl font-bold text-green-600">Rs {{ number_format($settlementDetails['total_payments_made'], 2) }}</div>
                        </div>
                        <div class="bg-gray-50 p-4 rounded-lg">
                            <div class="text-sm text-gray-600">Pending Installments</div>
                            <div class="text-2xl font-bold text-orange-600">{{ $settlementDetails['installment_count'] }}</div>
                        </div>
                                                 <div class="bg-gray-50 p-4 rounded-lg">
                             <div class="text-sm text-gray-600">Last Payment Date</div>
                             <div class="text-lg font-medium text-gray-800">
                                 @if($settlementDetails['last_payment_date'] && is_object($settlementDetails['last_payment_date']))
                                     {{ $settlementDetails['last_payment_date']->format('M d, Y') }}
                                 @elseif($settlementDetails['last_payment_date'])
                                     {{ \Carbon\Carbon::parse($settlementDetails['last_payment_date'])->format('M d, Y') }}
                                 @else
                                     No payments
                                 @endif
                             </div>
                         </div>
                    </div>
                </div>

                <!-- Action Buttons -->
                <div class="flex justify-end space-x-4">
                    <a href="{{ route('loan-settlement.show', [$settlementDetails['loan_type'], $settlementDetails['loan_id']]) }}" 
                       class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-6 rounded-md transition duration-200">
                        Process Settlement
                    </a>
                    <a href="{{ route('loan-settlement.settlement-history', [$settlementDetails['loan_type'], $settlementDetails['loan_id']]) }}" 
                       class="bg-gray-600 hover:bg-gray-700 text-white font-medium py-2 px-6 rounded-md transition duration-200">
                        View History
                    </a>
                </div>
            </div>
        @endif

        <!-- Instructions -->
        @if(!$settlementDetails)
            <div class="bg-blue-50 border border-blue-200 rounded-lg p-6">
                <h3 class="text-lg font-medium text-blue-800 mb-2">How to Use Loan Settlement</h3>
                <ul class="text-blue-700 space-y-1 text-sm">
                    <li>• Enter a Loan ID, Member NIC, or Member Name to search for a loan</li>
                    <li>• Optionally select a specific loan type to narrow your search</li>
                    <li>• The system will calculate the total amount due for settlement</li>
                    <li>• You can process full settlements with optional interest discounts</li>
                    <li>• All pending installments will be marked as paid</li>
                    <li>• The loan status will be updated to "settled"</li>
                </ul>
            </div>
        @endif
    </div>
</div>
@endsection

@push('scripts')
<script>
    // Auto-submit form when loan type changes
    document.getElementById('loan_type').addEventListener('change', function() {
        if (document.getElementById('search_term').value) {
            this.form.submit();
        }
    });

    // Auto-submit form when branch changes
    document.getElementById('branch_id').addEventListener('change', function() {
        if (document.getElementById('search_term').value) {
            this.form.submit();
        }
    });
</script>
@endpush