@extends('admin.layout.master')
@section('home')

    <style>
        .table td, .table th {
            padding: .3rem;
            border: 1px solid rgb(0 0 0);
        }

        .table th {
            border-bottom: 1px solid rgb(0 0 0) !important;
        }

        .table-responsive {
            height: calc(100vh - 390px);
        }

        th {
            background: #007bff;
            color: white !important;
            position: sticky;
            top: 0;
            text-align: center;
        }

        table {
            position: relative;
            text-align: center;
        }

        td {
            color: black !important;
        }

        .table-bordered td, .table-bordered th {
            border: 1px solid #aaabab;
            padding: 5px;
        }
    </style>
    <div class="row">
        <div class="col-lg-12">
            <h4 class="card-title text-center">Employee Group Wise Attendance Report</h4>
            <div class="card-box">
                <div class="card-block">
                    <!-- Button trigger modal -->
                    @if (count($errors) > 0)
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                    <form action="{{route('emp_groupwise-attendance.search')}}" method="get">
                        <input type="hidden" name="attendance_type" id="attendance_type" value="2">
                        <div class='row'>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label>Emp Code</label>
                                    <select class="form-control input-sm code_live_search" name="emp_code"
                                            id="emp_code">
                                    </select>
                                </div>
                            </div>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label>Name</label>
                                    <select class="form-control input-sm name_live_search" name="emp_name"
                                            id="emp_name">
                                    </select>
                                </div>
                            </div>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label class="labels">Department</label>
                                    <select name="emp_department" id="emp_department" class="form-control input-sm">
                                        <option value="">--Select--</option>
                                        @if(!empty($department_lists))
                                            @foreach($department_lists as $depart_val)
                                                <option value="{{$depart_val->id}}">{{$depart_val->name}}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label class="labels">Employee Type</label>
                                    <select name="emp_types" id="emp_types" class="form-control input-sm">
                                        {{-- <option value="">--Select--</option>--}}
                                        @if(!empty($employee_types))
                                            @foreach($employee_types as $emp_type_val)
                                                <option value="{{$emp_type_val->id}}">{{$emp_type_val->name}}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label class="labels">Date From </label>
                                    <input type="text" class="datepicker form-control input-sm"
                                           name="date_from" id="date_from"
                                           value="@if(!empty($date_from)){{$date_from}}@else{{date('d-m-Y', strtotime("-1 months"))}}@endif">
                                </div>
                            </div>
                            <div class='col-md-3'>
                                <div class="form-group">
                                    <label class="labels">Date To</label>
                                    <input type="text" class="datepicker form-control input-sm"
                                           name="date_to" id="date_to"
                                           value="@if(!empty($date_to)){{$date_to}}@else{{date('d-m-Y')}}@endif">
                                </div>
                            </div>
                            <div class='col-md-2 mt-4'>
                                <button class='btn btn-sm btn-danger'>Search</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="col-sm-12 text-right">
                <button class="btn btn-sm text-center btn-info" onclick="PrintTable();">Print</button>
            </div>
            @include('payroll.includes.printAndExcel')
            <div class="table-responsive table2excel" id="print">
                 <span id="heading_name"><h4 class="text-center">Attendance For the Month
                    Of @if(!empty($start_date)){{date('d-m-Y',strtotime($start_date))}}
                         to {{date('d-m-Y',strtotime($end_date))}}@endif</h4></span>
                <table class="table table-bordered table-hover" id="attendance_table" style="overflow-x:auto;">
                    <thead>
                    <tr>
                        <th>Date</th>
                        @if(!empty($group_attendance))
                            @foreach($emp_info as $key=>$val)
                                                                <th class="text-center" colspan="2">{{$val[0]->get_emp_info->emp_name}} ({{$key}})</th>
                                                            @endforeach
                        @endif
                    </tr>
                    <tr>
                        <td></td>
                        @if(!empty($group_attendance))
                            @foreach($emp_info as $key=>$val)
                                                                <th class="text-center">In</th>
                                <th class="text-center">Out</th>
                                                            @endforeach
                        @endif
                    </tr>
                    </thead>
                    <tbody>
                    @if(!empty($group_attendance))
                        @foreach($group_attendance as $key=>$val)
                            <tr>
                                <td>{{date('Y-m-d',$key)}}</td>
                                @foreach($val as $attdn_key=>$attdn_val)
                                                                        <td>@if(!empty($attdn_val['in_time'])){{$attdn_val['in_time']}}@else{{'-'}}@endif</td>
                                    <td>@if(!empty($attdn_val['out_time'])){{$attdn_val['out_time']}}@else{{'-'}}@endif</td>
                                                                    @endforeach
                            </tr>
                        @endforeach
                    @endif
                    </tbody>
                </table>
                <br>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        function PrintTable() {
            var printWindow = window.open('', '', 'height=200,width=400');
            printWindow.document.write('<html><head><title>Table Contents</title><link href="{{ asset('/') }}assets/css/bootstrap.min.css" rel="stylesheet">');

            //Print the Table CSS.
            var table_style = document.getElementById("attendance_table").innerHTML;
            printWindow.document.write('<style>@page{size:landscape;}#print{font-size: 9px !important;}\n' +
                '    .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {\n' +
                '        padding: 1px;\n' +
                '        line-height: 1.428571;\n' +
                '        font-size: 11px !important;\n' +
                '        vertical-align: top;\n' +
                '        border: 1px solid black !important;\n' +
                '        text-align: center !important;\n' +
                '    }\n' +
                '    .sign{ width: 30%!important;}' +
                '    .table>thead>tr>th{ text-align: center !important;}' +
                '    .center_id{ text-align: center !important;}' +
                '</style>');
            printWindow.document.write('</head>');

            //Print the DIV contents i.e. the HTML Table.
            printWindow.document.write('<body>');
            var divContents = document.getElementById("print").innerHTML;
            printWindow.document.write(divContents);
            printWindow.document.write('</body>');

            printWindow.document.write('</html>');
            printWindow.document.close();
            printWindow.print();
        }
    </script>
@endsection