@extends('layouts.app')

@section('title', 'Admin')

@section('content')
  <!-- Begin Page Content -->
    <div class="container-fluid">
      @include('layouts.flash-messages')
      <div class="card invoice">
            <div class="card-header p-4 p-md-5 border-bottom-0 bg-gradient-primary-to-secondary text-white-50 bg-primary">
                <div class="row justify-content-between align-items-center">
                    <div class="col-12 col-lg-auto mb-5 mb-lg-0 text-center text-lg-start">
                        <!-- Invoice branding-->
                        <img class="invoice-brand-img rounded-circle mb-4" src="assets/img/demo/demo-logo.svg" alt="">
                        <div class="h2 text-white mb-0">{{$loan->person->name}}</div>
                        {{$loan->person->address}}
                    </div>
                    <div class="col-12 col-lg-auto text-center text-lg-end">
                        <!-- Invoice details-->
                        <div class="h3 text-white">Due Details</div>
                        #29301
                        <br>
                        {{$loan->person->mobile}}
                    </div>
                </div>
            </div>
            <div class="card-body p-4 p-md-5">
                <!-- Invoice table-->
                <div class="table-responsive">
                    <table class="table table-borderless mb-0">
                        <thead class="border-bottom">
                            <tr class="small text-uppercase text-muted">
                                <th scope="col">Pay / Return Date</th>
                                <th class="text-end" scope="col">Detailst</th>
                                <th class="text-end" scope="col">Debit Amount</th>
                                <th></th>
                                <th class="text-end" scope="col">Credit Amount</th>
                            </tr>
                        </thead>
                        <tbody>
                        	@foreach($loan_details as $result)
                            <!-- Invoice item 1-->
                            <tr class="border-bottom">
                                <td>
                                    <div class="fw-bold">{{$result->loan_date}}{{$result->return_date}}</div>
                                    <div class="small text-muted d-none d-md-block"></div>
                                </td>
                                <td class="text-end fw-bold">{{$result->details}}</td>
                                <td class="text-end fw-bold">{{$result->loan_amount}}</td>
                                <td></td>
                                <td class="text-end fw-bold">{{$result->return_amount}}</td>
                                
                            </tr>
                            @endforeach
                             <!-- Divider -->
                             <br>
                            <hr class="sidebar-divider">
                            <!-- <tr>
                                <td>Total Ticket Price : </td>
                                <td></td>
                                <td>BDT </td>
                                <td>Total Paid Amount : </td>
                                <td>BDT </td>
                            </tr> -->
                            <!-- Invoice subtotal-->
                            <tr>
                                <td class="text-end pb-0" colspan="3"><div class="text-uppercase small fw-700 text-muted">Total Taken Amount: </div></td>
                                <td></td>
                                <td class="text-end pb-0"><div class="h5 mb-0 fw-700">BDT {{$take_amount}}</div></td>
                            </tr>
                            <!-- Invoice tax column-->
                            <tr>
                                <td class="text-end pb-0" colspan="3"><div class="text-uppercase small fw-700 text-muted">Total Returned Amount: </div></td>
                                <td></td>
                                <td class="text-end pb-0"><div class="h5 mb-0 fw-700">BDT {{$return_amount}}</div></td>
                            </tr>
                            <!-- Invoice total-->
                            <tr>
                                <td class="text-end pb-0" colspan="3"><div class="text-uppercase small fw-700 text-muted">Total Due Amount:</div></td>
                                <td></td>
                                <td class="text-end pb-0"><div class="h5 mb-0 fw-700">BDT {{$take_amount - $return_amount}}</div></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <!-- <div class="card-footer p-4 p-lg-5 border-top-0">
                <div class="row">
                    <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                        
                        <div class="small text-muted text-uppercase fw-700 mb-2">To</div>
                        <div class="h6 mb-1">Company Name</div>
                        <div class="small">1234 Company Dr.</div>
                        <div class="small">Yorktown, MA 39201</div>
                    </div>
                    <div class="col-md-6 col-lg-3 mb-4 mb-lg-0">
                       
                        <div class="small text-muted text-uppercase fw-700 mb-2">From</div>
                        <div class="h6 mb-0">Start Bootstrap</div>
                        <div class="small">5678 Company Rd.</div>
                        <div class="small">Yorktown, MA 39201</div>
                    </div>
                    <div class="col-lg-6">
                       
                        <div class="small text-muted text-uppercase fw-700 mb-2">Note</div>
                        <div class="small mb-0">Payment is due 15 days after receipt of this invoice. Please make checks or money orders out to Company Name, and include the invoice number in the memo. We appreciate your business, and hope to be working with you again very soon!</div>
                    </div>
                </div>
            </div> -->
        </div>
    </div>
@endsection