@extends('admin.layout.master')
@section('content')
    <section id="dashboard-ecommerce">

        <div class="row">
            <form action="{{ route('products_report_print') }}" method="get" id="print_form" target="_blank">
                @csrf
            </form>
            <div class="col-md-6" >
                <div class="status_order_print">@lang('admin.drivers'):
                    <select class="form-control" id="driver" data-slug="driver">
                        <option value=" ">@lang('admin.choose')</option>
                        @foreach(\App\Models\User::whereRoleIs(['Driver'])->get() as $driver)
                            <option   value="{{$driver->id}}">{{$driver->name}}</option>
                        @endforeach
                    </select>
                </div>
            </div>

            <div class="col-md-6" style="float: {{ app()->getLocale() == 'ar' ? 'right' : 'left' }}">
                <div class="form-group">
                    <label for="status">@lang('admin.status')</label>
                    <select name="status" form="print_form" class="form-control" id="status">
                        <option value="">@lang('admin.all')</option>
                        {{--                                @foreach ($order_status as $status)--}}
                        <option value="wait" {{request()->status == 'wait' ? 'selected': ''}}>@lang('admin.wait')</option>
                        <option value="refused" {{request()->status == 'refused' ? 'selected': ''}}>@lang('admin.refused')</option>
                        <option value="accepted" {{request()->status == 'accepted' ? 'selected': ''}}>@lang('admin.accepted')</option>
                        <option value="shipped" {{request()->status == 'shipped' ? 'selected': ''}}>@lang('admin.shipped')</option>
                        <option value="complete" {{request()->status == 'complete' ? 'selected': ''}}>@lang('admin.complete')</option>

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


            <div class="col-md-6">
                <div class="form-group">
                    <div class="input-group date" id="datetimepicker1">
                        @lang('admin.from_date')
                        <input type="datetime-local" form="print_form" class="form-control" id="from_date"
                               name="from_date"
                               value="">

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

            <div class="col-md-6">

                <div class="form-group">
                    <div class="input-group date" id="datetimepicker2">
                        <label for="to_date">@lang('admin.to_date')</label>
                        <input type="datetime-local" form="print_form" class="form-control" id="to_date" name="to_date"
                               value="">

                    </div>
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-group">
                    <button type="button" id="btnFiterSubmitSearch"
                            class="btn btn-info"
                            style="margin-top:20px;width: 100%">@lang('admin.filter')</button>
                </div>
            </div>
        </div>

        <div class="row">


            <br><br>
            <div class="col-lg-3 col-sm-6 col-12">
        <div class="card">
            <div class="card-header d-flex flex-column align-items-start pb-0">
                <div class="avatar bg-rgba-primary p-50 m-0">
                    <div class="avatar-content">
                        <i class="feather icon-users text-primary font-medium-5"></i>
                    </div>
                </div>
                <h2 class="text-bold-700 mt-1">0</h2>
                <p class="mb-0">طلبات في الانتظار</p>
            </div>

        </div>
    </div>

    <div class="col-lg-3 col-sm-6 col-12">
        <div class="card">
            <div class="card-header d-flex flex-column align-items-start pb-0">
                <div class="avatar bg-rgba-success p-50 m-0">
                    <div class="avatar-content">
                        <i class="feather icon-credit-card text-success font-medium-5"></i>
                    </div>
                </div>
                <h2 class="text-bold-700 mt-1">0</h2>
                <p class="mb-0">طلبات في الشحن</p>
            </div>

        </div>
    </div>



    <div class="col-lg-3 col-sm-6 col-12">
        <div class="card">
            <div class="card-header d-flex flex-column align-items-start pb-0">
                <div class="avatar bg-rgba-primary p-50 m-0">
                    <div class="avatar-content">
                        <i class="feather icon-users text-primary font-medium-5"></i>
                    </div>
                </div>
                <h2 class="text-bold-700 mt-1">0</h2>
                <p class="mb-0">طلبات  تم الغائها</p>
            </div>

        </div>
    </div>

    <div class="col-lg-3 col-sm-6 col-12">
        <div class="card">
            <div class="card-header d-flex flex-column align-items-start pb-0">
                <div class="avatar bg-rgba-success p-50 m-0">
                    <div class="avatar-content">
                        <i class="feather icon-credit-card text-success font-medium-5"></i>
                    </div>
                </div>
                <h2 class="text-bold-700 mt-1">0</h2>
                <p class="mb-0">طلبات  تم اكتمالها</p>
            </div>

        </div>
    </div>

        </div>


        <div class="content-body">
            <!-- Column selectors with Export Options and print table -->
            <section id="column-selectors">
                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">
                            </div>
                            <div class="card-content">
                                <div class="card-body card-dashboard">

                                    <div class="table-responsive">

                                        <div class="widget-body">

                                            <div class="table-responsive">
                                                <div id="default-datatable_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">
                                                    <div class="col-md-12">
                                                        <div>
                                                            <div class="col-md-12">
                                                                <div class="widget">

                                                                    <div class="widget-body">
                                                                        <table id="orders" class="table table-striped table-bordered" style="width:100%">
                                                                        </table>
                                                                    </div>
                                                                </div><!-- .widget-body -->
                                                            </div><!-- .widget -->
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- Column selectors with Export Options and print table -->

        </div>

    </section>




