@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 ml-1">
        <div class=" bg-gray-900 d-flex flex-row justify-content-between m-2 ">
            <div class="card d-flex flex-row justify-content-between w-25 m-2 mr-2">
                <div class="bg-dark py-3 px-3 w-50">RECEIVE</div>
                <span class="bg-dark py-3 px-3 w-50 p-1"> {{number_format($vars['serviceOrders']?->sum('amount'), 2)}} /=</span>
            </div>

            <div class="card d-flex flex-row justify-content-between w-25 m-2 mr-2">
                <div class="bg-dark py-3 px-2 w-50"> PAY</div>
                <span class="bg-dark py-3 w-50 p-1"> {{number_format($vars['serviceOrdersCustomer']?->sum('amount'), 2)}} /=</span>
            </div>

            <div class="card d-flex flex-row justify-content-between w-25 m-2 mr-2">
                <div class="bg-dark py-3 px-2 w-50">WALLET</div>
                <span class="bg-dark py-3 w-50 p-1"> {{number_format($vars['customer']?->wallet?->amount, 2)}} /=</span>
            </div>

            <div class="card d-flex flex-row justify-content-between w-25 m-2 ml-2">
                <div class="bg-dark py-3 px-2 w-50">DISCOUNT INFO</div>
                <span class="bg-dark py-3 px-2 w-50 p-1">  {{number_format($vars['customer']?->discounts?->sum('amount'), 2)}} /=  </span>
            </div>
        </div>
        <div class="card mb-4">
            <div class="card-body">
                @if(isset($vars['serviceOrders']) && $vars['serviceOrders']?->count() > 0)
                    <div class=" ">
                        <h4 class="text-center text-base justify-content-center"> Company Payment </h4>
                        <table class="table normal-table table-striped normal-tablee" id="payment_detail_form_table">
                            <thead>
                            <tr>
                                <th>
                                    <input type="checkbox" checked name="options"/>
                                </th>
                                <th>Date Of Service</th>
                                <th>Name</th>
                                <th>Amount</th>
                                <th>Discount</th>
                                <th>Paid Amount</th>
                                <th>Due Amount</th>
                                <th>Payment</th>
                            </tr>
                            </thead>

                            <tbody id="payment_details_table">
                            @foreach ($vars['serviceOrders'] as $row)
                                @include('payments.renders.service_tr')
                            @endforeach
                            </tbody>

                        </table>
                    </div>
                @endif
                @if(isset($vars['serviceOrdersCustomer']) && $vars['serviceOrdersCustomer']->count() > 0)
                    <div class=" ">
                        <h4 class="text-center text-base justify-content-center"> Customer Payment </h4>
                        <table class="table normal-table table-striped normal-tablee" id="payment_detail_form_table">
                            <thead>
                            <tr>
                                <th>
                                    <input type="checkbox" checked name="options"/>
                                </th>
                                <th>Date Of Service</th>
                                <th>Name</th>
                                <th>Amount</th>
                                <th>Discount</th>
                                <th>Paid Amount</th>
                                <th>Due Amount</th>
                                <th>Payment</th>
                            </tr>
                            </thead>

                            <tbody id="payment_details_table">
                            @foreach ($vars['serviceOrdersCustomer'] as $row)
                                @include('payments.renders.service_to_pay_tr')
                            @endforeach
                            </tbody>

                        </table>
                    </div>
                @endif
                <div class="my-2 border border-black">
                </div>

                        @if(isset($vars['serviceOrder']))
                            <form class="prevent-resubmit-form" id="receive_policy_payment" method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="row">
                                    @isset($vars['wallet_id'])
                                        <input type="hidden" name="wallet_id" value="1">
                                    @endisset
                                    <input type="hidden" name="customer_id" value="{{$vars['customer']->id}}" required>
                                    <input type="hidden" name="id" value="{{$vars['serviceOrder']->id}}" required>
                                    <input type="hidden" name="entered_by_id" value="{{auth()->user()->id}}" required>
                                    <div class="form-group col-md-4">
                                        <label for="exampleInputService"> Payment Method:</label>
                                        <select class="form-control select2 paymentType" name="payment_method_id" data-placeholder="Payment method" required>

                                            <option value="">Payment method</option>
                                            {{--                                    @if(isset($vars['payment_method']))--}}
                                            {{--                                        <option value="0" selected>From Wallet</option>--}}
                                            {{--                                    @else--}}
                                            {{--                                    @endif--}}
                                            @foreach(\App\Models\PaymentMethod::get() as $pay)
                                                <option value="{{$pay->id}}">{{$pay->name}}</option>
                                            @endforeach

                                        </select>
                                    </div>
                                    @include('reusable.inputText', ["colDiv" =>'col-md-3', 'label' =>' Reference', 'className'=>'reference', "name" =>'reference','inputType'=>'text',"required" =>'required'])
                                    @include('reusable.inputText', ["colDiv" =>'col-md-3', 'label' =>' Amount', 'value'=>$vars['amount'], 'className'=>'amount policy_amount', "name" =>'amount',"readonly" => 'readonly', 'inputType'=>'text'])
                                    <div class="col-md-2 justify-content-between hide_show_payment_button  pt-4">
                                        <button type="submit" class="btn btn-primary bg-teal">Receive Payment</button>
                                    </div>
                                </div>

                            </form>

                    @else

                        <div id="payment_modal_form">
                            <form class="prevent-resubmit-form" id="receive_policy_payment_all" method="POST" enctype="multipart/form-data">
                                @csrf

                                <div class="modal-body">
                                    <div class="row">
                                        <input type="hidden" name="customer_id" @if(isset($vars['customer'])) value="{{$vars['customer']->id}}" @endif required>
                                        <input type="hidden" name="contract_id" @if(isset($vars['contract'])) value="{{$vars['contract']->id}}" @endif required>
                                        <input type="hidden" name="entered_by_id" value="{{auth()->user()->id}}" required>
                                        <div class="form-group col-md-4">
                                            <label for="exampleInputService"> Payment Method:</label>
                                            <select class="form-control select2 paymentType" name="payment_method_id" data-placeholder="Payment method" required>

                                                <option value="">Payment method</option>
                                                @foreach(\App\Models\PaymentMethod::get() as $pay)
                                                    <option value="{{$pay->id}}">{{$pay->name}}</option>
                                                @endforeach

                                            </select>
                                        </div>
                                        @include('reusable.inputText', ["colDiv" =>'col-md-3', 'label' =>' Reference', 'className'=>'reference', "name" =>'reference','inputType'=>'text',"required" =>'required'])
                                        @include('reusable.inputText', ["colDiv" =>'col-md-3', 'label' =>' Amount', 'value'=>$vars['contractsAmount'], 'className'=>'amount policy_amount', "name" =>'amount',"readonly" => 'readonly', 'inputType'=>'text'])
                                        <div class="col-md-2 justify-content-between hide_show_payment_button pt-4">
                                            <button type="submit" class="btn btn-primary bg-teal">Receive Payment</button>
                                        </div>
                                    </div>

                                </div>

                            </form>
                        </div>
                    @endif


                <div class="my-2 border border-black">
                </div>
                        @if(isset($vars['wallets']) && $vars['wallets']?->count() > 0)
                            <div class=" ">
                                <h4 class="text-center text-base justify-content-center"> Wallets </h4>
                                <table class="table normal-table table-striped normal-tablee" id="payment_detail_form_table">
                                    <thead>
                                    <tr>
                                        <th> S/N </th>
                                        <th>Date Of Service</th>
                                        <th>Name</th>
                                        <th>Amount</th>
                                        <th>Reference</th>
                                        <th>Actions</th>
                                    </tr>
                                    </thead>
                                    <tbody id="payment_details_table">
                                    @foreach ($vars['wallets'] as $index => $row)
                                        @include('payments.renders.wallet_tr')
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        @endif

                        @if($vars['payments']?->count() > 0)
                    <div class=" ">
                        <h4 class="text-center text-base justify-content-center"> Payments</h4>
                        <table class="table normal-table table-striped normal-tablee" id="payment_detail_form_table">
                            <thead>
                            <tr>
                                <th>S/N</th>
                                <th>Date</th>
                                <th>Name</th>
                                <th>Policy</th>
                                <th>Reference</th>
                                <th>Status</th>
                                <th>Amount</th>
                                <th>Total</th>
                            </tr>
                            </thead>
                            <tbody id="payment_details_table">
                            @php $summation = 0; @endphp
                            @foreach ($vars['payments'] as $index => $row)
                                @php
                                    $policy = $row?->belong?->belong;
                                    if($row->pay_type == "Cash Out"){
                                        $summation = $summation - $row->amount;
                                    }else{$summation = $summation + $row->amount;}
                                @endphp
                                @include('payments.renders.payment_tr')
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </div>


        </div>
    </div>
    {{--Modal For the Payment--}}
    <div id="policy_payment_modal" class="modal fade policy_payment_modal">
    </div>
@endsection

@section('js')

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


        $(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