@include ('layouts.header')

<div class="container-fluid">
    <div class="card">
        <a href="{{ url('confirm_list') }}" class="btn btn-primary" target="_self">Confirmation</a>
        <a href="{{ url('index') }}" target="_self" class="cancel">Back</a>

           <div class="section-title">Team member List</div>
        <table class="table table-striped" id="total">
             <thead>
                <tr>
                    <th>SI No</th>
                    <th>EmployeeCode</th>
                    <th>EmployeeName</th>
                    <th>Designation</th>
                    <th>DateOfJoining</th>
                </tr>
            </thead>
     <tbody>
        @foreach($tm as $sn=>$tot)
        <tr><td>{{ $sn + 1 }}</td>
            <td>{{ $tot->EmployeeCode }}</td>
            <td>{{ $tot->EmployeeName }}</td>
            <td> {{ $tot->designation }}</td>
            <td>{{ \Carbon\Carbon::parse($tot->DateOfJoining)->format('d-M-Y') }}</td>
        </tr>
        @endforeach
        </tbody>
    </table>
    </div>
</div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link href="https://cdn.datatables.net/v/dt/dt-2.2.1/datatables.min.css" rel="stylesheet"> 
<script src="https://cdn.datatables.net/v/dt/dt-2.2.1/datatables.min.js"></script>

<script>
    $(document).ready(function e(){
       dataTable = $("#total").DataTable({
        });

          // Department dropdown filter
          $('#dept').on('change', function() {
            var dept = $(this).val();
            dataTable.column(3).search(dept).draw();
        });
    });
</script>
@include('layouts.footer')