{{-- @extends('layouts.app')

@section('content')
<div class="container my-5">
    <div class="card shadow-lg border-light">
        <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
            <h4 class="mb-0"><i class="fas fa-file-invoice-dollar me-2"></i>Loan Application #{{ $loanOffer->application_number }}</h4>
            <a href="{{ route('loan-offers.index') }}" class="btn btn-light btn-sm">
                <i class="fas fa-arrow-left"></i> Back to List
            </a>
        </div>

        <div class="card-body p-4">

         
            <div class="row mb-4">
                <div class="col-md-6 mb-2">
                    <div class="card h-100">
                        <div class="card-body">
                             <h6 class="card-title text-muted">Approval Status</h6>
                             @if ($loanOffer->approval == 'APPROVED')
                                <h4 class="mb-0 text-success"><i class="fas fa-check-circle me-2"></i>APPROVED</h4>
                             @elseif ($loanOffer->approval == 'REJECTED')
                                <h4 class="mb-0 text-danger"><i class="fas fa-times-circle me-2"></i>REJECTED</h4>
                             @else
                                <h4 class="mb-0 text-warning"><i class="fas fa-hourglass-half me-2"></i>PENDING</h4>
                             @endif
                        </div>
                    </div>
                </div>
                <div class="col-md-6 mb-2">
                    <div class="card h-100">
                         <div class="card-body">
                            <h6 class="card-title text-muted">Operational Status</h6>
                            @if ($loanOffer->status == 'disbursed')
                                 <h4 class="mb-0 text-success"><i class="fas fa-check-double me-2"></i>DISBURSED</h4>
                            @elseif ($loanOffer->status == 'disbursement_pending')
                                 <h4 class="mb-0 text-info"><i class="fas fa-spinner fa-spin me-2"></i>PENDING BANK CONFIRMATION</h4>
                            @elseif ($loanOffer->status == 'DISBURSEMENT_FAILED')
                                 <h4 class="mb-0 text-danger"><i class="fas fa-exclamation-triangle me-2"></i>DISBURSEMENT FAILED</h4>
                            @elseif ($loanOffer->status == 'FULL_SETTLED')
                                 <h4 class="mb-0 text-dark"><i class="fas fa-handshake me-2"></i>FULL SETTLED</h4>
                            @else
                                 <h4 class="mb-0 text-secondary"><i class="fas fa-question-circle me-2"></i>{{ strtoupper(str_replace('_', ' ', $loanOffer->status)) }}</h4>
                            @endif
                             @if ($loanOffer->nmb_batch_id)
                <button type="button" class="btn btn-outline-info btn-sm mt-3" id="view-callbacks-btn" data-url="{{ route('loan-offers.callbacks.ajax', $loanOffer->id) }}">
                    <i class="fas fa-history me-1"></i> View Callback History
                </button>
            @endif
                         </div>
                    </div>
                </div>
            </div>

          
            @if ($loanOffer->approval === 'APPROVED' && !in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED', 'DISBURSEMENT_FAILED']))
                <div class="card border-success my-4 shadow">
                    <div class="card-header bg-success-soft text-success">
                        <strong><i class="fas fa-university me-2"></i>Ready for Disbursement</strong>
                    </div>
                    <div class="card-body text-center">
                        <p class="card-text fs-5">This loan is approved and ready to be sent to the customer.</p>
                        <p class="text-muted">Total Amount: <strong>TZS {{ number_format($loanOffer->total_amount_to_pay, 2) }}</strong></p>
                        <button id="disburse-btn" class="btn btn-success btn-lg px-5">
                            <i class="fas fa-paper-plane me-2"></i> Disburse Loan via NMB
                        </button>
                    </div>
                </div>
            @endif

           
            <div class="card border-light">
                <div class="card-header bg-light">
                    <strong><i class="fas fa-edit me-2"></i>Manage Loan Details</strong>
                </div>
                <div class="card-body">
                     <form id="loan-update-form">
                        @csrf
                        @method('PUT')
                        <fieldset @if(in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED'])) disabled @endif>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="total_amount_to_pay" class="form-label">Total Amount to Pay</label>
                                    <input type="number" step="0.01" class="form-control" id="total_amount_to_pay" name="total_amount_to_pay" value="{{ $loanOffer->total_amount_to_pay }}">
                                </div>
                                <div class="col-md-6">
                                    <label for="other_charges" class="form-label">Other Charges</label>
                                    <input type="number" step="0.01" class="form-control" id="other_charges" name="other_charges" value="{{ $loanOffer->other_charges }}">
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="approval" class="form-label">Approval Status</label>
                                    <select class="form-select" id="approval" name="approval">
                                        <option value="APPROVED" {{ $loanOffer->approval === 'APPROVED' ? 'selected' : '' }}>APPROVED</option>
                                        <option value="REJECTED" {{ $loanOffer->approval === 'REJECTED' ? 'selected' : '' }}>REJECTED</option>
                                    </select>
                                </div>
                                <div class="col-md-6">
                                     <label for="status" class="form-label">Manual Status Override</label>
                                    <select class="form-select" id="status" name="status">
                                        <option value="">-- No Change --</option>
                                        <option value="DISBURSEMENT_FAILED">Disbursement Failed</option>
                                        <option value="FULL_SETTLED">Full Settled</option>
                                    </select>
                                    <small class="form-text text-muted">For manual correction only.</small>
                                </div>
                            </div>
                            <div class="mb-3">
                                <label for="reason" class="form-label">Reason / Remarks</label>
                                <textarea class="form-control" id="reason" name="reason" rows="2">{{ $loanOffer->reason }}</textarea>
                            </div>
                             @if(!in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED']))
                                <button type="button" id="save-btn" class="btn btn-primary">
                                    <i class="fas fa-save me-2"></i> Save Changes
                                </button>
                             @endif
                        </fieldset>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>


@push('modals')
<div class="modal fade" id="callbackHistoryModal" tabindex="-1" aria-labelledby="callbackHistoryModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="callbackHistoryModalLabel">NMB Callback History for Loan #{{ $loanOffer->application_number }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="callbackHistoryBody">
                
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endpush
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    toastr.options = { "closeButton": true, "progressBar": true, "positionClass": "toast-top-right" };
    @if (session('status'))
        toastr.info("{{ session('status') }}");
    @endif
    @if (session('error'))
        toastr.error("{{ session('error') }}");
    @endif

    $('#save-btn').on('click', function(e) {
        const button = $(this);
        const originalHtml = button.html();
        Swal.fire({
            title: 'Confirm Changes', text: "Save updates to this loan?", icon: 'question',
            showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#6c757d', confirmButtonText: 'Yes, save it!'
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: "{{ route('loan-offers.update', $loanOffer->id) }}", type: 'POST', data: $('#loan-update-form').serialize(),
                    beforeSend: () => button.html('<span class="spinner-border spinner-border-sm"></span> Saving...').prop('disabled', true),
                    success: (response) => {
                        toastr.success(response.message || 'Loan updated successfully!');
                        setTimeout(() => location.reload(), 1500);
                    },
                    error: (xhr) => toastr.error('An error occurred. See console for details.'),
                    complete: () => button.html(originalHtml).prop('disabled', false),
                });
            }
        });
    });

    $('#disburse-btn').on('click', function(e) {
        const button = $(this);
        Swal.fire({
            title: '<span class="text-danger">FINAL CONFIRMATION</span>',
            html: `You are about to disburse <strong>TZS {{ number_format($loanOffer->total_amount_to_pay, 2) }}</strong>.<br>This action cannot be undone.<br><br>Please type <strong>DISBURSE</strong> to confirm.`,
            icon: 'warning', input: 'text', inputPlaceholder: 'DISBURSE',
            showCancelButton: true, confirmButtonText: 'Confirm & Disburse', confirmButtonColor: '#dc3545',
            showLoaderOnConfirm: true,
            preConfirm: (inputValue) => { if (inputValue !== 'DISBURSE') Swal.showValidationMessage('Incorrect confirmation text.') },
            allowOutsideClick: () => !Swal.isLoading()
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: "{{ route('loan-offers.update', $loanOffer->id) }}", type: 'POST',
                    data: { '_token': "{{ csrf_token() }}", '_method': 'PUT', 'status': 'SUBMITTED_FOR_DISBURSEMENT' },
                    success: (response) => {
                        Swal.fire({ title: 'Submitted!', text: response.message, icon: 'success' })
                            .then(() => location.reload());
                    },
                    error: (xhr) => Swal.fire({ title: 'Submission Failed!', text: 'An error occurred.', icon: 'error' }),
                });
            }
        });
    });
});




