@if(auth()->user()->hasPermissionTo('Leave - Manage Leaves'))
    @if(isset($employeeLeaves) && $employeeLeaves->isNotEmpty())
        <div class="card card-primary card-outline card-outline-tabs">
            <div class="card-body p-0" class="tab-content" id="custom-tabs-two-tabContent">
                @if(isset($employeeLeaves) && $employeeLeaves->isNotEmpty())
                    <div @if(isset($employeeLeaves) && $employeeLeaves->isNotEmpty()) class="tab-pane fade active show" @else class="tab-pane fade" @endif id="custom-tabs-employee" role="tabpanel" aria-labelledby="custom-tabs-employee-tab">
                        <div class="table-responsive">
                            <table class="table table-hover table-bordered fs-10">
                                <thead class="sticky-top shadow-sm">
                                    <tr>
                                        <th scope="col" style="width: 5%">{{ __('global.no') }}</th>
                                        <th scope="col" style="width: 10%">{{ __('leave.start_date') }}</th>
                                        <th scope="col" style="width: 10%">{{ __('leave.end_date') }}</th>
                                        <th scope="col" style="width: 5%">{{ __('leave.days') }}</th>
                                        <th scope="col" style="width: 10%">{{ __('leave.type') }}</th>
                                        <th scope="col" style="width: 20%">{{ __('leave.description') }}</th>
                                        <th scope="col" style="width: 10%">{{ __('leave.attachment') }}</th>
                                        <th scope="col" style="width: 10%">{{ __('leave.status') }}</th>
                                        <th scope="col" style="width: 15%">{{ __('leave.date') }}</th>
                                        <th colspan="3" style="text-align: center; width:5%;"><i class="bx bx-cog"></i></th>
                                    </tr>
                                </thead>

                                <tbody>
                                    @php $counter = ($employeeLeaves->currentPage() - 1) * $employeeLeaves->perPage() + 1; @endphp
                                    @foreach($employeeLeaves as $leave)
                                        <tr id="tr{{ $leave->id}}" class="v-align-middle">
                                            <th scope="row">
                                                <button type="button" class="btn btn-sm text-center @if($leave->status == 'pending') btn-warning @elseif($leave->status == 'declined') btn-danger @elseif($leave->status == 'archive') btn-secondary @else btn-success @endif">
                                                    {{$counter++}}
                                                </button>
                                            </th>
                                            <td>{{ getJalaliDate($leave->start_date) }}</td>
                                            <td>{{ getJalaliDate($leave->end_date) }}</td>
                                            <td>[{{ $leave->total_days}}]</td>
                                            <td>{{ $leave->leaveTypes->{'name_'.$lang} }}</td>
                                            <td>{{ $leave->description }}</td>
                                            <td>
                                                @if ($leave->attachment)
                                                    <a href="{{ asset('upload/documents/leave/'.$leave->attachment) }}" target="_blank">{{ $leave->attachment }}</a>
                                                @endif
                                            </td>
                                            <td>{{ $leave->status }}</td>
                                            <td>{{ getJalaliDate($leave->created_at) }}</td>
                                            <td>
                                                <a href="{{ route('show_leave', ['id'=> encryption($leave->id) ]) }}" class="text-white" target="_blank">
                                                    <button type="button" class="btn btn-success btn-sm viewButton">
                                                        <i class="fa fa-eye"></i>
                                                    </button>
                                                </a>
                                            </td>
                                            <td>
                                                <button type="button" class="btn btn-info btn-sm @if($leave->responsible_approval == null) editButton @endif" @if($leave->responsible_approval == null) data-bs-toggle="modal" data-bs-target="#editLeave" data-id={{ encryption($leave->id) }} @else disabled="disabled" @endif><i class="fa fa-pen"></i></button>
                                            </td>
                                            <td>
                                                <button type="button" class="btn btn-danger btn-sm @if($leave->responsible_approval == null) confirmationModal @endif" @if($leave->responsible_approval == null) data-id="{{ encryption($leave->id) }}" data-status="approve" data-lar="{{ route('delete_leave')}}" data-type="delete" data-title="{{ __('leave.delete_leave')}}" data-description="{{ __('leave.are_you_sure_want_to_delete')}}" data-request-action="delete" @else  disabled="disabled" @endif><i class="fa fa-trash"></i></button>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>

                            </table>
                        </div>

                        <div class="col-lg-12">
                            <x-pagination-links :paginator="$employeeLeaves" />
                        </div>
                    </div>
                @endif
            </div>
        </div>
    @else
        <div class="col-lg-12">
            <div class="mx-3">
                <x-record-not-found />
            </div>
        </div>
    @endif
@endif