@extends('app')

@section('content')

    <style type="text/css">
        @media print {
            .print-btn {
                display: none;
            }

            .non-pad-print-btn {
                display: none;
            }

            footer {
                display: none;
            }

            .col-print-1 {
                width: 8%;
                float: left;
            }

            .col-print-2 {
                width: 16%;
                float: left;
            }

            .col-print-3 {
                width: 25%;
                float: left;
            }

            .col-print-4 {
                width: 33%;
                float: left;
            }

            .col-print-5 {
                width: 42%;
                float: left;
            }

            .col-print-6 {
                width: 50%;
                float: left;
            }

            .col-print-7 {
                width: 58%;
                float: left;
            }

            .col-print-8 {
                width: 66%;
                float: left;
            }

            .col-print-9 {
                width: 75%;
                float: left;
            }

            .col-print-10 {
                width: 83%;
                float: left;
            }

            .col-print-11 {
                width: 92%;
                float: left;
            }

            .col-print-12 {
                width: 100%;
                float: left;
            }
        }

        @page {
            size: auto;
            margin: 0mm;
        }
        .search {
            padding-top: 26px;
        }

    </style>
    <!-- Main content -->

    <section class="content">
        <a href="#" class="btn btn-primary print-btn pull-right full-print"><i class="fa fa-print"></i>
            Pad Print &nbsp; &nbsp;</a>

        {{-- <a href="#" class="btn btn-primary print-btn pull-right half-print"><i class="fa fa-print"></i>
          Pad Half Print &nbsp; &nbsp;</a> --}}
        <a href="#" class="btn btn-primary non-pad-print-btn pull-right"><i class="fa fa-print"></i>
            Non Pad Print &nbsp; &nbsp;</a>

    {{-- <a href="{{route('reports.diagnostic-test-report')}}" class="btn btn-success print-btn pull-right"><i
                class="fa fa-print"></i> Go Back </a> --}}
    <!-- title row -->
        <div class="report-print" style="margin-left: 0.8in; margin-right: 0.8in;">

            <div class="non-pad" style="display: none">
                <div class="row">
                    <div class="col-md-2 col-print-2 invoice-col">
                        <h2 class="">
                            <img src="{{asset('').'/'.$hospital->logo}}"
                                 style="padding-left: 16px;">
                        </h2>
                    </div>

                    <div class="col-md-10 col-print-10 invoice-col hospital-name text-center">
                        <h3>{{$hospital->name}}</h3>
                        <address>
                            {{$hospital->address}}<br>
                            Phone: {{$hospital->phone}}<br>
                        </address>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <h3 style="text-align: center;">Date Wise Sale Reports</h3>
                    <h5 style="text-align: center;">({{Carbon\Carbon::parse($from)->format('d/m/Y')}} to {{Carbon\Carbon::parse($to)->format('d/m/Y')}})</h5>
                    <form method="GET" action="#" id="custom_search_form" class="no-print" role="form">

                                <div class="row">

                                    <div class="col-md-3 form-group">
                                        <label for="email" class="control-label">Start date</label>
                                        <input class="form-control datepicker" value="{{request('start_date')}}"
                                            id="start_date"
                                            type="text"
                                            placeholder="Start Date"
                                            autocomplete="off"
                                            name="start_date">
                                    </div>

                                    <div class="col-md-3 form-group">
                                        <label for="pwd" class="control-label">End date</label>
                                        <input class="form-control datepicker" value="{{request('end_date')}}" id="end_date"
                                            type="text"
                                            placeholder="End Date"
                                            autocomplete="off"
                                            name="end_date">
                                    </div>
                                    <div class="col-md-3 form-group search">
                                            <button class="btn btn-info" type="submit">Search</button>
                                    </div>
                                </div>
                    </form>
                    <table class="table table-bordered table-striped">
                        <caption>Date: {{date('d/m/Y')}}</caption>
                        <tbody>
                        <tr>
                            <td>Patients</td>
                            <td>{{$todaysPatients}}</td>
                        </tr>
                        <tr>
                            <td>Sale</td>
                            <td>{{$todaysSales}}</td>
                        </tr>
                        <tr>
                            <td>Paid</td>
                            <td>{{$todaysPaid}}</td>
                        </tr>
                        <tr>
                            <td>Due</td>
                            <td>{{$todaysDues}}</td>
                        </tr>
                        <tr>
                            <td>Discount</td>
                            <td>{{$todaysSaleDiscount}}</td>
                        </tr>
                        <tr>
                            <td>Doctor Commission</td>
                            <td>{{$todaysDoctorCommission}}</td>
                        </tr>
                        <tr>
                            <td>Refund</td>
                            <td>{{$todaysRefund}}</td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr>
                            <td>Total Income</td>
                            <td>{{$todaysIncome - $todaysExpense}}</td>
                        </tr>
                        <tr>
                            <td>Total Expense</td>
                            <td>{{$todaysExpense}}</td>
                        </tr>
                        <tr>
                            <td>Balance</td>
                            <td>{{$todaysIncome - $todaysExpense}}</td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>   
        </div>
    </section>
@endsection

@section('script')
    <script type="text/javascript">

        $('.half-print').on('click', function () {
            $('.content').attr('style', 'width:50%;float:right;padding-top:212px;');
            $('.img-responsive').attr('style', 'width:50%;');
            $('.non-pad').attr('style', 'display:none;');
            window.print();
        });

        $('.full-print').on('click', function () {
            $(".report").css({"padding-top": "142px"});
            $('.content').attr('style', 'width:100%;padding-top:212px;');
            $('.img-responsive').attr('style', 'width:25%;');
            $('.non-pad').attr('style', 'display:none;');
            window.print();
        });

        $('.non-pad-print-btn').on('click', function () {
            $(".report").css({"padding-top": "0px"});
            $('.content').attr('style', 'width:100%;padding-top:20px;');
            $('.img-responsive').attr('style', 'width:25%;');
            $('.non-pad').attr('style', 'display:blok;');
            window.print();
        });

        $('.custom-print').on('click', function () {
            window.print();
        });

    </script>
@endsection