@extends('layouts.master')
@section('content')


<div class="app-page-title">
    <div class="page-title-wrapper">
        <div class="page-title-heading">
            <div class="page-title-icon">
                <i class="pe-7s-medal icon-gradient bg-tempting-azure"></i>
            </div>
            <div>
            {{ $title }}
                <div class="page-title-subheading">A list of employees linked to this payroll regardless of the status.</div>
            </div>

        </div>
        @include('layouts.payrollsubmenu')
    </div>

    @if(isset($error) || session('error'))
            <div class="alert alert-danger">
                {{ $error ?? session('error') }}
            </div>
        @endif
</div>
        <div class="main-card mb-3 card">
            <div class="card-body">
            <table style="width: 100%;" id="example32"
                        class="display nowrap table table-hover table-striped table-bordered">
                                   <thead>
                        <tr> 
                            <th></th>
                            <th>Man No.</th>
                            <th>First Name</th>
                            <th>Last Name</th>
                            <th>Status</th>
                            <th>Action</th>
                           
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($data as $item)
                            <tr>
                            <td></td>
                            <td style="text-align: left; width: 10%;">
                                    {{ $item->man_number }}</td>
                                <td style="text-align: left; width: 25%;">
                                    {{ $item->first_name }}</td>

                                <td style="text-align: left; width: 25%;">
                                    {{ $item->last_name }}</td>
                                <td style="text-align: left; width: 5%;">
                                    {{ $item->status }}</td>
                                <td style="text-align: right; width: 40%;">
                           
                                    @canany('Manage employees')

                                    <a href="{{ route('pam-emps.show', $item->id) }}"
                                                class="btn cur-p btn btn-primary btn-color">View Employee</a>
                                 
                                        <a href="{{ route('pam-emps.edit', $item->id) }}"
                                                class="btn cur-p btn btn-success btn-color">Edit Employee</a>
                                    @endcanany
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>

        @endsection
@section('scripts')


<script>

$(document).ready(function (){
   var table = $('#example32').DataTable({
   
      'columnDefs': [
         {
            'targets': 0,
            'checkboxes': {
               'selectRow': true
            }
         }
      ],
      'select': {
         'style': 'multi'
      },
      'order': [[1, 'asc']]
   });


   // Handle form submission event
   $('#frm-example').on('submit', function(e){
      var form = this;

      var rows_selected = table.column(0).checkboxes.selected();

      // Iterate over all selected checkboxes
      $.each(rows_selected, function(index, rowId){
         // Create a hidden element
         $(form).append(
             $('<input>')
                .attr('type', 'hidden')
                .attr('name', 'id[]')
                .val(rowId)
         );
      });
   });
});
</script>
@endsection