@extends('main')
@section('css')

@endsection
@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
        </h1>
        <ol class="breadcrumb">

        </ol>
    </section>


        <div class="card">
            <div class="card-header">
                <form class="find_by_date_service_group float-right row" style="width:60%"  enctype="multipart/form-data">
                    <!-- Date range -->
                    <div class="col-md-5">
                        <select type="text" class="form-control select2 float-right" name="serviceGroupId">
                            <option value="all">Select Policy</option>
                            @foreach(App\Models\ServiceGroup::get() as $item)
                                <option value="{{$item->id}}" @isset($vars['selected']){{ $vars['selected']->id== $item->id ? 'selected' : ''}}@endisset>{{$item->name}}</option>
                            @endforeach

                        </select>
                    </div>
                    <!-- /.input group -->
                    <div class="col-md-5">
                        <input type="hidden" id="date_range_selected" class="form-control float-right" name="date" id="reservation" placeholder="Date range:">

                        <div class="input-group">
                            <button type="button" class="btn btn-default float-right" style="width:100%" id="daterange-btn">
                                <i class="far fa-calendar-alt"></i> Select Date Range
                                <i class="fas fa-caret-down"></i>
                            </button>
                        </div>
                        {{--                                    <div class="input-group">--}}
                        {{--                                        <div class="input-group-prepend">--}}
                        {{--                                      <span class="input-group-text">--}}
                        {{--                                        <i class="far fa-calendar-alt"></i>--}}
                        {{--                                      </span>--}}
                        {{--                                        </div>--}}
                        {{--                                        <input type="hidden" class="form-control float-right" name="date" id="reservation" placeholder="Date range:">--}}
                        {{--                                    </div>--}}

                        <!-- /.input group -->
                    </div>
                    <div class="col-md-2">
                        <button class="btn btn-success" type="submit" data-toggle="tooltip" title="View Data" data-original-title="View"><i class="fa fa-search text-white"></i></button>
                    </div>
                </form>
            </div>
            <div class="card-body">
                    <div class="card-body ">
                        <table class="table table-striped normal-table" id="create_group_form_table">
                            <thead>
                            <tr>
                                <th>S/N</th>
                                <th>Policy Number</th>
                                <th>Created</th>
                                <th>Class</th>
                                <th>Policy Holder</th>
                                <th>Validity</th>
                                <th>Status</th>
                                <th class="noExport" style="width: 10%">Action</th>
                            </tr>
                            </thead>
                            <tbody>
                            @if(!empty($vars['contracts']))
                                @foreach($vars['contracts'] as $index =>  $row)

                                <tr>
                                    <td class="flex-column text-xs">{{++$index}}</td>
                                    <td class="flex-column text-xs">
                                        @isset($row->policyNumber)
                                            <b class="text-xs text-blue text-bold"> {{$row->policyNumber?->policy_no}}</b>
                                        @endisset
                                    </td>

                                    <td class="flex-column text-xs">{{\Carbon\Carbon::parse($row?->created_at)->format('Y M d')}}</td>
                                    <td class="text-xs"> @isset($row?->service)
                                            {{$row?->service->name}}
                                        @endif
                                        <br/>
                                        @if(isset($row->belong) && $row->belong->count() == 1)
                                            <p >{{$row->belong->CoverNoteReferenceNumber}}</p>
                                        @endif
                                    </td>
                                    <td class="text-xs">
                                        @isset($row?->customers)
                                            @if($row?->customer){{ $row?->customer?->PolicyHolderName}}<br>@endif
                                        @endisset
                                    </td>
                                    <td class="text-xs">{{\Carbon\Carbon::parse($row?->startDate)->format('Y M d')}}
                                        To {{\Carbon\Carbon::parse($row?->endDate)->format('Y M d')}} </td>
                                    <td class="text-xs">
                                       Wallet
                                    </td>
                                    <td style="width: 10%">
                                        <a href="{{url('contract-accountant-payment/'.$row?->uuid ) }}" class="btn btn-success "
                                           type="button" data-toggle="tooltip" title="View Data"
                                           data-original-title="View"><i
                                                    class="fa fa-eye text-white">Payment</i></a>

                                            <a href="{{url('contract-accountant-payments/'.$row?->customer?->uuid."/".$row?->uuid ) }}" class="btn btn-success "
                                               type="button" data-toggle="tooltip" title="View Data"
                                               data-original-title="View"><i
                                                        class="fa fa-eye text-white"></i></a>

                                    </td>
                                </tr>
                            @endforeach
                            @endif
                            </tbody>
                        </table>
                    </div>



            </div>


        </div>


