@extends('hr_main')
@section('title', '| Leave Status Report')

@section('stylesheets')

@endsection

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="viewTitle" style="border-bottom: 1px solid white;"> </div>
    </div>
    <div class="col-md-12">
        <div class="panel panel-default panel-border">
            <div class="panel-heading">
                <div class="panel-title">
                    {{ $pageTitle }}
                </div>
                <div class="panel-options pull-right">
                    <a href="{{ url($resetUrl) }}" class="btn btn-white">
                        <i class="fa fa-undo"></i></a>
                    <a class="btn btn-white" href="#" name="print" onclick="print()">
                        <i class="fa fa-print"></i></a>
                </div>
            </div>
            <div class="panel-body">
                <div class="row">
                    @include('hr.report.leaveDetails._filterForm',[ 'projects' => $projects ])
                </div>
                {{-- ./row --}}
                @if($isFilterFormSubmitted)
                <div class="row">
                    <div id='report-area'>
                        <div class="report-head text-center">
                            <div class="col-md-12">
                                <h1 class="report-title">{{ $company->name }}</h1>
                                <p class="report-sub-title" style="font-size: 1em; margin-bottom:0;">
                                    <u class="report-sub-title">{{ $reportTitle }}</u>
                                </p>
                                <div class="address">
                                    {{ $company->address }}
                                </div>
                                <div class="branch">
                                    @if($selectedBranch->id != '*')
                                    Branch : {{ $selectedBranch->name }}
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="report-body">
                            <div class="col-md-12">
                                @include('hr.report.leaveDetails._table')
                            </div>
                        </div>
                    </div>
                </div>
                @endif
            </div>
            {{-- ./panel-body --}}
        </div>
    </div>
    {{-- ./col-md-12 --}}
</div>
{{-- ./row --}}
@endsection

@section('footerAssets')
<script type="text/javascript">
    function print() {
        var mainContents = document.getElementById("report-area").innerHTML;
        var win = window.open('', 'printwindow');
        var printStyle = `<style>
            .report-title{
                font-size: 13px;
            }
            .report-sub-title{
                font-size:11px;
            } 
            .address{
                font-size: 10px;

            }
            .report-footer{
                font-size: 10px !important;
            }

            .branch{
                font-size: 10px !important; 
            }

            html,body{
                font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
            }

            table {
                font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
                border-collapse: collapse;
                width: 100%;
                font-size: 10px;
                margin: 0px;
            }

            td,  th {
                border: 1px solid #000;
                padding: 5px;
            }

            th {
                padding-top: 12px;
                padding-bottom: 12px;
                text-align: left;
                color: #000;
            }
            .text-right{
                text-align: right;
            }
            .text-center{
                text-align: center;
            }
            .page {
                page-break-after: always;
                page-break-inside: avoid;
            }
            .signature{
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-top: 60px;
                font-family: arial;
            }
        </style>`;
        var printContent = '<div>' + printStyle + mainContents + '</div>';
        win.document.write(printContent);
        win.print();
        win.close();
    }
</script>
@endsection