


 



     



 



     



 



 



 



 



<footer class="footer_three">

     

     

    <div class="footer-bottom bg-dark3">

        <div class="container">

            <div class="row align-items-center">

                <div class="col-md-12 col-12  text-center"> © 2023 <span class="text-white">Global Order Managment</span>  All Rights Reserved.</div>

                 

            </div>

        </div>

    </div>

</footer>

  


    <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content modal-content-order-items">
    
   


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



<!-- Vendor JS -->

<script src="https://code.jquery.com/jquery-3.5.1.js"></script>

<script src="{{ asset('frontend/js/vendors.min.js') }}"></script>	
<script src="{{ asset('frontend/js/bootstrap.min.js') }}"></script>
<!-- Corenav Master JavaScript -->

<script src="{{ asset('frontend/corenav-master/coreNavigation-1.1.3.js') }}"></script>

<script src="{{ asset('frontend/js/nav.js') }}"></script>

<script src="{{ asset('frontend/assets/vendor_components/OwlCarousel2/dist/owl.carousel.js') }}"></script>

<script src="{{ asset('frontend/assets/vendor_components/bootstrap-select/dist/js/bootstrap-select.js') }}"></script>


<script src="https://cdn.datatables.net/1.13.5/js/jquery.dataTables.min.js"></script>



<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>


<!-- EduAdmin front end -->

<script src="{{ asset('frontend/js/template.js') }}"></script>