@endsection

@section('js')

    <script type="text/javascript">
        const data = {collection: []}
        let cancellation_reason = "";
        let currentElement = null;

        $('#daterange-btn').daterangepicker(
            {
                ranges   : {
                    'Today'       : [moment(), moment()],
                    'Yesterday'   : [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days' : [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month'  : [moment().startOf('month'), moment().endOf('month')],
                    'Last Month'  : [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
                    'This Year'   : [moment().startOf('year'), moment().endOf('year')],
                    'Last year'   : [moment().subtract(1, 'year').startOf('year'), moment().subtract(1, 'year').endOf('year')]
                },
                startDate: moment().subtract(29, 'days'),
                endDate  : moment()
            },
            function (start, end) {
                $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'))
                $('#date_range_selected').val(start.format('D-MM-YYYY')+'~'+end.format('D-MM-YYYY'));
            }
        )

        $(document).on('submit','.find_by_date_service_group',function (e) {
            e.preventDefault();
            let serviceGroupId = $(`.find_by_date_service_group select[name=serviceGroupId]`).val();
            let date = $(`.find_by_date_service_group input[name=date]`).val();
            if(!serviceGroupId){
                serviceGroupId = 'all';
            }
            if(!date){date='all'}
            window.location= `/accountant-policy-payments/${serviceGroupId}/${date}`
        })


        $(document).on('click', '.get_current_policy_data', function (e) {
            e.preventDefault();
            let id = $(this).data('id');
            if (id) {
                let formData = new FormData();
                formData.append('id', id);
                asyncFetchAnyData(url = "find-service-order", formData).then((response) => {
                    $('.policy_payment_modal').replaceWith(response.view);
                    $('.policy_payment_modal').modal('show');
                });
            }
        });

        $(document).on('submit', '#receive_policy_payment', function (e) {
            e.preventDefault();
            let formData = new FormData(this);
            asyncFetchAnyData(url = "receive-policy-payment", formData, "receive_policy_payment").then((response) => {
                if (response.status == 200) {
                    location.reload();
                    $('.policy_payment_modal').modal('hide');
                } else {
                    swalFunction('Error', `${response.message}`, 'error')
                }
            });

        });

        $(document).on('submit', '#receive_policy_payment_all', function (e) {
            e.preventDefault();
            let formData = new FormData(this);
            asyncFetchAnyData(url = "receive-policies-payments", formData, "receive_policy_payment").then((response) => {
                if (response.status == 200) {
                    location.reload();
                    $('.policy_payment_modal').modal('hide');
                } else {
                    swalFunction('Error', `${response.message}`, 'error')
                }
            });

        });




        $(document).on('submit', '#multi-policy-payment-form', function (e) {
            e.preventDefault();

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            let formData = new FormData(this);
            formData.append('policies', JSON.stringify(data.collection))

            $.ajax({
                url: '/payments',
                type: 'POST',
                data: formData,
                processData: false,
                contentType: false,

                success: function (response) {
                    // console.log(response);÷
                }
            })
        });

        $(document).on('change', '#currency_id', function (e) {
            e.preventDefault();
            let currency = $(this).val();
            let rate = 2540;
            let totalAmount = $('.payment_total_amount').text().replace(/,/g, '').replace(/\//g, '').replace(/=/g, '');
            let original_total_amount = $('.original_total_amount').val()

            $('#currency_id').select2();

            if (currency == 'Usd') {
                totalAmount = totalAmount / rate;
                $('.payment_total_amount').text(`${totalAmount.toLocaleString('en-US')} /=`);
                $('input[name=total_amount]').val(totalAmount);
            } else {
                totalAmount = totalAmount * rate;
                $('.payment_total_amount').text(`${totalAmount.toLocaleString('en-US')} /=`);
                $('input[name=total_amount]').val(totalAmount);
            }

            // $.ajax({
            //     url: `/get-payment-rate?currency=${currency}`,
            //     type: 'GET',

            //     success: function (response) {
            //         $("#payments_details_view").empty();
            //         $("#payments_details_view").append(response.view);
            //         $('#payment_detail_form_table').DataTable();
            //         $('#currency_id').select2();
            //     }
            // })
        });

        $(document).on('submit', '#policy_payment', function (e) {
            e.preventDefault();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            let formdata = new FormData(this);

            $.ajax({
                type: "POST",
                url: `/process-policy-payments`,
                processData: false,
                contentType: false,
                data: formdata,
                beforeSend: function () {
                    run_waitMe('ios', `policy_submission_form`, 'Connecting To Tira Service');
                },
                complete: function () {
                    $(`#policy_submission_form`).waitMe("hide");
                    // currentElement.addClass('invisible');
                },
                success: function (data) {
                    if (data.status == 200) {
                        $(".submitToTira").click()
                        $('#policy_payment_modal').modal('hide')

                        Swal.fire({
                            title: "Good!",
                            text: "Paid Successful!",
                            icon: "success"
                        });
                    } else {
                        Swal.fire({
                            title: "Failed!",
                            text: data.message,
                            icon: "error"
                        });
                    }
                },

                error: function (xhr, ajaxOptions, thrownError) {
                    releaseSubmit();
                    toastFunction('error', 'There is a technical error contact technical team');
                }
            });
        });

        $(document).on('submit', '#fleet_uploading_form', function (e) {
            e.preventDefault();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            let formdata = new FormData(this);

            $.ajax({
                type: "POST",
                url: `/motors-imports`,
                processData: false,
                contentType: false,
                data: formdata,
                beforeSend: function () {
                    run_waitMe('ios', `policy_submission_form`, 'Connecting To Tira Service');
                },
                complete: function () {
                    $(`#policy_submission_form`).waitMe("hide");
                    // currentElement.addClass('invisible');
                },
                success: function (data) {
                    if (data.status == 200) {
                        Swal.fire({
                            title: "Good!",
                            text: "Paid Successful!",
                            icon: "success"
                        });
                    } else {
                        Swal.fire({
                            title: "Failed!",
                            text: data.message,
                            icon: "error"
                        });
                    }
                },

                error: function (xhr, ajaxOptions, thrownError) {
                    releaseSubmit();
                    toastFunction('error', 'There Is A technical error, Please contact technical Team');
                }
            });
        });

        $(document).on('click', '.cancel_policy', function (e) {
            $('.cancellation_reason_modal').modal('show');
            currentElement = $(this);
        });

        $(document).on('click', '#add_cancellation_reason', function (e) {
            e.preventDefault();

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            cancellation_reason = $('#cancel_contract_submission_form textarea[name="reason"]').val()
            $('.cancellation_reason_modal').modal('hide');

            let id = $(currentElement).data('policy');
            let uuid = $(currentElement).data('uuid');
            let type = $(currentElement).data('type');
            let formdata = new FormData();
            formdata.append('id', id);
            formdata.append('uuid', uuid);
            formdata.append('type', type);
            formdata.append('cancellation_reason', cancellation_reason);

            $.ajax({
                type: "POST",
                url: `/singleSubmitToTira`,
                processData: false,
                contentType: false,
                data: formdata,
                beforeSend: function () {
                    run_waitMe('ios', `create_policy_form_table_${uuid}`, 'Connecting To Tira Service');
                },
                complete: function () {
                    $(`#create_policy_form_table_${uuid}`).waitMe("hide");
                    currentElement.addClass('invisible');
                },
                success: function (data) {
                    if (data.status) {
                        toastFunction('success', 'Thanks The Data Has Been SuccessFull Wait For Response');

                    } else {
                        swalFunction('Read Below', `${data.message}`, 'error');
                    }
                    setTimeout(function () {
                        synchronizeFindTheResponse({policy: uuid, contract: null})
                    }, 5000);
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    releaseSubmit();
                    toastFunction('error', 'There is a technical error contact technical team');
                }
            });
        });

        $(document).on('click', '.serive_order_check', function (e) {
            let id = $(this).data('id');
            let amount = $(this).data('amount');
            let isChecked = $(this).is(":checked");
            let totalAmount = $('.payment_total_amount').text().replace(/,/g, '').replace(/\//g, '').replace(/=/g, '');

            let checkedRows = 0;
            let rows = $('#payment_detail_form_table').dataTable().$("tr");
            let totalRows = rows.length;

            rows.each(
                function (i, tr) {
                    let order_id = $(this).data('id');
                    let target_input = $(this).find(`.order_number_${order_id}`);
                    let policy_id = $(this).closest('tr').data('policy');
                    let index = data.collection.indexOf(policy_id);

                    if (target_input.is(":checked")) {
                        // target_input.closest('tr').addClass('test-class')
                        checkedRows++;
                        if (index == -1) {
                            data.collection.push(policy_id)
                        }
                    } else {
                        // target_input.closest('tr').removeClass('test-class')
                        checkedRows--;

                        if (index !== -1) {
                            data.collection.splice(index, 1);
                        }
                    }
                }
            )

            if (isChecked) {
                $(this).attr('checked', true);
                newAmount = Number(totalAmount) + Number(amount);
                $('.payment_total_amount').text(`${newAmount.toLocaleString('en-US')} /=`);
                $('input[name=total_amount]').val(totalAmount);
            } else {
                $(this).attr('checked', false);
                newAmount = Number(totalAmount) - Number(amount);
                $('.payment_total_amount').text(`${newAmount.toLocaleString('en-US')} /=`);
                $('input[name=total_amount]').val(newAmount);
                $('input[name=options]').attr('checked', false);
            }

            if (checkedRows == totalRows) {
                $('input[name=options]').attr('checked', true);
            }
            console.log(data.collection);

        });

        $(document).on('click', 'input[name=options]', function (e) {
            let isChecked = $(this).is(":checked");
            let rows = $('#payment_detail_form_table').dataTable().$("tr");
            let trsOnCurrentView = $('#payment_details_table tr');

            let totalAmount = 0;

            rows.each(
                function (i, tr) {
                    let _id = $(tr).data('id');
                    let amount = $(tr).find(`.order_number_${_id}`).data('amount');

                    if (isChecked) {
                        totalAmount = Number(totalAmount) + Number(amount);
                        // $(tr).find(`.order_number_${_id}`).attr('checked', true);
                        $(tr).find("input").attr('checked', true).trigger('change');
                    } else {
                        totalAmount = 0;
                        $(tr).find(`.order_number_${_id}`).attr('checked', false).trigger('change');
                    }

                });

            $('.payment_total_amount').text(`${totalAmount.toLocaleString('en-US')} /=`);
        });

        toggleDataForm('new_toggle_data', 'new_toggle_button'); // slide for form
        toggleDataForm('policy_submission_form', 'new_policy_button'); // slide for form
        fetchAnyData('change', 'replaceChild', 'find_service_from_group', 'find_service_from_group', 'service_from_group');
        initializeSelectSearch('customers', 'load_customers_select');
        initializeSubmitCustomer('submit_customer_details_modal', 'customers', 'customers');
    </script>
@endsection