$('#view-callbacks-btn').on('click', function() {
    // Get the URL from the button's data attribute
    const url = $(this).data('url');
    const modal = new bootstrap.Modal(document.getElementById('callbackHistoryModal'));
    const modalBody = $('#callbackHistoryBody');

    // 1. Show a loading spinner in the modal body
    modalBody.html('<div class="text-center p-5"><div class="spinner-border text-primary" role="status"><span class="visually-hidden">Loading...</span></div></div>');
    
    // 2. Show the modal
    modal.show();

    // 3. Make the AJAX call to fetch the history
    $.ajax({
        url: url,
        type: 'GET',
        success: function(response) {
            // 4. On success, replace the spinner with the returned HTML
            modalBody.html(response);
        },
        error: function(xhr) {
            // 5. On error, show an error message
            modalBody.html('<div class="alert alert-danger">Could not load callback history. Please try again.</div>');
            console.error(xhr.responseText);
        }
    });
});
</script>
@endpush --}}


@extends('layouts.app')

@section('content')
<div class="container my-5">
    <div class="card shadow-lg border-light">
        <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
            <h4 class="mb-0"><i class="fas fa-file-invoice-dollar me-2"></i>Loan Application #{{ $loanOffer->application_number }}</h4>
            <a href="{{ route('loan-offers.index') }}" class="btn btn-light btn-sm">
                <i class="fas fa-arrow-left"></i> Back to List
            </a>
        </div>

        <div class="card-body p-4">

            {{-- LOAN STATUS DASHBOARD --}}
            <div class="row mb-4">
                <div class="col-md-6 mb-2">
                    <div class="card h-100">
                        <div class="card-body">
                             <h6 class="card-title text-muted">Approval Status</h6>
                             @if ($loanOffer->approval == 'APPROVED')
                                <h4 class="mb-0 text-success"><i class="fas fa-check-circle me-2"></i>APPROVED</h4>
                             @elseif ($loanOffer->approval == 'REJECTED')
                                <h4 class="mb-0 text-danger"><i class="fas fa-times-circle me-2"></i>REJECTED</h4>
                             @else
                                <h4 class="mb-0 text-warning"><i class="fas fa-hourglass-half me-2"></i>PENDING</h4>
                             @endif
                        </div>
                    </div>
                </div>
                <div class="col-md-6 mb-2">
                    <div class="card h-100">
                         <div class="card-body">
                            <h6 class="card-title text-muted">Operational Status</h6>
                            @if ($loanOffer->status == 'disbursed')
                                 <h4 class="mb-0 text-success"><i class="fas fa-check-double me-2"></i>DISBURSED</h4>
                            @elseif ($loanOffer->status == 'disbursement_pending')
                                 <h4 class="mb-0 text-info"><i class="fas fa-spinner fa-spin me-2"></i>PENDING BANK CONFIRMATION</h4>
                            @elseif ($loanOffer->status == 'DISBURSEMENT_FAILED')
                                 <h4 class="mb-0 text-danger"><i class="fas fa-exclamation-triangle me-2"></i>DISBURSEMENT FAILED</h4>
                            @elseif ($loanOffer->status == 'FULL_SETTLED')
                                 <h4 class="mb-0 text-dark"><i class="fas fa-handshake me-2"></i>FULL SETTLED</h4>
                            @else
                                 <h4 class="mb-0 text-secondary"><i class="fas fa-question-circle me-2"></i>{{ strtoupper(str_replace('_', ' ', $loanOffer->status)) }}</h4>
                            @endif
                            @if ($loanOffer->nmb_batch_id)
                                <button type="button" class="btn btn-outline-info btn-sm mt-3" id="view-callbacks-btn" data-url="{{ route('loan-offers.callbacks.ajax', $loanOffer->id) }}">
                                    <i class="fas fa-history me-1"></i> View Callback History
                                </button>
                            @endif
                         </div>
                    </div>
                </div>
            </div>

            {{-- CRITICAL ACTIONS PANEL --}}
            @if ($loanOffer->approval === 'APPROVED' && !in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED', 'DISBURSEMENT_FAILED']))
                <div class="card border-success my-4 shadow">
                    <div class="card-header bg-success-soft text-success">
                        <strong><i class="fas fa-university me-2"></i>Ready for Disbursement</strong>
                    </div>
                    <div class="card-body text-center">
                        <p class="card-text fs-5">This loan is approved and ready to be sent to the customer.</p>
                        <p class="text-muted">Total Amount: <strong>TZS {{ number_format($loanOffer->total_amount_to_pay, 2) }}</strong></p>
                        <button id="disburse-btn" class="btn btn-success btn-lg px-5">
                            <i class="fas fa-paper-plane me-2"></i> Disburse Loan via NMB
                        </button>
                    </div>
                </div>
            @endif

            {{-- MAIN LOAN DETAILS FORM --}}
            <div class="card border-light">
                <div class="card-header bg-light">
                    <strong><i class="fas fa-edit me-2"></i>Manage Loan Details</strong>
                </div>
                <div class="card-body">
                     <form id="loan-update-form">
                        @csrf
                        @method('PUT')
                        <fieldset @if(in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED'])) disabled @endif>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="total_amount_to_pay" class="form-label">Total Amount to Pay</label>
                                    <input type="number" step="0.01" class="form-control" id="total_amount_to_pay" name="total_amount_to_pay" value="{{ $loanOffer->total_amount_to_pay }}">
                                </div>
                                <div class="col-md-6">
                                    <label for="other_charges" class="form-label">Other Charges</label>
                                    <input type="number" step="0.01" class="form-control" id="other_charges" name="other_charges" value="{{ $loanOffer->other_charges }}">
                                </div>
                            </div>

                            <hr>
                            <h5 class="mb-3">Beneficiary Account Details</h5>

                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="bank_account_number" class="form-label">Account / Wallet Number</label>
                                    <input type="text" class="form-control" id="bank_account_number" name="bank_account_number" value="{{ old('bank_account_number', $loanOffer->bank_account_number) }}" required>
                                </div>
                                <div class="col-md-6">
                                    <label for="payment_destination_id" class="form-label">Payment Destination (Bank or MNO)</label>
                                    <select class="form-select" id="payment_destination_id" name="payment_destination_id" required>
                                        <option value="">-- Please Select --</option>
                                        @if(isset($destinations['BANK']))
                                            <optgroup label="Banks">
                                                @foreach($destinations['BANK'] as $destination)
                                                    <option value="{{ $destination->id }}" {{ old('payment_destination_id', $loanOffer->payment_destination_id) == $destination->id ? 'selected' : '' }}>
                                                        {{ $destination->name }}
                                                    </option>
                                                @endforeach
                                            </optgroup>
                                        @endif
                                        @if(isset($destinations['MNO']))
                                            <optgroup label="Mobile Money">
                                                 @foreach($destinations['MNO'] as $destination)
                                                    <option value="{{ $destination->id }}" {{ old('payment_destination_id', $loanOffer->payment_destination_id) == $destination->id ? 'selected' : '' }}>
                                                        {{ $destination->name }}
                                                    </option>
                                                @endforeach
                                            </optgroup>
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <hr>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="approval" class="form-label">Approval Status</label>
                                    <select class="form-select" id="approval" name="approval">
                                        <option value="APPROVED" {{ $loanOffer->approval === 'APPROVED' ? 'selected' : '' }}>APPROVED</option>
                                        <option value="REJECTED" {{ $loanOffer->approval === 'REJECTED' ? 'selected' : '' }}>REJECTED</option>
                                    </select>
                                </div>
                                <div class="col-md-6">
                                     <label for="status" class="form-label">Manual Status Override</label>
                                    <select class="form-select" id="status" name="status">
                                        <option value="">-- No Change --</option>
                                        <option value="DISBURSEMENT_FAILED">Disbursement Failed</option>
                                        <option value="FULL_SETTLED">Full Settled</option>
                                    </select>
                                    <small class="form-text text-muted">For manual correction only.</small>
                                </div>
                            </div>
                            <div class="mb-3">
                                <label for="reason" class="form-label">Reason / Remarks</label>
                                <textarea class="form-control" id="reason" name="reason" rows="2">{{ $loanOffer->reason }}</textarea>
                            </div>
                             @if(!in_array($loanOffer->status, ['disbursement_pending', 'disbursed', 'FULL_SETTLED']))
                                <button type="button" id="save-btn" class="btn btn-primary">
                                    <i class="fas fa-save me-2"></i> Save Changes
                                </button>
                             @endif
                        </fieldset>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>


@push('modals')
<div class="modal fade" id="callbackHistoryModal" tabindex="-1" aria-labelledby="callbackHistoryModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="callbackHistoryModalLabel">NMB Callback History for Loan #{{ $loanOffer->application_number }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="callbackHistoryBody">
                {{-- AJAX content will be loaded here --}}
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endpush
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    toastr.options = { "closeButton": true, "progressBar": true, "positionClass": "toast-top-right" };
    @if (session('status'))
        toastr.info("{{ session('status') }}");
    @endif
    @if (session('error'))
        toastr.error("{{ session('error') }}");
    @endif

    $('#save-btn').on('click', function(e) {
        const button = $(this);
        const originalHtml = button.html();
        Swal.fire({
            title: 'Confirm Changes', text: "Save updates to this loan?", icon: 'question',
            showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#6c757d', confirmButtonText: 'Yes, save it!'
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: "{{ route('loan-offers.update', $loanOffer->id) }}", type: 'POST', data: $('#loan-update-form').serialize(),
                    beforeSend: () => button.html('<span class="spinner-border spinner-border-sm"></span> Saving...').prop('disabled', true),
                    success: (response) => {
                        toastr.success(response.message || 'Loan updated successfully!');
                        setTimeout(() => location.reload(), 1500);
                    },
                    error: (xhr) => toastr.error('An error occurred. See console for details.'),
                    complete: () => button.html(originalHtml).prop('disabled', false),
                });
            }
        });
    });

    $('#disburse-btn').on('click', function(e) {
        const button = $(this);
        Swal.fire({
            title: '<span class="text-danger">FINAL CONFIRMATION</span>',
            html: `You are about to disburse <strong>TZS {{ number_format($loanOffer->total_amount_to_pay, 2) }}</strong>.<br>This action cannot be undone.<br><br>Please type <strong>DISBURSE</strong> to confirm.`,
            icon: 'warning', input: 'text', inputPlaceholder: 'DISBURSE',
            showCancelButton: true, confirmButtonText: 'Confirm & Disburse', confirmButtonColor: '#dc3545',
            showLoaderOnConfirm: true,
            preConfirm: (inputValue) => { if (inputValue !== 'DISBURSE') Swal.showValidationMessage('Incorrect confirmation text.') },
            allowOutsideClick: () => !Swal.isLoading()
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: "{{ route('loan-offers.update', $loanOffer->id) }}", type: 'POST',
                    data: { '_token': "{{ csrf_token() }}", '_method': 'PUT', 'status': 'SUBMITTED_FOR_DISBURSEMENT' },
                    success: (response) => {
                        Swal.fire({ title: 'Submitted!', text: response.message, icon: 'success' })
                            .then(() => location.reload());
                    },
                    error: (xhr) => Swal.fire({ title: 'Submission Failed!', text: 'An error occurred.', icon: 'error' }),
                });
            }
        });
    });

    $('#view-callbacks-btn').on('click', function() {
        // Get the URL from the button's data attribute
        const url = $(this).data('url');
        const modal = new bootstrap.Modal(document.getElementById('callbackHistoryModal'));
        const modalBody = $('#callbackHistoryBody');

        // 1. Show a loading spinner in the modal body
        modalBody.html('<div class="text-center p-5"><div class="spinner-border text-primary" role="status"><span class="visually-hidden">Loading...</span></div></div>');
        
        // 2. Show the modal
        modal.show();

        // 3. Make the AJAX call to fetch the history
        $.ajax({
            url: url,
            type: 'GET',
            success: function(response) {
                // 4. On success, replace the spinner with the returned HTML
                modalBody.html(response);
            },
            error: function(xhr) {
                // 5. On error, show an error message
                modalBody.html('<div class="alert alert-danger">Could not load callback history. Please try again.</div>');
                console.error(xhr.responseText);
            }
        });
    });
});
</script>
@endpush