<script>
   $(document).ready(function(){
    
    $("#myModal").modal({backdrop: "static"});

    let is_login="{{ (request()->is('orders')) ? 1 : 0 }}"
    
    let location_id="{{   (session('location_id'))?session('location_id'):0 }}";

    if(Number(is_login) && Number(location_id)==0)
      $("#myModal").modal("show");

    /* $(".btn-modal-show").on('click', function(){
      //alert('ddd');
      $("#exampleModalCenter").modal('show');
    });*/

    $('.btn-close-location-modal').on('click',function(){
      $("#myModal").modal("hide");
      $('.dd-order-location').trigger('change');

        $.ajax({
          url: "{{ route('order.location') }}",
          type: "POST",
          async:true,
          data: {location_id:$('.dd-order-location').val()},
          success: function (response) {
            console.log(response);
          },
          error: function (response){
            console.log(response);
          }
        });
    });

    var ordertable=$('#tb-orders').DataTable({
        order: [[0, 'desc']]
      });

    $('.dd-order-location').on('change',function(){
      var locationId=$(this).find(":selected").val();
      $(".dd-order-location option[value="+locationId+"]").attr('selected', 'selected');
      $(".dd-order-location option[value!="+locationId+"]").removeAttr('selected');
      $('.dd-order-location').val(locationId);
      //console.log('dddf');
      $('.btn-order-filter').trigger('click'); 
    });  

    $('#txt_from_date').datepicker({
                autoclose: true,
                format: "yyyy/mm/dd"
            });

    $('#txt_to_date').datepicker({
        autoclose: true,
        format: "yyyy/mm/dd"
    }); 
    
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $('.btn-order-filter').on('click',function(e){
      e.preventDefault();
      var location_id=$('.dd-form-location-id').find(":selected").val();
      console.log(location_id);

      var date1 = new Date($('#txt_from_date').val());
      var date2 = new Date($('#txt_to_date').val());
      
      if(date2<date1){
        alert('To Date should be greater than From Date');
        return false;
      }

      $.ajax({
        url: "{{ route('order.filter') }}",
        type: "POST",
        async:true,
        data: {date_from:$('#txt_from_date').val(),date_to:$('#txt_to_date').val(),location_id:location_id,order_type:$('input[name="txt_delivery_option"]:checked').val()},
        success: function (response) {
          //console.log(response); return false;
          let table = $('#tb-orders').DataTable();
          table.destroy();
          $('.tbody-orders').html(response);
          var order_table=$('#tb-orders').DataTable({
            order: [[0, 'desc']]
          });
          recreateDatatable(order_table);

        
        },
        error: function (response){
          console.log(response);
        }
    });

  });


  //changes done 7-11-2023
                             
    //changes done 07-11-2023
      // Formatting function for row details - modify as you need
  function format(order) {
      var order_status=order['order_status'];
      var order_options="";
      ['pending', 'completed', 'cancelled'].forEach(element => {
          if(element==order_status.trim()){
            order_options+='<option selected>'+element+'</option>';
          }
          else 
            order_options+='<option>'+element+'</option>';
      });
      
      return (

        '<article class="card"><div class="card-body row">'+
                        '<div class="col"> <strong>Created At:</strong> <br>'+order['created_date']+'</div>'+
                        '<div class="col"> <strong>Contact:</strong> <br>'+order['name']+', <br>'+ order['address'] +' '+order['address2']+' <br> '+ order['city'] +' '+ order['postal_code'] +'<br> <i class="fa fa-phone"></i>'+ order['phone'] +'<br><i class="fa fa-envelope"></i> '+ order['email'] +'</div>'+
                        '<div class="col"> <strong>Order Status:</strong> <br><span id="span-order-status'+order['order_id']+'">'+order['order_status']+'</span> <br> <span id="span-order-message'+order['order_id']+'">'+order['order_message']+'</span> </div>'+
                        '<div class="col align-center"> <a href="#" data-order-time="'+order['order_time']+'"  data-total-amount="'+order['total_amount']+'"  data-order-id="'+order['order_id']+'" class="btn btn-primary btn-sm btn-modal-view-details" data-toggle="modal" data-target="#exampleModalCenter">View Details</a> </div>'+
        '</div></article>'+
        '<div class="row">'+
          '<div class="col-md-1"></div>'+
          '<div class="col-md-5"><select class="form-control dd-order-status-update">'+order_options+'</select></div>'+
              '<div class="col-md-3"><button type="button" class="btn btn-sm btn-warning-light btn-outline btn-order-update"  data-purpose="status" data-order-id="'+order['order_id']+'">Update Status</button></div>'+
              '<div class="col-md-2"><button type="button" class="btn btn-sm btn-success-light btn-order-status-completed">Completed</button></div>'+
              '<div class="col-md-1"></div>'+
          '</div>'
      );
  }

function updateOrder() {  
  $('.btn-order-update').on('click',function(){
        

        var message="";
        
        

        var purpose=$(this).attr('data-purpose');
        var order_id=$(this).attr('data-order-id');

        var span_order_status=$('#span-order-status'+order_id);
        var badge_order_status=$('#badge-order-status'+order_id);
        var span_order_message=$('#span-order-message'+order_id);

        if(purpose=='delay')
          message=$(this).closest('.row').find('.dd-order-delay-minutes').find(":selected").val();
        else if(purpose=='status')
          message=$(this).closest('.row').find('.dd-order-status-update').find(":selected").val();
        
        //console.log(message);
        $.ajax({
            url: "{{ route('order.status') }}",
            type: "POST",
            async:true,
            data: {order_id:order_id,message:message,purpose:purpose},
            success: function (response) {
              //console.log(response); return false;
              if(purpose=='delay')
                span_order_message.html('Order Delay By '+message +' minutes');
              
              else if(purpose=='status') {
                span_order_status.html(message);

                if(message=='pending'){
                  badge_order_status.addClass('badge-warning');
                  badge_order_status.removeClass('badge-danger')
                  badge_order_status.removeClass('badge-success')
                }
                else if(message=='completed'){
                  badge_order_status.addClass('badge-success');
                  badge_order_status.removeClass('badge-danger');
                  badge_order_status.removeClass('badge-warning');
                }
                else if(message=='cancelled'){
                  badge_order_status.addClass('badge-danger');
                  badge_order_status.removeClass('badge-warning');
                  badge_order_status.removeClass('badge-success')
                }
                badge_order_status.html(message.charAt(0).toUpperCase()
  + message.slice(1));
              }  

              $('#exampleModalCenter').modal('hide');  
            },
            error: function (response){
              console.log(response);
            }
        });

      });
  
  }

  function recreateDatatable(order_table){

    // Add event listener for opening and closing details
    order_table.on('click', 'td.dt-control', function (e) {
    
      var orderId =$(this).attr('data-order-id');
      var name =$(this).attr('data-name');
      var address =$(this).attr('data-address');
      var address2 =$(this).attr('data-address2');
      var city =$(this).attr('data-city');
      var postalCode =$(this).attr('data-postal-code');
      var email =$(this).attr('data-email');
      var phone =$(this).attr('data-phone');
      var created_date =$(this).attr('data-created-at');
      var status =$(this).attr('data-order-status');

      var total_amount =$(this).attr('data-total-amount');
      var order_time =$(this).attr('data-order-time');
      var order_message =$(this).attr('data-order-message');
      

      var obj={order_message:order_message,total_amount:total_amount,order_time:order_time,created_date:created_date,order_status:status,name:name,order_id:orderId,address:address,address2:address2,city:city,postalCode:postalCode,email:email,phone:phone};

      //console.log(obj);

      let tr = e.target.closest('tr');

      // let table = $('#tb-orders').DataTable();
      // table.destroy();
      
      // var order_table=$('#tb-orders').dataTable({
      //       order: [[0, 'desc']]
      // });

      let row = order_table.row(tr);
      //console.log(row.data());
      if (row.child.isShown()) {
          // This row is already open - close it
          row.child.hide();
      }
      else {
          // Open this row
          //row.child(format(row.data())).show();
          row.child(format(obj)).show();
        
      }

      //end changes
      $('.btn-order-status-completed').on('click',function(){
         $(".dd-order-status-update").val("completed").change();
         $(this).closest('tr').find('.btn-order-update').trigger('click');
      });


      updateOrder();
      


    });

  };
 



  recreateDatatable(ordertable);      
    
  
  //end changes
   
  $("#exampleModalCenter").on('show.bs.modal', function(event){
        //alert('The modal is about to be shown.');
       
        var orderId=event.relatedTarget.dataset['orderId'];
        var orderTime=event.relatedTarget.dataset['orderTime'];
        var totalAmount=event.relatedTarget.dataset['totalAmount'];

        // console.log(event.relatedTarget.dataset);
        $('.modal-content-order-items').html('');

        $.ajax({
            url: "{{ route('order.items') }}",
            type: "POST",
            async:true,
            data: {order_id:orderId,order_time:orderTime,total_amount:totalAmount},
            success: function (response) {
              //console.log(response); return false;
              $('.modal-content-order-items').html(response);
               
              updateOrder();
            },
            error: function (response){
              console.log(response);
            }
        });
  }); 

});







                   
        
        
</script>    


</body>



</html>