@extends('layouts.app')
@php
    use Carbon\Carbon;
@endphp
@push('scripts')
<script src="{{ asset('assets/vendor/sweetalerts/sweetalert2.min.js') }}"></script>
	
@endpush
@section('content')
<!-- Begin Page Content -->
<div class="container-fluid">

    <!-- Page Heading -->
    <div>
        <h1 class="h3 mb-2 text-gray-800">Applied Loans</h1>
        <a href="{{ route('loan.create') }}" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm"><i
            class="fas fa-plus fa-sm text-white-50"></i>Add New</a>
            <br>
            <hr>
    </div>
    

    <!-- My Loans DataTale -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">My Loans</h6>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-striped table-bordered" id="dataTable" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>Loan ID</th>
                            <th>Loan Type</th>
                            <th>Loan Limit</th>
                            <th>Applied Amount</th>
                            <th>Monthly Installments</th>
                            <th>Application Date</th>
                            <th>Due Date</th>
                            <th>Loan Status</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                   
                    <tbody>
                        @foreach($loans as $loan)
                        @if($loan->user_id == Auth()->user()->id)
						<tr>

                            <td>{{$loan->loan_no}}</td>
                            <td>{{ $loan->loanType->name}}</td>
                            <td>{{ number_format($loan->loanType->maximum_amount) }}</td>
                            <td>{{ number_format($loan->applied_amount) }}</td>
                            <td>{{ number_format($loan->monthly_installment, 2) }}</td>
                            <td>{{ $loan->application_date }}</td>
                            <td>{{ $loan->due_date ? \Carbon\Carbon::parse($loan->due_date)->format('Y-m-d') : 'Null' }}</td>
                            @if($loan->loan_status  =='pending')
                            <td><span class="badge bg-info">Pending</span></td>
                            @elseif(($loan->loan_status =='processing'))
                            <td><span class="badge bg-primary">Processing</span></td>
                            @elseif(($loan->loan_status =='active'))
                            <td><span class="badge bg-success">Active</span></td>
                            @elseif(($loan->loan_status =='cancelled'))
                            <td><span class="badge bg-warning">Cancelled</span></td>
                            @elseif(($loan->loan_status =='missed'))
                            <td><span class="badge bg-danger">Defilled</span></td>
                            
                            @endif
                            @if($loan->loan_status  =='pending')
                            @if($loan->guarantee_balance > 0)
						    <td>
                                <div class="dropdown dropup">
                                    <div class="cursor-pointer font-24 dropdown-toggle " data-bs-toggle="dropdown"><i class='fas fa-ellipsis-h'></i>
                                    </div>
                                    <div class="dropdown-menu dropdown-menu-end"> 
                                        <a class="dropdown-item" href="#" class="view" data-bs-toggle="modal" data-bs-target="#show{{$loan->id}}">View</a>  
                                        <a class="dropdown-item" href="#" class="guarantor" data-bs-toggle="modal" data-bs-target="#guarantor{{$loan->id}}">Add Guarantor</a>                                     
                                        <a class="dropdown-item" href="#" class="reject" data-bs-toggle="modal" data-bs-target="#editLoanModal{{$loan->id}}">Edit</a>
                                                                                
                                    </div>
                                </div>
                                                                
                            </td>
                            @elseif($loan->guarantee_balance <= 0)
                            <td>
                                <div class="dropdown">
                                    <div class="cursor-pointer font-24 dropdown-toggle " data-bs-toggle="dropdown"><i class='fas fa-ellipsis-h'></i>
                                    </div>
                                    <div class="dropdown-menu dropdown-menu-end"> 
                                        <a class="dropdown-item" href="#" class="view" data-bs-toggle="modal" data-bs-target="#show{{$loan->id}}">View</a>                                                                               
                                        <a class="dropdown-item" href="#" class="reject" data-bs-toggle="modal" data-bs-target="#editLoanModal{{$loan->id}}">Edit</a>
                                                                                
                                    </div>
                                </div>                                                                
                            </td>
                            @endif

                        </tr>
                        <!--View Modal Scrollable-->
                        <div class="modal fade" id="show{{$loan->id}}" tabindex="-1" aria-labelledby="showLabel{{$loan->id}}" aria-hidden="true">
                            <div class="modal-dialog modal-dialog-scrollable">
                            <div class="modal-content">
                                <div class="modal-header">
                                <h5 class="modal-title">View Loan</h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                       <!-- Loan Details Accordion -->
                                <div class="accordion" id="accordionExample">
                                    <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingOne">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                        Loan Details
                                        </button>
                                    </h2>
                                    <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <ul class="list-group list-group-flush">
                                                <li class="list-group-item"><strong id="loan-titles" class="loan-titles">Reference No:</strong> <span id="loan-details" class="loan-details">{{$loan->loan_no}}</span>   </li>
                                                <li class="list-group-item"><strong id="loan-titles">Loan Type:</strong> <span id="loan-details">{{$loan->loanType->name}} </span> </li>
                                                <li class="list-group-item"><strong id="loan-titles">Loan Amount:</strong> <span id="loan-details">{{number_format($loan->applied_amount)}}</span></li>
                                                <li class="list-group-item"><strong id="loan-titles">Installments:</strong> <span id="loan-details">{{number_format($loan->monthly_installment)}}</span></li>
                                                <li class="list-group-item"><strong id="loan-titles">Date Applied:</strong> <span id="loan-details">{{$loan->application_date}}</span></li>
                                                <li class="list-group-item"><strong id="loan-titles">Start Date:</strong><span id="loan-details">{{$loan->start_date ? \Carbon\Carbon::parse($loan->start_date)->format('Y-m-d') : 'Null'}}</span></li>
                                                <li class="list-group-item"><strong id="loan-titles">Due Date:</strong> <span id="loan-details">{{$loan->due_date ? \Carbon\Carbon::parse($loan->due_date)->format('Y-m-d') : 'Null'}}</span></li>
                                            </ul>
                                        </div>
                                    </div>
                                    </div>
                                    <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingTwo">
                                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#guarantorDetails" aria-expanded="false" aria-controls="guarantorDetails">
                                        Guarantors
                                        </button>
                                    </h2>
                                    <div id="guarantorDetails" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <strong>Amount Yet To Be guaranteed: Ksh {{number_format($loan->guarantee_balance)}}</strong> 
                                        <ul class="list-group list-group-flush">
                                            @foreach ($loan->guarantors as $guarantor)
                                            <li class="list-group-item">
                                            <span id="guarantor-name">{{ $guarantor->user->fname }} {{ $guarantor->user->lname }}</span>
                                            <span id="guarantor-amount">{{ number_format($guarantor->guarantee_amount) }}</span>                                            
                                            <span  id="guarantor-status">{{ $guarantor->guarantee_status }}</span>
                                            </li>
                                            @endforeach
                                            @if (empty($loan->guarantors))
                                            <li class="list-group-item">No guarantors found.</li>
                                            @endif                                                
                                        </ul>                                        
                                               
                                        </div>
                                    </div>
                                    </div>
                                    <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingThree">
                                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#approvalDetails" aria-expanded="false" aria-controls="approvalDetails">
                                        Management Approvals
                                        </button>
                                    </h2>
                                    <div id="approvalDetails" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                        <strong>This is the third item's accordion body.</strong> 
                                        </div>
                                    </div>
                                    </div>
                                </div><!-- End Loan Details Accordion -->
                                    
                                </div>
                                <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                               
                                </div>
                            </div>
                            </div>
                        </div><!-- End View Modal Dialog Scrollable-->
                            
                            <!--Add Guarantor Modal-->
                    <div class="modal fade" id="guarantor{{$loan->id}}" tabindex="-1" aria-labelledby="approveLabel{{$loan->id}}" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="approveLabel{{$loan->id}}">Add Guarantor</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                            <form action="{{ route('guarantor.store', $loan->id) }}" method="post" enctype="multipart/form-data"> 
                            @csrf
                                <div class="modal-body">
                                Add guarantors to Loan ID  {{$loan->loan_no}}. <br>  Amount to be guaranteed is Ksh. {{number_format($loan->guarantee_balance)}}
                                <br> 
                                <div class="col-md-12">
                                    <label for="user_id" class="form-label">Member<sup><i class='fas fa-asterisk' style='font-size:7px;color:red'></i></sup></label>
                                    <select class="form-control @error('user_id') is-invalid @enderror" id="user_id" name="guarantors[0][user_id]" required>
                                        <option selected disabled value="">Choose Member...</option>
                                        @foreach($users as $user )
                                        @php
                                    $shares = DB::table('shares')
                                                ->join('accounts', 'shares.account_id', '=', 'accounts.id')
                                                ->join('account_types', 'accounts.account_type_id', '=', 'account_types.id')
                                                ->where('accounts.user_id', $user->id)
                                                ->where('account_types.type', 'BOSA')
                                                ->select('shares.*')
                                                ->get();
                                
                                $pendingLoans = DB::table('loans')
                                                ->join('guarantors', 'loans.id', '=', 'guarantors.loan_id')
                                                ->where('guarantors.user_id', $user->id)
                                                ->where('loans.loan_status', 'pending')
                                                ->where('guarantors.guarantee_status', 'pending')
                                                ->select('loans.*')
                                                ->get();
                                

                                $hasApprovedRequest = DB::table('guarantors')
                                                ->where('id', $user->id)
                                                ->where('guarantee_status', 'approved')
                                                ->whereIn('loan_id', $pendingLoans->pluck('id'))
                                                ->exists();
                                    @endphp

                                    @if($shares->count() > 0 && $pendingLoans->count() >= 0 && !$hasApprovedRequest)
                                    <option value="{{ $user->id }}">{{ $user->fname }} {{ $user->lname }}</option>
                                    @endif
                                        @endforeach
                                    </select>
                                    @error('user_id')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                </div>
                                <div class="col-md-12">
                                    <label for="guarantee_amount" class="form-label">Amount Guarantee<sup><i class='fas fa-asterisk' style='font-size:7px;color:red'></i></sup></label>
                                    <input type="text" class="form-control @error('guarantee_amount') is-invalid @enderror" id="guarantee_amount" name="guarantors[0][guarantee_amount]" value="{{ old('guarantee_amount') }}"required>
                                    @error('guarantee_amount')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                </div>
                                </div>
                                <div class="modal-footer">
                                    <div class="form-btn">
                                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                                        <button type="submit" class="submit btn btn-primary">Confirm</button>
                                    </div>
                                </div>
                            </form>	
                            </div>
                            </div>
                        </div>
                        @else
                        <td>
                            <div class="dropdown">
                                <div class="cursor-pointer font-24 dropdown-toggle " data-bs-toggle="dropdown"><i class='fas fa-ellipsis-h'></i>
                                </div>
                                <div class="dropdown-menu dropdown-menu-end"> 
                                    <a class="dropdown-item" href="#" class="view" data-bs-toggle="modal" data-bs-target="#show{{$loan->id}}">View</a>  
                                                                                                                                
                                </div>
                            </div>
                                    <!--View Modal Scrollable-->
                            <div class="modal fade" id="show{{$loan->id}}" tabindex="-1" aria-labelledby="showLabel{{$loan->id}}" aria-hidden="true">
                                <div class="modal-dialog modal-dialog-scrollable">
                                <div class="modal-content">
                                    <div class="modal-header">
                                    <h5 class="modal-title">View Loan</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                        <!-- Loan Details Accordion -->
                                            <div class="accordion" id="accordionExample">
                                                <div class="accordion-item">
                                                <h2 class="accordion-header" id="headingOne">
                                                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                                    Loan Details
                                                    </button>
                                                </h2>
                                                <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                                    <div class="accordion-body">
                                                        <ul class="list-group list-group-flush">
                                                            <li class="list-group-item"><strong id="loan-titles" class="loan-titles">Reference No:</strong> <span id="loan-details" class="loan-details">{{$loan->loan_no}}</span>   </li>
                                                            <li class="list-group-item"><strong id="loan-titles">Loan Type:</strong> <span id="loan-details">{{$loan->loanType->name}} </span> </li>
                                                            <li class="list-group-item"><strong id="loan-titles">Loan Amount:</strong> <span id="loan-details">{{number_format($loan->applied_amount)}}</span></li>
                                                            <li class="list-group-item"><strong id="loan-titles">Installments:</strong> <span id="loan-details">{{number_format($loan->monthly_installment)}}</span></li>
                                                            <li class="list-group-item"><strong id="loan-titles">Date Applied:</strong> <span id="loan-details">{{$loan->application_date}}</span></li>
                                                            <li class="list-group-item"><strong id="loan-titles">Start Date:</strong><span id="loan-details">{{$loan->start_date ? \Carbon\Carbon::parse($loan->start_date)->format('Y-m-d') : 'Null'}}</span></li>
                                                            <li class="list-group-item"><strong id="loan-titles">Due Date:</strong> <span id="loan-details">{{$loan->due_date ? \Carbon\Carbon::parse($loan->due_date)->format('Y-m-d') : 'Null'}}</span></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                </div>
                                                <div class="accordion-item">
                                                <h2 class="accordion-header" id="headingTwo">
                                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#guarantorDetails" aria-expanded="false" aria-controls="guarantorDetails">
                                                    Guarantors
                                                    </button>
                                                </h2>
                                                <div id="guarantorDetails" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                                    <div class="accordion-body">
                                                        <strong>Amount Yet To Be guaranteed: Ksh {{number_format($loan->guarantee_balance)}}</strong> 
                                                    <ul class="list-group list-group-flush">
                                                        @foreach ($loan->guarantors as $guarantor)
                                                        <li class="list-group-item">
                                                        <span id="guarantor-name">{{ $guarantor->user->fname }} {{ $guarantor->user->lname }}</span>
                                                        <span id="guarantor-amount">{{ number_format($guarantor->guarantee_amount) }}</span>                                            
                                                        <span  id="guarantor-status">{{ $guarantor->guarantee_status }}</span>
                                                        </li>
                                                        @endforeach
                                                        @if (empty($loan->guarantors))
                                                        <li class="list-group-item">No guarantors found.</li>
                                                        @endif                                                
                                                    </ul>                                        
                                                        
                                                    </div>
                                                </div>
                                                </div>
                                                <div class="accordion-item">
                                                <h2 class="accordion-header" id="headingThree">
                                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#approvalDetails" aria-expanded="false" aria-controls="approvalDetails">
                                                    Approvals
                                                    </button>
                                                </h2>
                                                <div id="approvalDetails" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                                    <div class="accordion-body">
                                                    <strong>This is the third item's accordion body.</strong> 
                                                    </div>
                                                </div>
                                            </div>
                                        </div><!-- End Loan Details Accordion -->                            
                                    </div>
                                </div>
                                </div>
                            </div>
                                
                                        </td>
                                        @endif
                        
                                        @endif
                        @endforeach
                       
                        
                    </tbody>
                </table>
            </div>
        </div>
    </div>


@endsection
@pushOnce('scripts')
<script src="{{ asset('assets/js/calculation.js') }}"></script>
@if (session('success'))
    <script>
        Swal.fire('Loan Created', '{{ session('success') }}', 'success');
    </script>
@endif
@if ($errors->any())
<script>
     
        // Open the addGuarantorsModal if there are validation errors
        $(document).ready(function() {
            Swal.fire({
                icon: 'error',
                title: 'Validation Error',
                html: '{!! implode('', $errors->all('<p>:message</p>')) !!}',
                allowOutsideClick: false,
                allowEscapeKey: false
            }).then(function() {
                $('#guarantor').modal('show');
            });
        });
  
</script>
@endif


@endpushOnce