@extends('web.layouts.layout')

@section('container_content')
<section class="box">
    <div class="container-fluid">

        @if (session('error'))
            <div class="alert alert-danger col-md-12">
                {{ session('error') }}
            </div>
        @endif

        <div class="steps step_1 row justify-content-center">
            <div class="col-lg-11">
                <div class="decrease">
                    <h4>{{ __('loops.withdraw_confirmation') }} </h4>

                    <div class="info">
                        {!! $notes['description']['description'] !!}
                    </div>

                    <ul>
                        <li>
                            <a href="javascript:;" class="butn wow zoomIn goToStep" data-step=".step_2">agree</a>
                        </li>

                        <li>
                            <p>paid period</p>
                            <span>{{ count($paidMonth) }} <strong class="main-back">months</strong></span>
                        </li>

                        <li>
                            <p>full period</p>
                            <span>{{ $loopDetails['period'] }} <strong class="main-back">months</strong></span>
                        </li>

                        <li>
                            <p>{{ $cashed ? __('loops.left_share') : __('loops.next_share') }}</p>
                            <span>{{ $cashed ? $remainingAmount : $loopDetails['share'] }} <strong class="main-back">SAR</strong></span>
                        </li>

                        <li>
                            <p>your turn was in</p>
                            <span class="w-100">{{ date('F', strtotime($loopDetails['encashment_month'])) }}</span>
                        </li>
                    </ul>

                </div>
            </div>
        </div>

        <div class="steps step_2 hide row justify-content-center">
            <div class="col-lg-11">
                <div class="month-pay">
                    <h2>{{ date('F', strtotime($loopDetails['loop_date'])) }}'s Loop </h2>
                    <h5>{{ __('loops.complete_withdraw') }}</h5>

                    <div class="content">
                        <div class="row">
                            <div class="col-lg-7">
                                <div class="items">
                                    <p> {{ __('loops.remaining') }} <span>{{ $remainingAmount }} SAR</span></p>
                                </div>
                                <div class="items">
                                    <h6>{{ __('loops.total') }} <span> {{ $total }} SAR</span></h6>
                                </div>
                            </div>
                            <div class="col-lg-5">
                                <div class="info">
                                    <p> {{ __('loops.withdraw_fees') }} <span class="sub-color">{{ $withdrawFees }} SAR</span></p>

                                    @if($delayFees)
                                    <p> {{ __('loops.delay_fees') }} <span class="sub-color">{{ $delayFees }} SAR</span></p>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>

                    <a href="{{ $route }}" class="butn wow zoomIn mt-20">{{ __('loops.pay') }}</a>

                </div>
            </div>
        </div>

    </div>
</section>
@endsection

@section('container_js')
<script src="{{ asset('assets/web/js/loop.js') }}"></script>
@endsection