<?php 
$page='order';
$page1='';
include('inc/sidebar.php') ;
if(isset($_GET["Order"])){
    $get_order= mysqli_fetch_array($con->query("SELECT * FROM `order` WHERE id='".$_GET["Order"]."'"));
    $get_user= mysqli_fetch_array($con->query("SELECT * FROM `users` WHERE id='".$get_order["user_id"]."'"));
    $get_store= mysqli_fetch_array($con->query("SELECT * FROM `store` WHERE id='".$get_order["store"]."'"));
}else{
    echo "<script type='text/javascript'>window.location=\"index.php\";</script>";  
}   
?>

<style>
.text-secondary-d1 {
    color: #728299!important;
}
.page-header {
    margin: 0 0 1rem;
    padding-bottom: 1rem;
    padding-top: .5rem;
    border-bottom: 1px dotted #e2e2e2;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
}
.page-title {
    padding: 0;
    margin: 0;
    font-size: 1.75rem;
    font-weight: 300;
}
.brc-default-l1 {
    border-color: #dce9f0!important;
}

.ml-n1, .mx-n1 {
    margin-left: -.25rem!important;
}
.mr-n1, .mx-n1 {
    margin-right: -.25rem!important;
}
.mb-4, .my-4 {
    margin-bottom: 1.5rem!important;
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0,0,0,.1);
}

.text-grey-m2 {
    color: #888a8d!important;
}

.text-success-m2 {
    color: #86bd68!important;
}

.font-bolder, .text-600 {
    font-weight: 600!important;
}

.text-110 {
    font-size: 110%!important;
}
.text-blue {
    color: #e02d0d!important;
}
.pb-25, .py-25 {
    padding-bottom: .75rem!important;
}

.pt-25, .py-25 {
    padding-top: .75rem!important;
}
.bgc-default-tp1 {
    background-color: rgb(224 45 13)!important;
}
.bgc-default-l4, .bgc-h-default-l4:hover {
    background-color: #f3f8fa!important;
}
.page-header .page-tools {
    -ms-flex-item-align: end;
    align-self: flex-end;
}

.btn-light {
    color: #757984;
    background-color: #f5f6f9;
    border-color: #dddfe4;
}
.w-2 {
    width: 1rem;
}

.text-120 {
    font-size: 120%!important;
}
.text-primary-m1 {
    color: #4087d4!important;
}

.text-danger-m1 {
    color: #dd4949!important;
}
.text-blue-m2 {
    color: #e12d0e!important;
}
.text-150 {
    font-size: 150%!important;
}
.text-60 {
    font-size: 60%!important;
}
.text-grey-m1 {
    color: #7b7d81!important;
}
.align-bottom {
    vertical-align: bottom!important;
}
.badge-alert{
    background: #ff8888;
}
#pdf-content{
    padding:80px;
}
.mt-20{
    margin-top:20px;
}
.mb-20{
    margin-bottom:20px;
}
    </style>
