App.order_reservation = App.cable.subscriptions.create('OrderReservationChannel', {
  connected: function() {},

  disconnected: function() {},

  received: function(data) {    
    var order  = data.data;
    if(order.length > 0){
      $('.order_reserve_cable tbody').html("");
      $(".nav-item.red > a > p.num").text(order.length);
      $.each(order, function(key,value){
        var active_class = "";
        if(key==0){
          active_class = "tr-active";
          showNewOrder(order[key]);
        }
        var rowCount = key+1;
        var date = new Date(value.created_at); 
        var time = timeFormat(date);
        var created_at = date.getFullYear() +'-'+ (date.getMonth() > 10? date.getMonth() : '0' + (date.getMonth() + 1)) +'-'+ (date.getDate()>10?date.getDate() : '0'+date.getDate());

        var delivery_type = "";
        if(value.delivery_type == "service"){
          delivery_type = "DELIVERY";
        }else if(value.delivery_type == "pick_up"){
          delivery_type = "PICK-UP";
        }else{
          delivery_type = "DIRECT DELIVERY";
        }

        row = '<tr class="custom-tr first-'+rowCount+' '+active_class+'" style="" data-id="'+value.order_reservation_id+'" data-sr-no="'+rowCount+'">'
              +'<td width ="5%" class="align-left">'+rowCount
              +'</td>'
              +'<td width ="20%" class="align-center">'+created_at
              +'</td>'
              +'<td width ="20%" class="align-center">'+time
              +'</td>'
              +'<td width ="20%" class="align-center">'+value.grand_total
              +'</td>'
              +'<td width ="30%" class="align-center">'
                +'<span class="font-10 col-blue">'+ delivery_type +'</span>'
              +'</td>'
            +' </tr>';
        
        $('.custom-table.order_reserve_cable tbody').append(row);
      });
    }

    customTableClick();
  }
});