@endsection
@push('js')
    <script>
        // $('#datetimepicker1').datetimepicker();
        // $('#datetimepicker2').datetimepicker();

        $('#btnFiterSubmitSearch').click(function () {
            $('#orders').DataTable().draw(true);
        });

        // setInterval(function(){
        //     $('#orders').DataTable().draw(true);
        //     ; }, 10000);

        $(document).ready(function() {

            var table = $('#orders').DataTable({
                responsive: true,
                processing: true,
                serverSide: true,
                bStateSave: true,
                stateSave: true,
                bSortable: false,
                bRetrieve: false,
                order: [[ 5, "DESC" ]],
                ordering: false,

                // sPaginationType: "full_numbers",
                ajax: {
                    url: "{{ route('reports_driver') }}",
                    type: 'GET',
                    data: function (d) {
                        d.from_date = $('#from_date').val();
                        d.to_date = $('#to_date').val();
                        d.driver = $('#driver').val();
                        d.status = $('#status').val();

                    }
                },
                dom: 'Blfrtip',
                buttons: [
                    'copy', 'csv', 'excel', 'print'
                ],
                lengthMenu: [
                    [10, 25, 50, -1], [10, 25, 50, "All"]
                ],
                // select: true,
                columns: [
                    // {data: 'id', name: 'id' ,title:'id'},
                    {data: 'order_number', name: 'order_number',title: "@lang('admin.order_number')" },
                    {data: 'payment_method', name: 'payment_method',title: "@lang('admin.payment_method')" },
                        {{--{data: 'payment_id', name: 'payment_id',title: "@lang('admin.payment_id')" },--}}
                        {{--{data: 'created_at', name: 'created_at',title: "@lang('admin.created_at')" },--}}
                    {data: 'order_done_date', name: 'order_done_date',title: "@lang('admin.order_done_date')" },
                    {data: 'status', name: 'status',title: "@lang('admin.status')" },
                    {data: 'shipping_Type', name: 'shipping_Type',title: "@lang('admin.shipping_type')" },
                        {{--{data: 'orderType', name: 'orderType',title: "@lang('admin.orderType')" },--}}
                    {data: 'user_id', name: 'user_id',title: "@lang('admin.user_phone')" },
                    {data: 'driver', name: 'driver',title: "@lang('admin.driver')" },

                    {data: 'total_price_shipping', name: 'total_price_shipping',title: "@lang('admin.total_price_shipping')" },

                        {{--{data: 'quantity', name: 'quantity',title: "@lang('admin.quantity')" },--}}
                    {data: 'total_price', name: 'total_price',title: "@lang('admin.total_price')" },
                        {{--{data: 'payment_method', name: 'payment_method',title: "@lang('admin.payment_method')" },--}}
                        {{--{data: 'image', name: 'image',title: "@lang('admin.image')" },--}}
                    {data: 'action', name: 'action',title:'action' ,searchable: 'false'},
                    // {data: 'add_lang', name: 'add_lang',title:'add_lang' ,searchable: 'false'}
                ],
                footerCallback: function (tfoot, data, start, end, display) {
                    var api = this.api();
                    // console.log(api)
                    this.api().columns(7).every(function () {
                        var column = this;

                        var sum = column
                            .data()
                            .reduce(function (a, b) {
                                var x = parseFloat(a) || 0;
                                var y = parseFloat(b) || 0;
                                return x + y;
                            }, 0);
                        var count = table.data().count();
                        var total = $('#total').html(sum.toFixed(3));
                        var result = sum.toFixed(3) / count

                        $('#order_moadal').html(result.toFixed(3));
                        // console.log(result);




                    });
                }
            });


            $('body').on('submit','#delform',function (e) {
                e.preventDefault();
                var url = $(this).attr('action');
                // alert(url);

                $.ajax({
                    url: url,
                    method: "delete",
                    data: {
                        _token: '{{ csrf_token() }}',
                    },
                    success: function (response) {

                        if (response.status == 'success'){
                            new Noty({
                                type: 'success',
                                layout: 'topRight',
                                text: "تم الحذف بنجاح",
                                timeout: 2000,
                                killer: true
                            }).show();
                            table.ajax.reload(null, false);
                        }
                        // console.log(response);
                        // window.location.reload();
                    }
                });
            });

            $('body').on('click','.notifcation_user',function (e) {
                e.preventDefault();
                var id = $(this).data('id');
                var token = $(this).data('token');
                $('#get_notify').val(id);
                $('#get_notify_token').val(token);
            });

            // submit notfaction
            $('body').on('submit','#store_notifaction',function (e) {
                e.preventDefault();
                var url = $(this).attr('action');
                var formData = new FormData(this);
                formData.append('slug', 'Cart');
                $.ajax({
                    url: url,
                    method: "post",
                    data: formData,
                    dataType: 'json',

                    cache: false,
                    contentType: false,
                    processData: false,

                    success: function (response) {
                        if (response.status == 'failed') {
                            new Noty({
                                type: 'warning',
                                layout: 'topRight',
                                text: "@lang('admin.Notfy_send_failed')",
                                timeout: 2000,
                                killer: true
                            }).show();
                        } else {
                            if (response.status == 'success') {
                                new Noty({
                                    type: 'success',
                                    layout: 'topRight',
                                    text: "@lang('admin.Notfy_send_succeffly')",
                                    timeout: 2000,
                                    killer: true
                                }).show();
                            }
                            // table.ajax.reload();
                            // $("#addform")[0].reset();
                        }
                        if (response.status == 'false'){
                            new Noty({
                                type: 'warning',
                                layout: 'topRight',
                                text: "@lang('admin.Sorry_you_have_error')",
                                timeout: 2000,
                                killer: true
                            }).show();
                        }
                        // window.location.reload();
                    },

                });

            });
            $('body').on('click','.get_comment',function (e) {
                e.preventDefault();
                var url = $(this).data('url');
                var id = $(this).data('id');
                $.ajax({
                    url: url,
                    method: "get",
                    data: {
                        id:id,
                    },
                    dataType: 'json',


                    success: function (response) {

                        $('#append_comment').empty();
                        for (var i=0 ; i < response.data.length ; i++){
                            $('#append_comment').append(`

                                         <div class="box">
                            <div class="profile">
    <!--                            <img src="https://images.unsplash.com/photo-1648737965402-2b9c3f3eaa6f?ixlib=rb-1.2.1&ixid=MnwxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=870&q=80" alt="">-->
                                <div class="bio">
                                    <h3>اسم المستخدم: ${response.data[i].user_name}</h3>
                                    <h4>${response.data[i].comment}</h4>
                                </div>
                            </div>

                        </div>
                            `);
                        }


                        // window.location.reload();
                    },

                });

            });


            $('body').on('click','.getLink',function (e) {
                e.preventDefault();
                var mobile = $(this).data('mobile');
                var total = $(this).data('total');
                var order_id = $(this).data('order');

                var html = `<select class="form-control" name="" id="checkWhats" data-mobile="${mobile}" data-total="${total}" data-order_id="${order_id}">
                                <option value=" ">اختر طريقه ارسال الرابط</option>

<!--                                <option value="sms">Sms</option>-->
                                <option value="whatsapp">whatsapp</option>
                            </select>`;

                $('#data_link').empty();
                $('#data_link').append(html)



            });
            $('body').on('change','#checkWhats',function (e) {
                e.preventDefault();


                // alert('sad');
                var val = $(this).val();
                var mobile = $(this).data('mobile');
                var total = $(this).data('total');
                var order_id = $(this).data('order_id');

                if (val == 'whatsapp'){
                    $.ajax({
                        url: "{{route('send-link-whatsapp')}}",
                        method: "post",
                        data: {
                            phone : mobile,
                            total_price : total,
                            order_id : order_id,
                        },
                        context:this,
                        success: function (response) {

                            var html = `<a href="https://api.whatsapp.com/send?phone=965${mobile}&text=${encodeURIComponent(response.data)}" class="social-button ">
               <img src="{{asset('whats.png')}}" style="width: 39px;margin-bottom: 24px;"></a>`;
                            $("#whatsAppLink").empty();
                            $("#whatsAppLink").append(html);

                            new Noty({
                                type: 'success',
                                layout: 'topRight',
                                text: "تم ارسال الرابط بنجاح ",
                                timeout: 2000,
                                killer: true
                            }).show();


                            // console.log(response);
                            // window.location.reload();
                        }
                    });
                }else{
                    $.ajax({
                        url: "{{route('send-link-whatsapp')}}",
                        method: "post",
                        data: {
                            phone : mobile,
                            total_price : total,
                            order_id : order_id,
                            slug:"sms",
                        },
                        context:this,
                        success: function (response) {

                            new Noty({
                                type: 'success',
                                layout: 'topRight',
                                text: "تم ارسال الرابط بنجاح ",
                                timeout: 2000,
                                killer: true
                            }).show();
                            // window.location.reload();
                        }
                    });
                }






            });


        });


    </script>
@endpush