<!-- navbar-wrapper start -->
  <div class="body-wrapper">
    <div class="bodywrapper__inner">
        
        <div class="row">
        <div class="page-content container"id="pdf-content">
        <div class="page-header text-blue-d2">
            <h1 class="page-title text-secondary-d1">
                Invoice
                <small class="page-info">
                    <i class="fa fa-angle-double-right text-80"></i>
                    ID: INV000<?php echo $get_order['id'] ?>
                </small>
            </h1>

            <div class="page-tools">
                <div class="action-buttons">
                    <a id="btn-generate"class="btn bg-white btn-light mx-1px text-95" href="#" data-title="Print">
                        <i class="mr-1 fa fa-print text-primary-m1 text-120 w-2"></i>
                        Print
                    </a>
                </div>
            </div>
        </div>

        <div class="container px-0">
            <div class="row mt-4">
                <div class="col-12 col-lg-12">
                    <div class="row">
                        <div class="col-12">
                            <div class="text-center text-150 mb-20">
                                <span class="text-default-d3"><img src="<?php echo IMAGE_SITE_PATH.$logo_data['logo1']; ?>"style="width: 195px;"></span>
                            </div>
                        </div>
                    </div>
                    <!-- .row -->

                    <hr class="row brc-default-l1 mx-n1 mb-4" />

                    <div class="row">
                        <div class="col-sm-6"style="    line-height: 30px;">
                            <div>
                                <span class="text-sm text-grey-m2 align-middle">To:</span>
                                <span class="text-600 text-110 text-blue align-middle"><?php echo $get_user['name']; ?></span>
                            </div>
                            <div class="text-grey-m2">
                                <div class="my-1">
                                    <?php echo $get_user['address']; ?>
                                </div>
                                
                                <div class="my-1"><i class="fa fa-phone fa-flip-horizontal text-secondary"></i> <b class="text-600"><?php echo $get_user['phone']; ?></b></div>
                                <div class="my-1"><i class="fa fa-envelope fa-flip-horizontal text-secondary"></i> <b class="text-600"><?php echo $get_user['email']; ?></b></div>
                            </div>
                        </div>
                        <!-- /.col -->

                        <div class="text-95 col-sm-6 align-self-start d-sm-flex justify-content-end">
                            <hr class="d-sm-none" />
                            <div class="text-grey-m2"style="    line-height: 30px;">
                                <div class="mt-1 mb-2 text-secondary-m1 text-600 text-125">
                                    Invoice
                                </div>

                                <div class="my-2"><i class="fa fa-circle text-blue-m2 text-xs mr-1"></i> <span class="text-600 text-90">Booking ID:</span> <?php echo $get_order['orderID'] ?></div>
                                <div class="my-2"><i class="fa fa-circle text-blue-m2 text-xs mr-1"></i> <span class="text-600 text-90">ID:</span> INV000<?php echo $get_order['id'] ?></div>

                                <div class="my-2"><i class="fa fa-circle text-blue-m2 text-xs mr-1"></i> <span class="text-600 text-90">Issue Date:</span> <?php echo date("d M Y"); ?></div>

                                <div class="my-2"><i class="fa fa-circle text-blue-m2 text-xs mr-1"></i> <span class="text-600 text-90">Status:</span> <span class="badge badge-alert badge-pill px-25">Unpaid</span></div>
                            </div>
                        </div>
                        <!-- /.col -->
                    </div>

                    <div class="mt-4">
                        <div class="row text-600 text-white bgc-default-tp1 py-25">
                            <div class="d-none d-sm-block col-1">#</div>
                            <div class="col-3 col-sm-3">Brand Name</div>
                            <div class="d-none d-sm-block col-3 col-sm-3">Model Name</div>
                            <div class="d-none d-sm-block col-sm-3">Service Name</div>
                            <div class="col-2">Price</div>
                        </div>

                        <div class="text-95 text-secondary-d3">
                        <?php	
                            $sql= "SELECT * FROM `order_detail` WHERE order_id='".$get_order['id']."' ORDER BY id DESC";
                            $qry= mysqli_query($con,$sql);
                            while($data= mysqli_fetch_array($qry)) { 
                                $get_service= mysqli_fetch_array($con->query("SELECT * FROM `service` WHERE id='".$data["service_id"]."'"));
                        ?>
                            <div class="row mb-2 mb-sm-0 py-25"style="    border-bottom: 1px solid #dbdbdb;">
                                <div class="d-none d-sm-block col-1">1</div>
                                <div class="col-3 col-sm-3"><?php 
                                            $get_brand= mysqli_fetch_array($con->query("SELECT * FROM `brand` WHERE id='".$get_service["brand_id"]."'"));
                                            echo $get_brand['brand'];
                                        ?></div>
                                <div class="d-none d-sm-block col-3"><?php 
                                            $get_model= mysqli_fetch_array($con->query("SELECT * FROM `model` WHERE id='".$get_service["model_id"]."'"));
                                            echo $get_model['model'];
                                        ?></div>
                                <div class="d-none d-sm-block col-3 text-95"><?php echo $get_service['service_name']; ?></div>
                                <div class="col-2 text-secondary-d2"><?php echo '₹ '.number_format($get_service['price']);?></div>
                            </div>
                        <?php } ?>
                        </div>

                        <div class="row border-b-2 brc-default-l2"></div>
                        <div class="row mt-3">
                            <div class="col-12 col-sm-7 text-grey-d2 text-95 mt-2 mt-lg-0">
                                <h4>Extra note</h4>
                                <p><?php echo $get_order['notes'] ?></p>
                            </div>

                            <div class="col-12 col-sm-5 text-grey text-90 order-first order-sm-last">
                                <!-- <div class="row my-2">
                                    <div class="col-7 text-right">
                                        SubTotal
                                    </div>
                                    <div class="col-5">
                                        <span class="text-120 text-secondary-d1">$2,250</span>
                                    </div>
                                </div> -->
                                <?php  if(!empty($get_order['coupon_code'])){ ?>
                                <div class="row my-2">
                                    <div class="col-7 text-right">
                                        <h4>Discount</h4>
                                    </div>
                                    <div class="col-5">
                                        <span class="text-110 text-secondary-d1"><?php echo '₹ '.number_format($get_order['coupon_value']); ?></span>
                                    </div>
                                </div>
                                <?php } ?>
                                <div class="row my-2 align-items-center bgc-primary-l3 p-2">
                                    <div class="col-7 text-right">
                                        <h3>Total Amount</h3>
                                    </div>
                                    <div class="col-5">
                                        <span class="text-150 text-success-d3 opacity-2"><?php echo '₹ '.number_format($get_order['total_price']); ?></span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <hr />

                        <div>
                            <span class="text-secondary-d1 text-105">Thank you for your Booking </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
        </div>        
    </div>
</div>
</div>
</div>

<?php include('inc/footer.php') ?>
<script>
$(document).ready(function(){
	$("#btn-generate").click(function(){
		var htmlWidth = $("#pdf-content").width();
		var htmlHeight = $("#pdf-content").height();
		var pdfWidth = htmlWidth + (15 * 2);
		var pdfHeight = (pdfWidth * 1.5) + (15 * 2);
		
		var doc = new jsPDF('p', 'pt', [pdfWidth, pdfHeight]);
	
		var pageCount = Math.ceil(htmlHeight / pdfHeight) - 1;
	
	
		html2canvas($("#pdf-content")[0], { allowTaint: true }).then(function(canvas) {
			canvas.getContext('2d');
	
			var image = canvas.toDataURL("image/png", 1.0);
			doc.addImage(image, 'PNG', 15, 15, htmlWidth, htmlHeight);
	
	
			for (var i = 1; i <= pageCount; i++) {
				doc.addPage(pdfWidth, pdfHeight);
				doc.addImage(image, 'PNG', 15, -(pdfHeight * i)+15, htmlWidth, htmlHeight);
			}
			
		doc.save("invoice-INV000<?php echo $get_order['id'] ?>.pdf");
        location = 'index.php'
		});
	});
});
</script>