<?php 
session_start();
ob_start();
include('header.php');
include('connect.php');

?>
<!-- END nav -->
<style type="text/css">
	.cncl{
      border-radius: 6px;
      width: 100%;
      height: 36px !important;
      color: #ffffff !important;
  }
  .removed-item {
    -webkit-animation: removed-item-animation .8s cubic-bezier(.65,-0.02,.72,.29);
    -o-animation: removed-item-animation .8s cubic-bezier(.65,-0.02,.72,.29);
    animation: removed-item-animation .8s cubic-bezier(.65,-0.02,.72,.29)
}

@keyframes removed-item-animation {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    30% {
        opacity: 1;
        -webkit-transform: translateX(50px);
        -ms-transform: translateX(50px);
        -o-transform: translateX(50px);
        transform: translateX(50px)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateX(-800px);
        -ms-transform: translateX(-800px);
        -o-transform: translateX(-800px);
        transform: translateX(-800px)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-800px);
        -ms-transform: translateX(-800px);
        -o-transform: translateX(-800px);
        transform: translateX(-800px)
    }
}

@-webkit-keyframes removed-item-animation {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    30% {
        opacity: 1;
        -webkit-transform: translateX(50px);
        transform: translateX(50px)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateX(-800px);
        transform: translateX(-800px)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(-800px);
        transform: translateX(-800px)
    }
}

@-o-keyframes removed-item-animation {
    0% {
        opacity: 1;
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    30% {
        opacity: 1;
        -o-transform: translateX(50px);
        transform: translateX(50px)
    }

    80% {
        opacity: 1;
        -o-transform: translateX(-800px);
        transform: translateX(-800px)
    }

    100% {
        opacity: 0;
        -o-transform: translateX(-800px);
        transform: translateX(-800px)
    }
}
</style>
<div class="hero-wrap hero-bread" style="background-image: url('images/my-oder.jpg');">
  <div class="container">
    <div class="row no-gutters slider-text align-items-center justify-content-center">
      <div class="col-md-9 ftco-animate text-center">
       <p class="breadcrumbs"><span class="mr-2"><a href="index.php" class="text-white">Home</a></span> <span>Order Details</span></p>
       <h1 class="mb-0 bread">Order Details</h1>
   </div>
</div>
</div>
</div>

<section class="ftco-section ftco-cart">
   <div class="container-fluid">
    <div class="row">
       <div class="col-md-12 ftco-animate">
          <table class="table table-striped table-bordered align-middle" align="middle">
            <thead class="thead-primary text-white">
                <tr class="text-center">
                  <th>S.NO</th>
                  <th>Product Image</th>
                  <th>Product name</th>
                  <th>Price</th>
                  <th>Quantity</th>
                  <th>Status</th>
              </tr>
          </thead>
          <tbody>
              <?php $id=$_GET['id'];

              $quer="SELECT order_items.*,orders.delivery_charge FROM order_items LEFT JOIN orders ON orders.id=order_items.order_id Where order_items.order_id='$id' and order_id!='' ORDER BY `id` DESC";

              $res=mysqli_query($con,$quer);
              $num=mysqli_num_rows($res);
              $sub_total=0;
              $to_sub_total=0;
              $i=1;
              while($row=mysqli_fetch_array($res)){
                 mysqli_query($con,"DELETE FROM order_items WHERE product_variant_id=0 or quantity=0");
                 $pr_vr_id=$row['product_variant_id'];
                 $join="SELECT * FROM products INNER JOIN product_variant ON products.id = product_variant.product_id WHERE product_variant.id='$pr_vr_id'";
                 $res_join=mysqli_query($con,$join);
                 $row_join=mysqli_fetch_array($res_join);
                            // print_r($row_join);
                 $img=$row_join['image'];
                 ?>
                 <tr class="text-center">
                    <td><?=$i++;?></td>
                    <td><img src="admin/<?php echo $img; ?>" width="100px"></td>
                    <td class="product-name"><?php echo $row_join['name']; ?></td>
                    <td class="price">₹<?php if($row_join['discounted_price']!=0){echo $row_join['discounted_price']; } else{ echo $row_join['price']; } ?></td>
                    <td class="quantity"><?php echo $row['quantity']; ?></td>
                    <td><?php echo $row['active_status']; ?></td>
                </tr>
            <?php } ?>

        </tbody>
    </table>
</div>
</div>
</div>
</section>


<?php include('footer.php'); ?>



<!-- loader -->
<div id="ftco-loader" class="show fullscreen"><svg class="circular" width="48px" height="48px"><circle class="path-bg" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke="#eeeeee"/><circle class="path" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke-miterlimit="10" stroke="#F96D00"/></svg></div>


<script src="js/jquery.min.js"></script>
<script src="js/jquery-migrate-3.0.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.stellar.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/aos.js"></script>
<script src="js/jquery.animateNumber.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/scrollax.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBVWaKrjvy3MaE7SQ74_uJiULgl1JY0H2s&sensor=false"></script>
<script src="js/google-map.js"></script>
<script src="js/main.js"></script>

<script>

    function cncl(id){
     $.ajax({
      url:'add_to_cart.php',
      method:'post',
      data:{cncl:'cncl',id:id},
      success:function(data){
       window.location.href = "my_order.php";
   }
});
 }
</script>

</body>
</html>




</script>

<script type="text/javascript">
	$(document).ready(function() {

        var $deleteButton = $('.ion-ios-close');

        $deleteButton.on('click', function(event) {

            event.preventDefault();

            var $button = $(this);


            var $item = $button.closest('tr.text-center');
            var id=$(this).attr('data-title');
         //  alert(id);
            var itm_prc=$('.itm'+id).text();
            var sb_ttl=$('.sb_ttl').text();
            var new_sub_total=parseInt(sb_ttl)-parseInt(itm_prc);


            $item.addClass('removed-item')

            .one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(e) {

                $(this).remove();
                $('.sb_ttl').text(new_sub_total);
                $('.ttl').text(new_sub_total-3);
                $.ajax({
                  url:'add_to_cart.php',
                  method:'POST',
                  data:{remove:'remove',id:id},
                  success:function(data){
    // alert(data);
                  }
              })

            });


        });

    });
</script>