@extends('layouts.app')

@section('title')
  
 
@stop

@section('breadcrumb')
<ol class="breadcrumb pull-right no-print">
        <li><a href="{{route('home')}}"><i class="fa fa-dashboard"></i> Home</a></li>

        <li class="active">Employees Attendance</li>
      </ol>
@stop

@section('css')

<style type="text/css">
  
  .fa{

    font-size: 19px !important;
  }
</style>

<link href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/buttons/1.7.0/css/buttons.dataTables.min.css"  rel="stylesheet">

<style>

.us_sty
{
  position: relative;
    top: 9rem;
    z-index: 999;
}
table.dataTable thead .sorting_asc {
    background-image: none !important;
}

.table.dataTable, table.dataTable {
    width: 99.8%!important;
}

#myTable tbody tr td {
    text-align: left;
}

@media print {
  .atten-div {
    margin-top: -15rem !important; 
  }
}
@media print {
  .mon-year {
    margin-top: -3rem !important; 
  }
} 

</style>

@stop
 
@section('content')


            <div class="container-fluid" >
                <!-- /row -->
                <div class="row">

                    <div class="col-sm-12">
                        <div class="white-box" id="printableSection">
                           <div class="col-sm-12" style="text-align:right;">
                            <a class="btn btn-info avoid-this" id="print" style="margin-top: 1rem; background: #167ab3" href="#">Print</a>
                           </div>
                            @if(Session::has('success'))   
                            <div id="successMessage" class="alert alert-success" role="alert">
                            {{ Session::get('success') }}
                            </div>
                            @endif
                            <center><h6 class="box-title"> Monthly Attendance Report</h6></center>
                            
                            <div class="col-lg-6">
                              <h4 style="color: black;">{{ucfirst($HrmEmployees->name)}}</h4>  
                            </div>
                            <div class="col-lg-6 mon-year" style="text-align: right;">

                              <h4 class="mon-year" style="color: black">{{  date('F', mktime(0, 0, 0, $month, 10))  }}, {{$year_}}</h4>
                            </div>
                            <div class="col-lg-6" style="text-align: right;">
                              
                            </div>
                            
                            
                            <div class="col-lg-12 no-print">
                              <form method="GET" style="margin-top: -7rem;" action="{{ route('detail.employee.attendance' , [$HrmEmployees->id]) }}">
                          
                              <input type="hidden" name="employee_id" value="{{$HrmEmployees->id}}">
                              <div class="row">

                                <div class="col-sm-4">
                                  <div class="form-group us_sty">
                                <label for="recipient-name" class="col-form-label">Month:</label>
                                <select id="month" class="form-control " name="month">
                                
                                  <option   value="1">January</option>
                                  <option  value="2">February</option>
                                  <option  value="3">March</option>
                                  <option  value="4">April</option>
                                  <option  value="5">May</option>
                                  <option  value="6">June</option>
                                  <option  value="7">July</option>
                                  <option  value="8">August</option>
                                  <option  value="9">September</option>
                                  <option  value="10">October</option>
                                  <option  value="11">November</option>
                                  <option  value="12">December</option>>
                                </select>
                                </div>
                              </div> 

                               <div class="col-sm-4">
                                  <label for="recipient-name" class="col-form-label us_sty">Year:</label>
                                  <select class="form-control us_sty" name="year">
                                                                    <option