@extends('admin.layouts.container')

@section('content')
<div class="side-title">
    <h3>{{ $head ?? '' }}</h3>
</div>

<!-- ------------ month-loop  ------------- -->
<section class="box valign">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-5 valign">
                <div class="content w-100">
                    <h3 class="title wow fadeInUp">{{ date('F', strtotime($loopDetails['loop_date'])) }}'s Loop</h3>
                    <div class="month-loop">
                        <div class="content row">
                            <div class="col-6">
                                <div class="items">
                                    <ul>
                                        <li>
                                            <p>start month</p>
                                            <span>{{ date('M Y', strtotime($loopDetails['loop_date'])) }}</span>
                                        </li>
                                        <li>
                                            <p>loop's period</p>
                                            <span>{{ $loopDetails['period'] }} months</span>
                                        </li>
                                        <li>
                                            <p>collecting month</p>
                                            <span>{{ date('M Y', strtotime($loopDetails['encashment_month'])) }}</span>
                                        </li>
                                        <li>
                                            <p>monthly share</p>
                                            <span>{{ $loopDetails['share'] }} SAR</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="items">
                                    <p>loop value</p>
                                    <h5>{{ $totalShare  }} SAR</h5>

                                    <small>management fees</small>
                                    <span>{{ $fees['managment_fees'] }} SAR</span>

                                    <small>VAT</small>
                                    <span>{{ $fees['vat_fees'] }} SAR</span>

                                    <small>Govemmental fees</small>
                                    <span>{{ $fees['government_fees'] }} SAR</span>

                                    <p>tolat collection amounts</p>
                                    <h5> {{ $totalShare + $totalFees }} SAR</h5>
                                </div>
                            </div>
                        </div>
                        <!-- <div class="btns">
                            <button type="button" data-toggle="modal" data-target="#exampleModalCenter" class="butn wow zoomIn">Pay Now</button>
                            <button type="button" data-toggle="modal" data-target="#exampleModalCenter2" class="butn wow zoomIn color">with darwl</button>
                        </div> -->
                    </div>
                </div>
            </div>
            <div class="col-lg-6 offset-lg-1 valign">
                <div class="right">
                    <div class="month-circle">
                        <ul>
                            @foreach($months as $month)
                            <li class="{{ $month['class'] }}">
                                <span>{{ $month['month'] }}</span>
                                <a href="#0" disabled>
                                    <img src="{{asset('assets/web/images/icons/'.$month['image'])}}" alt="">
                                </a>
                            </li>
                            @endforeach

                        </ul>
                    </div>
                    <!-- <div class="month-share text-center mt-5">
                        <a href="#"><i class="fas fa-minus"></i></a>
                        <span>monthly share <br> 3000 SAR</span>
                        <a href="#"><i class="fas fa-plus"></i></a>
                    </div> -->
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@section('inner_js')
<script>
    var route_prefix = "{{ url(config('lfm.prefix')) }}";
    var url = "{{url('/')}}/";
</script>

@endsection