@extends('layouts.app')
@section('content')

@section('css')
<link rel="stylesheet" type="text/css" href="{{asset('assets/admin/vendors/css/tables/datatable/dataTables.bootstrap4.min.css')}}">
<style>
.scheduled-order {
    background-color: #fefef2; 
}
</style>
@endsection

<div class="card">
    <div class="card-header">
        <h4 class="card-title">{{ isset($title)?$title:'' }}</h4>
        <a class="heading-elements-toggle"><i class="icon-ellipsis font-medium-3"></i></a>
    </div>

    <div class="card-body collapse in">
        <div class="card-block card-dashboard">
            <table class="table table-bordered table-hover dom-jQuery-events">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Customer</th>
                        <th>Date Time</th>
                        <th>Total</th>
                        <th>Order Type</th>
                        <th>Status</th>
                        <th>View</th>
                    </tr>
                </thead>
                <tbody id="orders_ajax">
                </tbody>
            </table>
        </div>
    </div>
</div>

@include('admin.orders.online_orders_modal')
@section('js')
<script src="{{asset('assets/admin/vendors/js/tables/jquery.dataTables.min.js')}}" type="text/javascript"></script>
<script src="{{asset('assets/admin/vendors/js/tables/datatable/dataTables.bootstrap4.min.js')}}" type="text/javascript"></script>
<script src="{{asset('assets/admin/js/scripts/tables/datatables/datatable-advanced.min.js')}}" type="text/javascript"></script>
<script type="text/javascript">

function get_orders_ajax(){
    $.ajax({
        url: '{{ route("getOrdersAjax") }}',
        success: function (response) {
            $('#orders_ajax').html(response);
        }
    });
}

$(document).ready(function() {
    get_orders_ajax();
    setInterval(function(){ 
        get_orders_ajax();
    }, 9000);
/*
| modal_order_detail
|--------------------------------------------------------------------------
*/
$('body').on('click', '.modal_order_detail', function (e) {
    $.ajax({
        type:'POST',
        url:"{{ route('getOrderDetailAjax') }}",
        data: {id: $(this).attr('id'), _token: $('meta[name="csrf-token"]').attr('content')},
        success:function (result) {
            var obj = result;
        
            $('#order_product').html('');
    
            $("#restaurant_name").html(obj['restaurant_name']);
            $("#phone").html(obj['phone']);
            $("#restaurant_address").html(obj['restaurant_address']);
            $("#order_id").html(obj['order_id']);
            $("#order_date").html(obj['order_date']);
            $("#platform").html(obj['platform']);            
            $("#customer_name").html(obj['customer_name']);
            $("#customer_phome").html(obj['customer_phome']);
            $("#customer_address").html(obj['customer_address']);
            $("#delivery_charges").html(obj['delivery_charges']);

            if(obj['platform']=='web'){
                $("#platform").html('<i class="icon-globe"> </i>Website');
            }else if(obj['platform']=='android'){
                $("#platform").html('<i class="icon-android2"> </i> Android');
            }else if(obj['platform']=='ios'){
                $("#platform").html('<i class="icon-apple"> </i> iOS');
            }
    
            $("#fdb_user").html(obj['customer']);
            $("#customer_address").attr("address", obj['customer_address']);


            $("#subtotal").html(obj['subtotal']);    
            $("#tax").html(obj['tax']);
            $("#tax_rate").html(obj['tax_rate']);
            $("#delivery_charges").html(obj['delivery_charges']);
            $("#total").html(obj['total']);

            $(obj['order_detail']).each(function (iIndex, data) {                
                var order_detail = "";
                order_detail += "<tr>";
                order_detail += "<td>";
                order_detail += data.item_name+"<span>("+data.price_title+")</span></br>";
                if (obj['platform']=='web') {
                    if(data.addons){
					 	$.each(JSON.parse(data.addons), function( k, v ) {
							order_detail += "<span> - "+v.item_name+" ("+v.item_price+")</span><br>";
					 	});
					}
                }
                order_detail+= "</td>";
                order_detail += "<td style='text-align:right'>"+data.quantity+"</td>";
                order_detail += "<td style='text-align:right'>"+data.price+"</td>";
                order_detail += "<td style='text-align:right'>"+data.item_total_price+"</td>";
                order_detail += "</tr>";
                
                $('#order_product').append(order_detail);
            });

            //special_instructions
            if(obj['special_instructions'] && obj['special_instructions'] !=""){
                $('#special_instructions_div').show().html(obj['special_instructions']);
            }else{
                $('#special_instructions_div').empty().hide();
            }
            
            //feedback
            if(obj['feedback_flag'] == 1){
                $('#y_feedback').show();
                $('#n_feedback').hide();
                $('select[name=quality]').val(obj['feedback']['quality']);
                $('select[name=service]').val(obj['feedback']['service']);
                $('select[name=value]').val(obj['feedback']['value']);
                $('#f_feedback').val(obj['feedback']['feedback']);
            }else{
                $('#n_feedback').show();
                $('#y_feedback').hide();
            }
            
            $("#OrderDetailModal").modal('show');
        }
        

    });
});

/*
| order_status_update
|--------------------------------------------------------------------------
*/
$('body').on('change', '.update_status', function () {
    var order_id = $(this).attr('id');
    var status = $(this).val();
    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    
    $.ajax({
        type:'POST',
        url:"{{ route('orderStatusUpdate') }}",
        data: {id: order_id, status: status, _token: CSRF_TOKEN},
        success:function (response) {

        }
    });

});

});

</script>
@endsection
@endsection