@extends('layouts.default')
@section('header-links')
@include('accounts.reports.management.selector')
@endsection

@section('title', __('Management Reports'))

<link rel="stylesheet" href="{{ ('/acs/reports/style.css') }}">

@section('content')

<div class="container-fluid">
    <div class="row" id="pageContent">
      @include('accounts.reports.management.employees')
    </div>
</div>

<!-- MIS REPORT DATA TABLE JS STARTS -->
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/fixedcolumns/3.2.4/js/dataTables.fixedColumns.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/fixedheader/3.1.3/js/dataTables.fixedHeader.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
      var table = $('#horizontalTable').DataTable( {
         // scrollY:        "390px",
          scrollX:        true,
          scrollCollapse: true,
          paging:         true,
          fixedColumns:   {
              leftColumns: 1,
              rightColumns: 1
          },
          fixedHeader: {
              header: true
              // footer: true
          }
      } );
    } );
    $(document).ready(function() {
      var table = $('#verticleTable').DataTable( {
         // scrollY:        "390px",
          scrollX:        true,
          scrollCollapse: true,
          paging:         true,
          fixedColumns:   {
              leftColumns: 1,
              rightColumns: 1
          },
          fixedHeader: {
              header: true
              // footer: true
          }
      } );
    } );
</script>
<!-- MIS REPORT DATA TABLE JS ENDS -->
@endsection