@extends('admin.layouts.app')

@section('title', 'Attendance Report')

@section('content')
<h4 class="font-weight-bold py-3 mb-0">Attendance Report</h4>

<div class="card" style="padding-right:10px;padding-left:10px;">
  <div id="accordion2">
    <div class="card mb-2">
      <div id="accordion2-2" class="collapse show" data-parent="#accordion2">
        <div style="padding:5px;">
          <form id="validation-form" method="post" action="{{ route('admin.reports.attendance') }}">
            @csrf
            <div class="form-row">
              <div class="form-group col-md-4">
                <label class="form-label">Employee</label>
                <select class="select2-demo form-control" name="ExeId" id="ExeId">
                  <option value="all" @selected($filters['ExeId'] === 'all')>All</option>
                  @foreach ($executives as $executive)
                    <option value="{{ $executive->id }}" @selected((string) $filters['ExeId'] === (string) $executive->id)>
                      {{ $executive->Fname }} {{ $executive->Lname }}
                    </option>
                  @endforeach
                </select>
              </div>

              <div class="form-group col-md-2">
                <label class="form-label">From Date </label>
                <input type="date" name="FromDate" id="FromDate" class="form-control" value="{{ $filters['FromDate'] }}" autocomplete="off">
              </div>
              <div class="form-group col-md-2">
                <label class="form-label">To Date</label>
                <input type="date" name="ToDate" id="ToDate" class="form-control" value="{{ $filters['ToDate'] }}" autocomplete="off">
              </div>
              <input type="hidden" name="Search" value="Search">
              <div class="form-group col-md-1" style="padding-top:30px;">
                <button type="submit" name="submit" class="btn btn-primary btn-finish">Search</button>
              </div>
              @if ($searched)
              <div class="col-md-1">
                <label class="form-label d-none d-md-block">&nbsp;</label>
                <a href="{{ route('admin.reports.attendance') }}" class="btn btn-info btn-block" data-toggle="tooltip" title="Clear Filter">X</a>
              </div>
              @endif
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>

  @if ($searched)
  <div class="card-datatable">
    <table id="example" class="table table-striped table-bordered" style="width:100%">
      <thead>
        <tr>
          <th>Emp ID</th>
          <th>Employee Name</th>
          @foreach ($dates as $d)
            <th>{{ date('d/m', strtotime($d)) }}</th>
          @endforeach
          <th>Total Days</th>
          <th>Present</th>
          <th>Week Off</th>
          <th>Absent</th>
        </tr>
      </thead>
      <tbody>
        @foreach ($rows as $row)
          <tr>
            <td>{{ $row['emp_id'] }}</td>
            <td>{{ $row['name'] }}</td>
            @foreach ($dates as $dt)
              @php $mark = $row['cells'][$dt] ?? 'A'; @endphp
              @if ($mark === 'P')
                <td style="background:#b0ffb0;text-align:center;">P</td>
              @elseif ($mark === 'W')
                <td style="background:#cce5ff;text-align:center;">W</td>
              @else
                <td style="background:#ffb0b0;text-align:center;">A</td>
              @endif
            @endforeach
            <td style="background:#e3e3e3;text-align:center;font-weight:bold;">{{ $row['total'] }}</td>
            <td style="background:#d4edda;text-align:center;font-weight:bold;">{{ $row['present'] }}</td>
            <td style="background:#cce5ff;text-align:center;font-weight:bold;">{{ $row['week_off'] }}</td>
            <td style="background:#f8d7da;text-align:center;font-weight:bold;">{{ $row['absent'] }}</td>
          </tr>
        @endforeach
      </tbody>
    </table>
  </div>
  @endif
</div>
@endsection

@push('scripts')
<script type="text/javascript">
$(document).ready(function() {
  if ($('#example').length) {
    $('#example').DataTable({
      responsive: false,
      order: [[1, "asc"]],
      pageLength: 25,
      dom: 'Bfrtip',
      buttons: [
        {
          extend: 'excelHtml5',
          title: 'Attendance_Report',
          text: '<i class="fa fa-file-excel"></i> Excel',
          className: 'btn btn-success btn-sm'
        }
      ]
    });
  }
});
</script>
@endpush