@extends('layouts.vertical')

@section('css')
<link href="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/datatables/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/sweetalert/sweetalert.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('breadcrumb')
<div class="row page-title align-items-center">
    <div class="col-auto">
        <h4 class="mb-1 mt-0 font-weight-medium">Active subscriptions</h4>
        <p class="mb-3 font-size-14">The system generates invoices between 12 AM and 7 AM (UK, Ireland & Lisbon time zone). If you wish to resume any subscription, please do so one day in advance and before 12:00 AM.</p>
        <ul class="mb-3 font-size-14">
            <li>For example, if a child's next invoice date is 19/11/2023 and their subscription is in a paused state, it is recommended to resume the child's subscription on the 18th, anytime between 7 AM and 11:59 PM (UK, Ireland & Lisbon time zone), to allow the system to generate the scheduled invoice for 19/11/2023.</li>
        </ul>
        <p class="mb-3 font-size-14">When you click the 'Pause billing' button for children, it means that invoices will no longer be generated for those selected children starting from that specific date and time.</p>
        <p class="mb-3 font-size-14">For children with paused billing, you have the option to resume invoicing for specific children by clicking the 'Resume billing' button. Once you do this, starting from the date and time of resumption, the system will continue to generate upcoming invoices after that date.</p>
        <p class="mb-3 font-size-14">Let's consider an example: Imagine a child is on recurring billing (Postpaid), and their weekly invoices are generated for the following periods:</p>
        <ul class="mb-3 font-size-14">
            <li>1st to 7th (1st invoice)<br/>
                8th to 14th (2nd invoice)<br/>
                15th to 21st (3rd invoice)<br/>
                22nd to 28th (4th invoice)<br/>
                29th to 35th (5th invoice)
            </li>
        </ul>
        <p class="mb-3 font-size-14">If you pause this child's subscription on the 12th date, the system will not generate upcoming invoices after that date (i.e., 2nd, 3rd, 4th, etc.). If you resume the child's subscription on the 22nd date, the system will continue to generate upcoming invoices after that date. Therefore, invoices 4th and 5th, 6th, etc., will continue to be generated on their scheduled dates.</p>
        <p class="mb-3 font-size-14">Please be aware that if any subscription reaches its expiration date while it's in a paused state, the system will terminate that subscription. Additionally, note that the Pause/Resume billing feature is applicable only to recurring billing. If you have manually scheduled invoices for any child, the system will continue to generate and send them to parents on their designated dates and times.</p>
    </div>
</div>
@endsection

@section('content')
@if (isset($result) && !empty($result))
    @foreach ($result as $key => $room)
        <div class="row room" data-id="{{$room->room->_id}}" data-index="{{$key}}">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">
                        <div class="row align-items-center mb-3">
                            <div class="col-md">
                                <h5 class="mb-0">{{$room->room->name}}</h5>
                            </div>
                            <div class="col-md-auto mt-md-0 mt-3">
                                <a href="javascript:;" class="text-success text-underline font-weight-semibold btn-resume" data-status="1">Resume billing for multiple children</a> &nbsp;&nbsp;
                                <a href="javascript:;" class="text-danger text-underline font-weight-semibold btn-pause" data-status="0">Pause billing for multiple children</a>
                            </div>
                        </div>
                        {{-- <div class=""><h5>{{$room->room->name}}</h5></div> --}}
                        <table class="child-datatable table table-striped dt-responsive" data-index="{{$key}}">
                            <thead>
                                <tr>
                                    <th><input type="checkbox" name="select_all" value="1" class="select-all"></th>
                                    <th>Children name</th>
                                    <th>Billing type</th>
                                    <th>Billing start date</th>
                                    <th>Billing end date</th>
                                    <th>Next invoice date</th>
                                    <th>Billing Status</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @if(isset($room->children))
                                    @foreach ($room->children as $child)
                                        @php
                                            $status = isset($child->pauseInvoice) && $child->pauseInvoice == true ? 1 : 0;
                                            $billingtype = "-";
                                            if($child->type == "b7") {
                                                $billingtype = 'Subscription package';
                                            } else if($child->type == "b8") {
                                                $billingtype = isset($child->useSession) && $child->useSession == true ? 'Session rates' : 'Attendance hours';
                                            } else if($child->type == "b9") {
                                                $billingtype = 'Daily';
                                            }
                                        @endphp
                                        <tr>
                                            <td>
                                                <input type="checkbox" class="input-child" name="children[]" value="{{ $child->child->_id }}">
                                            </td>
                                            <td>
                                                <div class="media">
                                                    <img src="{{ $child->child->profileImage }}" class="img-meal small mr-2" alt="child" />
                                                    <div class="media-body">{{ $child->child->name }}</div>
                                                </div>
                                            </td>
                                            <td>
                                                {{ $billingtype }}
                                            </td>
                                            <td>{{ \Carbon\Carbon::parse($child->billStartDate)->format('d/m/Y') }}</td>
                                            <td>{{ \Carbon\Carbon::parse($child->billEndDate)->format('d/m/Y') }}</td>
                                            <td>{{ \Carbon\Carbon::parse($child->nextInvoice)->format('d/m/Y') }}</td>
                                            <td>{{ $status ? "Paused" : "Active" }}</td>
                                            <td>
                                                <a href="javascript:;" class="btn {{ $status ? "btn-success" : "btn-danger" }} btn-sm btn-change-billing" data-status="{{$status}}" data-id="{{$child->child->_id}}">{{ $status ? "Resume billing" : "Pause billing" }}</a>
                                            </td>
                                        </tr>
                                    @endforeach
                                @endif
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    @endforeach
@else
    <div class="py-5 text-center">
        <h6>No active subscriptions found.</h6>
    </div>
@endif
@endsection

@section('script-bottom')
<script type="text/javascript">
    var changeBillingStatusUrl = "{{ route('billing.subscriptions.change-status') }}";
</script>
<script defer src="{{ Helper::assets('assets/libs/moment/moment.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/jquery.dataTables.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.responsive.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/validation/validate.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/sweetalert/sweetalert.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/js/pages/billing-active-subscriptions.js') }}?{{time()}}" type="text/javascript"></script>
@endsection