<?php include("conn.php");
$page='Order Status';?>
<!DOCTYPE html>
<html lang="en">
<?php include("common/head.php");

if ($order=='none') {
  echo"<script>alert('You are not allow to access this page, contact your admintrator'); window.location.href='login'</script>";
}
?>



<style>
     * { box-sizing: border-box; }

body {
  font-family: sans-serif;
}

/* ---- input ---- */

input[type="text"] {
  font-size: 20px;
}

/* ---- button ---- */

.button {
  display: inline-block;
  padding: 0.5em 1.0em;
  margin-bottom: 10px;
  background: #EEE;
  border: none;
  border-radius: 7px;
  background-image: linear-gradient( to bottom, hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 0.2) );
  color: #222;
  font-family: sans-serif;
  font-size: 16px;
  text-shadow: 0 1px white;
  cursor: pointer;
}

.button:hover {
  background-color: #8CF;
  text-shadow: 0 1px hsla(0, 0%, 100%, 0.5);
  color: #222;
}

.button:active,
.button.is-checked {
  background-color: #28F;
}

.button.is-checked {
  color: white;
  text-shadow: 0 -1px hsla(0, 0%, 0%, 0.8);
}

.button:active {
  box-shadow: inset 0 1px 10px hsla(0, 0%, 0%, 0.8);
}

/* ---- button-group ---- */

.button-group:after {
  content: '';
  display: block;
  clear: both;
}

.button-group .button {
  float: left;
  border-radius: 0;
  margin-left: 0;
  margin-right: 1px;
  font-size: 12px;
}

.button-group .button:first-child { border-radius: 0.5em 0 0 0.5em; }
.button-group .button:last-child { border-radius: 0 0.5em 0.5em 0; }

/* ---- grid ---- */

.grid {

  overflow: scroll;
    height: 100vh !important;
}

/* clear fix */
.grid:after {
 
}

/* ---- .element-item ---- */

.element-item {

}

.element-item > * {
  margin: 0;
  padding: 0;
}

.element-item .name {

}

.element-item .symbol {

}

.element-item .number {
  position: absolute;
  right: 8px;
  top: 5px;
}

.element-item .weight {
  position: absolute;
  left: 10px;
  top: 76px;
  font-size: 12px;
}
</style>
<body>
<?php include("common/menu.php")?>
<!---side nav bar end-->
<?php include("common/tittle.php")?>
       
            <!--Nav menu end-->

            <!--Main body Start-->
            <div id="accordions" class="col-sm-12  mt-2">
              
      <center>

      
      </center> 
      <hr class="bg-success">




                <!--search section end-->
                <!--Orders start-->

                <!--order-items-->
                <!--order-items-one-->
               <div style="background-color: white;" id="collapseOne" class="orders  " data-parent="#accordions">
                    <h5 class="text-center">Track Orders</h5>
                    <a style="font-size:12px;" href="track_status" class="btn m-2 btn-outline-success"> <i class="fa fa-refresh" aria-hidden="true"></i></a>
                    <div class=" grid row no-gutters " >
                   

                <?php 

$sql2="SELECT * FROM currency ";
$result2 = mysqli_query($conn,$sql2)or die( mysqli_error($conn));
$row2=mysqli_fetch_array($result2) ;
$currency=$row2['curency'];
$date=date("F j, Y");
                $sql="select * from orders_details where date='$date'  order by date desc  ";
                $result = mysqli_query($conn,$sql)or die( mysqli_error($conn));
                while ($row=mysqli_fetch_array($result)) {
                $order_id=$row['orderid'];
                $item_id=$row['id'];
                $status=$row['status'];
                    $real_id=substr($order_id,-2);
                    $ord = sprintf('%03d',$real_id);

                    if ($status==1) {
                    $btn='btn-success';
                    $text='Ready';
                    }
                    elseif ($status==2) {
                      $btn='btn-secondary';
                      $text='Canceled';
                    }
                    else{
                      $btn='btn-warning';
                      $text='Cooking';
                    }


                ?>
                
              <!--menu items 1-->
                        <div style="display:<?php echo  $prepare_order_r ." ". $prepare_order_b ?>;" id="pizza" class=" col-sm-2 col-4 m-1 menu-items-order-managment   element-item transition  <?php echo $location ?> ">
                            <h4 style="font-size:30px;"class="text-center">#<?php echo $ord?></h4>
                            <hr class="bg-success">
                            <a style="border-radius: 5px ;" type="button" class="btn <?php echo $btn?> text-white btn-block p-2"> <span class="m-1"><?php echo $text?></span></a>

                        </div>
    
                   <?php } ?>
 
    
    
<!-- Small modal -->
<div id="dataModal"  class="modal fade bd-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div id="employee_detail" class="modal-content text-dark">
     
    
    
    </div>
  </div>
</div>

                        
                        
                    </div>
    

                </div>


 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>
<script>
 
// quick search regex
var qsRegex;
var buttonFilter;

// init Isotope
var $grid = $('.grid').isotope({
  itemSelector: '.element-item',
  layoutMode: 'fitRows',
  filter: function() {
    var $this = $(this);
    var searchResult = qsRegex ? $this.text().match( qsRegex ) : true;
    var buttonResult = buttonFilter ? $this.is( buttonFilter ) : true;
    return searchResult && buttonResult;
  }
});

$('#filters').on( 'click', 'button', function() {
  buttonFilter = $( this ).attr('data-filter');
  $grid.isotope();
});

// use value of search field to filter
var $quicksearch = $('#quicksearch').keyup( debounce( function() {
  qsRegex = new RegExp( $quicksearch.val(), 'gi' );
  $grid.isotope();
}) );


  // change is-checked class on buttons
$('.button-group').each( function( i, buttonGroup ) {
  var $buttonGroup = $( buttonGroup );
  $buttonGroup.on( 'click', 'button', function() {
    $buttonGroup.find('.is-checked').removeClass('is-checked');
    $( this ).addClass('is-checked');
  });
});
  

// debounce so filtering doesn't happen every millisecond
function debounce( fn, threshold ) {
  var timeout;
  threshold = threshold || 100;
  return function debounced() {
    clearTimeout( timeout );
    var args = arguments;
    var _this = this;
    function delayed() {
      fn.apply( _this, args );
    }
    timeout = setTimeout( delayed, threshold );
  };
}




</script>

     <script>
     

       $(document).ready(function(){
setInterval(function(){
      $(".order_auto").load(window.location.href + " .order_auto" );
}, 3000);
});

     $(document).ready(function(){  
      $('.view_data').click(function(){  
           var employee_id = $(this).attr("id");  
           $.ajax({  
                url:"cancel_order_reason.php",  
                method:"post",  
                data:{employee_id:employee_id},  
                success:function(data){  
                     $('#employee_detail').html(data);  
                     $('#dataModal').modal("show");  
                }  
           });  
      });  
 });  
</script>
</body>

</html>