@extends('layouts.app')
@section('title')
Payment Receipt 
@stop
@section('css')
<style type="text/css">
@media print {
    
    .white-box{
        border: none!important;
    }
    
    .container-fluid{
        text-transform: uppercase !important;
    }
    .mt-bt{
        margin-top: 30px;
    }
    .table>tbody>tr>td{
        padding-bottom: 8px;
    }
    }
</style>
@stop

@section('content')

<div class="container-fluid">
    <div class=" row printableArea">
    <header class="clearfix">
        <div class="white-box">
            <div class="col-sm-7 col-xs-7">
             &nbsp;
            </div>
            <div class="col-sm-5 col-xs-5 text-right ">
                <div class="col-sm-8 col-xs-8 text-right">
                    <span>sr1233456</span><br>
                    <span>25-03-2020</span>
                </div>
                <div class="col-sm-4 col-xs-4">
                <img width="70px" height="70px" src="{{public_path('plugins/images/hmLogo.png')}}" class="hm-logo"> 
                </div>
            </div>
    </header>
    </div>
     <div class="row">
                    <div class="col-sm-12">
                        <div class="white-box">
                            <div class="col-xs-6">
                                <div class="table-responsive">
                                        <table class="table">
                                            <tbody>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>Nadeem Akhter</td>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td> Reg 213</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>clint123</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>15874-3658963-8</td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>F<span style="margin-left: 21%;">77</span></td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>Residential</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                            </div>
                            <div class="col-xs-6">
                                <div class="table-responsive">
                                        <table class="table">
                                            <tbody>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>Rs125225/-</td>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td> Rs25322552/-</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>One million and two million</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>&nbsp; six million only</td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>Rs1236555/-</td>
                                                </tr>
                                                
                                                
                                            </tbody>
                                        </table>
                                    </div>
                            </div>
                                <div class="col-xs-12">
                                <span style="margin: 0 15% 0 15%;">Nasir Khan</span><span>Bank Deposit</span>
                            </div>    

                        </div>
                    </div>
                </div>
     <header class="clearfix mt-bt">
        <div class="white-box">
            <div class="col-sm-7 col-xs-7 ">
             &nbsp;
            </div>
            <div class="col-sm-5 col-xs-5 text-right ">
                <div class="col-sm-8 col-xs-8">
                    <span>sr1233456</span><br>
                    <span>25-03-2020</span>
                </div>
                <div class="col-sm-4 col-xs-4">
                <img width="70px" height="70px" src="{{public_path('plugins/images/hmLogo.png')}}" class="hm-logo"> 
                </div>
            </div>
        </div>
    </header>
    <div class="row">
       
                    <div class="col-sm-12">
                        <div class="white-box">
                            <div class="col-xs-6">
                                <div class="table-responsive">
                                        <table class="table">
                                            <tbody>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>Nadeem Akhter</td>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td> Reg 213</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>clint123</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>15874-3658963-8</td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>F<span style="margin-left: 21%;">77</span></td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>Residential</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                            </div>

                            <div class="col-xs-6">
                                <div class="table-responsive">
                                        <table class="table">
                                            <tbody>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>Rs125225/-</td>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td> Rs25322552/-</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>One million and two million</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="1">&nbsp;</td>
                                                    <td>&nbsp; six million only</td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                    <td>Rs1236555/-</td>
                                                </tr>
                                                
                                                
                                            </tbody>
                                        </table>
                                    </div>
                            </div>
                                    
                            <div class="col-xs-12">
                                <span style="margin: 0 15% 0 15%;">Nasir Khan</span><span>Bank Deposit</span>
                            </div>
                        </div>
                    </div>
                </div>
   
</div>
    <div style="display: inline-block;    margin-bottom: 70px;">
     <div class="text-right" style="display: inline-block;">
        <button  class="btn btn-default btn-outline no-print" onclick="window.print();return false;" type="button"> <span><i class="fa fa-print"></i> Print</span> </button>
    </div>
</div>
</div>
<!-- /.container-fluid -->



@stop

@section('js')
<script src="{{asset('js/jquery.PrintArea.js')}}" type="text/JavaScript"></script>
<script>
$(function () {
    $("#print").on("click", function () {
        var mode = 'iframe'; //popup
        var close = mode == "popup";
        var options = {
            mode: mode,
            popClose: close
        };
        $("div.printableArea").printArea(options);
    });
});
</script>
<script>
    $('#example23').DataTable({
        dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ]
    });
</script>
@stop