@extends('layouts.master')

@section('title','Print Waybills')
@section('main_item','Orders')
@section('sub_item','Print Waybills')

@section('content')
<style>
.top{
    border-top-style: solid;
}
.bottom{
    border-bottom-style: solid;
}
.left{
    border-left-style: solid;
}
.right{
    border-right-style: solid;
}

</style>
<div class="col-lg-12">
    <button class="btn btn-primary mb-3" id="print-div">Print Waybill</button>
    <a href="{{route('pendings.index')}}">
        <button class="btn btn-warning mb-3">Go Back</button>
    </a>
</div>
<div id="print" class="row">

        @foreach ($waybill_data as $data)
        <div class="col-4 mb-2 mr-1" style="border-style: solid;">
            <div class="row">
                <div class="col-1 mr-5">
                        <img src="{{asset('img/logo.png')}}" alt="" width="115px">
                </div>
                <div class="col-7 ml-5">
                        <h3 class="font-weight-bold mb-n2">KINGDOM OF RINGS</h3><br>
                        <span>ELATHOTA ROAD, BALAPITIYA</span><br>
                        <span>0777 408 506  | facebook.com/KindomOfRings</span>
                </div>
                <div class="col-12 mb-2">
                        <div class="text-center top">
                                <span class="font-weight-bold text-center">CUSTOMER DETAILS</span>
                        </div>
                        <div class="mt-1">
                            <span class="font-weight-bold text-center ml-3">CUSTOMER NAME: </span>
                            <span>{{$data['customer_name']}}</span>
                            <br>
                            <span class="font-weight-bold text-center ml-3">ADDRESS: </span>
                        <span>{{$data['landmark']}}</span><span>, </span>
                            <span>{{$data['city']}}</span>
                            <br>
                            <span class="font-weight-bold text-center ml-3">PHONE NO: </span>
                            <span>{{$data['mobile']}}, {{$data['mobile_2']}}</span>
                        </div>
                </div>
                <div class="col-12">
                    <div class="text-center top">
                        <h3 class="font-weight-bold">COD AMOUNT : {{number_format($data['cod_amount'],2)}}</h3>
                    </div>
                </div>
                <div class="col-12">
                    <div class="top text-center pt-3 pb-3">
                            <img src="data:image/png;base64,{{DNS1D::getBarcodePNG($data['waybill_no'], 'C128',4,77)}}" alt="barcode" />
                            <br>
                            <span>{{$data['waybill_no']}}</span>
                    </div>
                </div>
                <div class="col-12">
                    <div class="top text-center pt-1 pb-1">
                        <h5>WAYBILL : {{$data['waybill_no']}}</h5>
                    </div>
                </div>
            </div>
        </div>
        @endforeach
</div>
<div id="editor"></div>
@endsection
@section('scripts')
<script>
    $("#print-div").click(function() {
        var printContents = document.getElementById('print').innerHTML;
        var originalContents = document.body.innerHTML;
        document.body.innerHTML = printContents;
        window.print();
        document.body.innerHTML = originalContents;
    })
</script>
@endsection