@extends('admin.layouts.app')
@section('title',get_setting('site_name').' | Admin Dashboard')
@section('content')
    <style>
        .fc-day-grid-container {

            height: auto !important;
        }

        th {
            position: sticky;
        }

        .dashboard-attendance-row > [class*="col-"] {
            display: flex;
        }

        .dashboard-attendance-card {
            width: 100%;
            max-height: 680px;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }

        .dashboard-attendance-card .card-header {
            flex-shrink: 0;
        }

        .dashboard-attendance-card .card-body {
            display: flex;
            flex-direction: column;
            flex: 1 1 auto;
            min-height: 0;
            overflow: hidden;
        }

        .dashboard-attendance-table-wrap {
            height: 420px;
            max-height: 420px;
            overflow-x: auto;
            overflow-y: auto;
            flex-shrink: 0;
        }

        .dashboard-attendance-table-wrap thead th {
            position: sticky;
            top: 0;
            z-index: 2;
            background: #f8f9fa;
            box-shadow: inset 0 -1px 0 #dee2e6;
        }
    </style>

    <div class="row mt-3 mb-3">
        @if(\App\Support\BranchWiseFeature::missingBranchAssignment())
            <div class="col-12">
                <div class="alert alert-warning">{{ __('Your branch is not assigned. Contact HQ admin to assign a warehouse/branch.') }}</div>
            </div>
        @endif
        @php
            $todayAtt = $attDate ?? now()->toDateString();
            $dashboardStatRoutes = [
                'total' => route('staffs.index'),
                'active' => route('staffs.index'),
                'inactive' => route('inactive.staffs'),
                'present' => route('dashboard', ['att_date' => $todayAtt, 'daily_status' => 'P']).'#daily-attendance',
                'absent' => route('dashboard', ['att_date' => $todayAtt, 'daily_status' => 'A']).'#daily-attendance',
                'movement' => auth()->user()?->can('Visit-list')
                    ? route('admin.visit.application', ['movement_date' => $todayAtt, 'status' => '1'])
                    : null,
                'leave' => route('dashboard', ['att_date' => $todayAtt, 'daily_status' => 'L']).'#daily-attendance',
                'late' => route('dashboard', ['att_date' => $todayAtt, 'daily_status' => 'D']).'#daily-attendance',
                'Extra late' => route('dashboard', ['att_date' => $todayAtt, 'daily_status' => 'E']).'#daily-attendance',
            ];
            $inactiveSettlementPendingTotal = (int) ($statsInactiveSettlementPending['total'] ?? 0);
        @endphp
        @foreach([
            ['key' => 'total', 'label' => __('Total Employee'), 'icon' => 'fas fa-users', 'color' => 'text-dark', 'data' => $statsTotal],
            ['key' => 'active', 'label' => __('Active Employee'), 'icon' => 'fas fa-user-check', 'color' => 'text-success', 'data' => $statsActiveEmployees],
            ['key' => 'inactive', 'label' => __('Inactive Employee'), 'icon' => 'fas fa-user-slash', 'color' => 'text-danger', 'data' => $statsInactiveEmployees],
            ['key' => 'present', 'label' => __('Present'), 'icon' => 'fas fa-user-check', 'color' => 'text-success', 'data' => $statsPresent],
            ['key' => 'absent', 'label' => __('Absent'), 'icon' => 'fas fa-user-slash', 'color' => 'text-danger', 'data' => $statsAbsent],
            ['key' => 'movement', 'label' => __('Movement'), 'icon' => 'fas fa-running', 'color' => 'text-info', 'data' => $statsMovement],
            ['key' => 'leave', 'label' => __('Leave'), 'icon' => 'fas fa-procedures', 'color' => 'text-stat-leave', 'data' => $statsLeave],
            ['key' => 'late', 'label' => __('Late'), 'icon' => 'fas fa-clock', 'color' => 'text-warning', 'data' => $statsLate],
            ['key' => 'Extra late', 'label' => __('Extra Late'), 'icon' => 'fas fa-clock', 'color' => 'text-primary', 'data' => $statsExtra],
        ] as $stat)
            @php $statRoute = $dashboardStatRoutes[$stat['key']] ?? null; @endphp
            <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-12 mb-3">
                @if($statRoute)
                    <a href="{{ $statRoute }}" class="card dash-stat-card dash-stat-card--link h-100 text-decoration-none text-body">
                @else
                    <div class="card dash-stat-card h-100">
                @endif
                    <div class="card-body py-3">
                        <div class="d-flex align-items-center">
                            <div class="mr-3 {{ $stat['color'] }}" style="font-size: 2rem;">
                                <i class="{{ $stat['icon'] }}"></i>
                            </div>
                            <div class="flex-grow-1 text-right">
                                <h4 class="mb-0 {{ $stat['color'] }}">{{ $stat['data']['total'] }}</h4>
                                <p class="mb-1 font-13 font-weight-semibold">{{ $stat['label'] }}</p>
                                <p class="mb-0 stat-gender">
                                    {{ __('Male') }} : {{ $stat['data']['male'] }}
                                    {{ __('Female') }} : {{ $stat['data']['female'] }}
                                </p>
                                @if($stat['key'] === 'inactive')
                                    <p class="mb-0 mt-1 small text-warning font-weight-semibold">
                                        {{ __('Settlement pending') }} : {{ $inactiveSettlementPendingTotal }}
                                    </p>
                                @endif
                            </div>
                        </div>
                    </div>
                @if($statRoute)
                    </a>
                @else
                    </div>
                @endif
            </div>
        @endforeach
        @foreach($fundLoanCards as $loanCard)
            <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-12 mb-3">
                <a href="{{ $loanCard['route'] }}" class="card dash-stat-card dash-stat-card--link h-100 text-decoration-none text-body">
                    <div class="card-body py-3">
                        <div class="d-flex align-items-center">
                            <div class="mr-3 {{ $loanCard['color'] }}" style="font-size: 2rem;">
                                <i class="{{ $loanCard['icon'] }}"></i>
                            </div>
                            <div class="flex-grow-1 text-right">
                                <h4 class="mb-0">{{ $loanCard['value'] }}</h4>
                                <span class="font-13 font-weight-semibold text-muted">
                                    {{ $loanCard['label'] }} <i class="fas fa-arrow-right" style="font-size: 12px"></i>
                                </span>
                                <p class="mb-0 stat-gender">{{ $loanCard['sublabel'] }}</p>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
        @endforeach
    </div>

    @if(!empty($moduleMiniCards) || !empty($probationaryStaffCard))
        <div class="row mb-3">
            @foreach($moduleMiniCards as $mini)
                <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 mb-3">
                    @if(!empty($mini['route']))
                        <a href="{{ $mini['route'] }}" class="card h-100 dash-stat-card--link text-decoration-none text-body">
                    @else
                        <div class="card h-100">
                    @endif
                        <div class="card-body">
                            <div class="d-flex align-items-center">
                                <div class="mr-3" style="font-size: 2rem;">
                                    <i class="{{ $mini['icon'] }} {{ $mini['color'] }}"></i>
                                </div>
                                <div class="flex-grow-1 text-right">
                                    <h4 class="mb-0">{{ $mini['value'] }}</h4>
                                    <span class="text-muted" style="font-size: 13px;">
                                        {{ $mini['label'] }}
                                        @if(!empty($mini['route']))
                                            <i class="fas fa-arrow-right" style="font-size: 12px"></i>
                                        @endif
                                    </span>
                                </div>
                            </div>
                        </div>
                    @if(!empty($mini['route']))
                        </a>
                    @else
                        </div>
                    @endif
                </div>
            @endforeach

            @if(!empty($probationaryStaffCard))
                <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 mb-3">
                    <a href="{{ $probationaryStaffCard['route'] }}" class="card h-100 dash-stat-card--link text-decoration-none text-body">
                        <div class="card-body">
                            <div class="d-flex align-items-center">
                                <div class="mr-3" style="font-size: 2rem;">
                                    <i class="{{ $probationaryStaffCard['icon'] }} {{ $probationaryStaffCard['color'] }}"></i>
                                </div>
                                <div class="flex-grow-1 text-right">
                                    <h4 class="mb-0">{{ $probationaryStaffCard['value'] }}</h4>
                                    <span class="text-muted" style="font-size: 13px;">
                                        {{ $probationaryStaffCard['label'] }}
                                        <i class="fas fa-arrow-right" style="font-size: 12px"></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            @endif
        </div>
    @endif

    <div class="row mb-3">
        @foreach($secondaryMiniCards as $mini)
            <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 mb-3">
                @if(!empty($mini['route']))
                    <a href="{{ $mini['route'] }}" class="card h-100 dash-stat-card--link text-decoration-none text-body">
                @elseif(!empty($mini['modal']))
                    <button type="button" class="card h-100 w-100 text-left border-0 dash-stat-card--link p-0 bg-white"
                            data-toggle="modal" data-target="#{{ $mini['modal'] }}">
                @else
                    <div class="card h-100">
                @endif
                    <div class="card-body">
                        <div class="d-flex align-items-center">
                            <div class="mr-3" style="font-size: 2rem;">
                                <i class="{{ $mini['icon'] }} {{ $mini['color'] }}"></i>
                            </div>
                            <div class="flex-grow-1 text-right">
                                <h4 class="mb-0">{{ $mini['value'] }}</h4>
                                @if(!empty($mini['route']))
                                    <span class="text-muted" style="font-size: 13px;">
                                        {{ $mini['label'] }} <i class="fas fa-arrow-right" style="font-size: 12px"></i>
                                    </span>
                                @elseif(!empty($mini['modal']))
                                    <span class="text-muted" style="font-size: 13px;">
                                        {{ $mini['label'] }} <i class="fas fa-arrow-right" style="font-size: 12px"></i>
                                    </span>
                                @else
                                    <div class="text-muted" style="font-size: 13px;">{{ $mini['label'] }}</div>
                                @endif
                            </div>
                        </div>
                    </div>
                @if(!empty($mini['route']))
                    </a>
                @elseif(!empty($mini['modal']))
                    </button>
                @else
                    </div>
                @endif
            </div>
        @endforeach
    </div>

    <div class="row mb-3 dashboard-attendance-row">
        <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6" id="daily-attendance">
            <div class="card dashboard-attendance-card shadow-sm">
                <div class="card-header d-flex flex-wrap align-items-center justify-content-between py-3">
                    <h5 class="mb-0">{{ __('Daily Attendance') }}</h5>
                    <span class="text-muted small">{{ __('Date') }}: {{ $attDate }}</span>
                </div>
                <div class="card-body pt-3">
                    <form method="get" action="{{ route('dashboard') }}" class="mb-3 flex-shrink-0">
                        <div class="form-row align-items-end">
                            <div class="form-group col-6 col-md-4 col-lg-2 mb-2 mb-lg-0">
                                <label class="small text-muted mb-1">{{ __('Date') }}</label>
                                <input type="date" name="att_date" class="form-control form-control-sm"
                                       value="{{ $attDate }}">
                            </div>
                            <div class="form-group col-6 col-md-4 col-lg-2 mb-2 mb-lg-0">
                                <label class="small text-muted mb-1">{{ __('Attendance status') }}</label>
                                <select name="daily_status" class="form-control form-control-sm">
                                    <option value="">{{ __('All') }}</option>
                                    <option
                                        value="P" @selected(request('daily_status') === 'P')>{{ __('Present (P)') }}</option>
                                    <option
                                        value="D" @selected(request('daily_status') === 'D')>{{ __('Delay (D)') }}</option>
                                    <option
                                        value="E" @selected(request('daily_status') === 'E')>{{ __('Extra delay (E)') }}</option>
                                    <option
                                        value="A" @selected(request('daily_status') === 'A')>{{ __('Absent (A)') }}</option>
                                    <option
                                        value="L" @selected(request('daily_status') === 'L')>{{ __('Leave (L)') }}</option>
                                </select>
                            </div>
                            <div class="form-group col-12 col-md-4 col-lg-2 mb-2 mb-lg-0">
                                <label class="small text-muted mb-1">{{ __('Department') }}</label>
                                <select name="daily_department_id" class="form-control form-control-sm">
                                    <option value="">{{ __('All') }}</option>
                                    @foreach($departments as $dept)
                                        <option
                                            value="{{ $dept->id }}" @selected((string) request('daily_department_id') === (string) $dept->id)>{{ $dept->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            @unless(\App\Support\BranchWiseFeature::appliesToUser())
                            <div class="form-group col-12 col-md-4 col-lg-2 mb-2 mb-lg-0">
                                <label class="small text-muted mb-1">{{ __('Branch') }}</label>
                                <select name="daily_warehouse_id" class="form-control form-control-sm">
                                    <option value="">{{ __('All') }}</option>
                                    @foreach($warehouses as $wh)
                                        <option
                                            value="{{ $wh->id }}" @selected((string) request('daily_warehouse_id') === (string) $wh->id)>{{ $wh->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            @endunless
                            <div class="form-group col-12 col-md-4 col-lg-3 mb-2 mb-lg-0">
                                <label class="small text-muted mb-1">{{ __('Employee name') }}</label>
                                <input type="search" name="daily_q" class="form-control form-control-sm"
                                       value="{{ request('daily_q') }}" placeholder="{{ __('Search') }}">
                            </div>
                            <div class="form-group col-12 col-md-8 col-lg-1 mb-2 mb-lg-0 d-flex flex-wrap">
                                <button type="submit"
                                        class="btn btn-primary btn-sm mr-1 mb-1">{{ __('Filter') }}</button>
                                <a href="{{ route('dashboard') }}"
                                   class="btn btn-outline-secondary btn-sm mb-1">{{ __('Clear') }}</a>
                            </div>
                        </div>
                    </form>
                    <div class="table-responsive dashboard-attendance-table-wrap">
                        <table class="table table-striped table-hover table-sm mb-0">
                            <thead class="thead-light">
                            <tr>
                                <th>{{ __('Employee') }}</th>
                                <th>{{ __('Department') }}</th>
                                <th>{{ __('In Time') }}</th>
                                <th>{{ __('Out Time') }}</th>
                                <th>{{ __('Status') }}</th>
                                <th>{{ __('Action') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($dailyAttendancePaginator as $row)
                                @php
                                    $staff = $row['staff'];
                                    $attendance = $row['attendance'];
                                    $displayStatus = $row['status'];
                                @endphp
                                <tr>
                                    <td class="align-middle">
                                        <img class="rounded-circle border border-gray-300 mr-2"
                                             src="@if($staff->user->image!=null) {{ asset('storage/' . $staff->user->image) }} @else {{ asset('storage/uploads/user-icon.png') }} @endif"
                                             width="44"
                                             height="44"
                                             onerror="this.onerror=null;this.src='{{ asset('storage/uploads/user-icon.png') }}';"
                                             alt="{{ $staff->user->name }}">
                                        <span class="fw-600">{{ $staff->user->name }}</span>
                                        <span class="text-muted small">({{ $staff->warehouse->name ?? '—' }})</span>
                                    </td>
                                    <td class="align-middle">{{ $staff->department->name ?? '—' }}</td>
                                    @if($attendance !== null)
                                        <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                                                        value="{{ $attendance->signIn }}" readonly></td>
                                        <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                                                        value="{{ $attendance->signOut }}" readonly>
                                        </td>
                                        <td width="10%" class="align-middle" style="min-width: 72px;">
                                            <input
                                                class="form-control form-control-sm text-white text-center @if($attendance->status=='P') bg-success @elseif($attendance->status=='D') bg-info @else bg-danger @endif"
                                                type="text" readonly
                                                value="{{ $attendance->status }}">
                                        </td>
                                        <td class="align-middle">
                                            <a class="btn btn-primary btn-sm" href="javascript:void(0);"
                                               onclick="Attendance_update({{ $attendance->id }}, @json($attendance->date), @json($attendance->signIn), @json($attendance->signOut));"><i
                                                    class="fas fa-edit"></i></a>
                                        </td>
                                    @else
                                        <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                                                        value="" readonly></td>
                                        <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                                                        value="" readonly></td>
                                        <td class="align-middle">
                                            <input
                                                class="form-control form-control-sm text-white text-center @if($displayStatus === 'A') bg-danger @else bg-info @endif"
                                                type="text" readonly
                                                value="{{ $displayStatus }}">
                                        </td>
                                        <td class="align-middle"></td>
                                    @endif
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6"
                                        class="text-center text-muted py-4">{{ __('No employees match the selected filters.') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                    @if($dailyAttendancePaginator->hasPages())
                        <div class="mt-2 flex-shrink-0">
                            {{ $dailyAttendancePaginator->links() }}
                        </div>
                    @endif
                </div>


            </div>
        </div>
        <div class="col-12 col-sm-12 col-md-12 col-lg-6 col-xl-6">
            <div class="card dashboard-attendance-card shadow-sm">
                <div class="card-header d-flex justify-content-between align-items-center py-3">
                    <h5 class="mb-0">{{ __('Attendance Missed') }}</h5>
                    <span class="badge badge-secondary font-weight-normal">{{ __('This month') }}</span>
                </div>
                <div class="card-body pt-3">
                    <p class="text-muted small mb-3 flex-shrink-0">{{ __('Incomplete in/out for the current month (excluding today).') }}</p>
                    <div class="table-responsive dashboard-attendance-table-wrap">
                        <table class="table table-striped table-hover table-sm mb-0">
                            <thead class="thead-light">
                            <tr>
                                <th>{{ __('Date') }}</th>
                                <th>{{ __('Name') }}</th>
                                @unless(\App\Support\BranchWiseFeature::appliesToUser())
                                    <th>{{ __('Branch') }}</th>
                                @endunless
                                <th>{{ __('In Time') }}</th>
                                <th>{{ __('Out Time') }}</th>
                                <th>{{ __('Action') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($missingAttendances as $attendanceMissing)
                                <tr>
                                    <td class="align-middle">{{ date('D, M d', strtotime($attendanceMissing->date)) }}</td>
                                    <td class="align-middle">{{ $attendanceMissing->staff->user->name ?? '' }}</td>
                                    @unless(\App\Support\BranchWiseFeature::appliesToUser())
                                        <td class="align-middle small">{{ $attendanceMissing->staff->warehouse->name ?? '—' }}</td>
                                    @endunless
                                    <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                               value="{{ $attendanceMissing->signIn }}" readonly></td>
                                    <td class="align-middle"><input class="form-control form-control-sm" type="time"
                                               value="{{ $attendanceMissing->signOut }}" readonly></td>
                                    <td class="align-middle">
                                        <a class="btn btn-primary btn-sm" href="javascript:void(0);"
                                           onclick="Attendance_update({{ $attendanceMissing->id }}, @json($attendanceMissing->date), @json($attendanceMissing->signIn), @json($attendanceMissing->signOut));"><i
                                                class="fas fa-edit"></i></a>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="{{ \App\Support\BranchWiseFeature::appliesToUser() ? 5 : 6 }}" class="text-center text-muted py-4">{{ __('No missed attendance records.') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>




    <div class="row mb-3">
        <div class="col-12">
            <div class="card">
                <div class="card-body">


                    <h4 class="m-t-5 m-b-15 font-16">Holiday Calendar</h4>


                    <div id='calendar' class=""></div>

                </div>
                <!-- end row -->

            </div>
        </div>
    </div> <!-- end col -->

@endsection
@section('modal')
    <div class="modal fade" id="UpcomingBirthdayModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('Upcoming Birthdays (Active Staff)') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead>
                            <tr>
                                <th>{{ __('Employee') }}</th>
                                <th>{{ __('Employee Code') }}</th>
                                <th>{{ __('Date of Birth') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($upcomingbirthdays as $birtday)
                                <tr>
                                    <td>{{ $birtday->user->name ?? '' }}</td>
                                    <td>{{ $birtday->user->id ?? '' }}</td>
                                    <td>{{ $birtday->dob ? date('d F, Y', strtotime($birtday->dob)) : '' }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="3"
                                        class="text-muted text-center">{{ __('No upcoming birthdays') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="ResignedModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('Resigned Employees') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead>
                            <tr>
                                <th>{{ __('Employee') }}</th>
                                <th>{{ __('Employee Code') }}</th>
                                <th>{{ __('Reason') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($resignedStaffs as $s)
                                <tr>
                                    <td>{{ $s->user->name ?? '' }}</td>
                                    <td>{{ $s->user_id }}</td>
                                    <td>{{ $s->deactive_reason }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="3" class="text-muted text-center">{{ __('No data') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="TerminationModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('Terminated Employees') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead>
                            <tr>
                                <th>{{ __('Employee') }}</th>
                                <th>{{ __('Employee Code') }}</th>
                                <th>{{ __('Reason') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($terminationStaffs as $s)
                                <tr>
                                    <td>{{ $s->user->name ?? '' }}</td>
                                    <td>{{ $s->user_id }}</td>
                                    <td>{{ $s->deactive_reason }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="3" class="text-muted text-center">{{ __('No data') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="RetirementModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('Retired Employees') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead>
                            <tr>
                                <th>{{ __('Employee') }}</th>
                                <th>{{ __('Employee Code') }}</th>
                                <th>{{ __('Reason') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($retirementStaffs as $s)
                                <tr>
                                    <td>{{ $s->user->name ?? '' }}</td>
                                    <td>{{ $s->user_id }}</td>
                                    <td>{{ $s->deactive_reason }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="3" class="text-muted text-center">{{ __('No data') }}</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Close') }}</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="Attendance_update_modal">
        <form action="{{route('attendance.update')}}" method="POST">
            @csrf
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title h6">{{__('Attendance Update')}}</h5>
                        <button type="button" class="close" data-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <table class="table mb-0">
                            <tbody>

                            <input class="form-control" type="hidden" name="id" id="id" value="">

                            <tr>
                                <td><label for="">SignIn</label></td>
                                <td><input class="form-control" type="time" id="signin" value="" name="signin"></td>
                            </tr>
                            <tr>
                                <td><label for="">SignOut</label></td>
                                <td><input class="form-control" placeholder="Enter Received Amount"
                                           type="time"
                                           name="signout" id="signout" value="" required>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light" data-dismiss="modal">{{__('Cancel')}}</button>
                        <button type="submit" id="" class="btn btn-primary">{{__('Update')}}</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

@endsection

@section('script')
    <script>
        /*
 Template Name: Zoogler - Bootstrap 4 Admin Dashboard
 Author: Mannatthemes
 Website: www.mannatthemes.com
File: Calendar init js
 */

        !function ($) {
            "use strict";

            var CalendarPage = function () {
            };

            CalendarPage.prototype.init = function () {

                //checking if plugin is available
                if ($.isFunction($.fn.fullCalendar)) {
                    /* initialize the external events */
                    $('#external-events .fc-event').each(function () {
                        // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
                        // it doesn't need to have a start or end
                        var eventObject = {
                            title: $.trim($(this).text()) // use the element's text as the event title
                        };

                        // store the Event Object in the DOM element so we can get to it later
                        $(this).data('eventObject', eventObject);

                        // make the event draggable using jQuery UI
                        $(this).draggable({
                            zIndex: 999,
                            revert: true, // will cause the event to go back to its
                            revertDuration: 0 //  original position after the drag
                        });

                    });

                    /* initialize the calendar */

                    var date = new Date();
                    var d = date.getDate();
                    var m = date.getMonth();
                    var y = date.getFullYear();

                    $('#calendar').fullCalendar({
                        header: {
                            left: 'prev,next today',
                            center: 'title',
                            right: 'month,basicWeek,basicDay'
                        },
                        editable: true,
                        eventLimit: true, // allow "more" link when too many events
                        droppable: true, // this allows things to be dropped onto the calendar !!!
                        drop: function (date, allDay) { // this function is called when something is dropped

                            // retrieve the dropped element's stored Event Object
                            var originalEventObject = $(this).data('eventObject');

                            // we need to copy it, so that multiple events don't have a reference to the same object
                            var copiedEventObject = $.extend({}, originalEventObject);

                            // assign it the date that was reported
                            copiedEventObject.start = date;
                            copiedEventObject.allDay = allDay;

                            // render the event on the calendar
                            // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
                            $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

                            // is the "remove after drop" checkbox checked?
                            if ($('#drop-remove').is(':checked')) {
                                // if so, remove the element from the "Draggable Events" list
                                $(this).remove();
                            }

                        },
                        events: [
                            @foreach($holidayCalendarEvents as $holiday)
                                {
                                    title: @json($holiday['title']),
                                    start: @json($holiday['date']),
                                    className: 'bg-gradient2',
                                },
                            @endforeach
                        ]
                    });


                /*Add new event*/
                // Form to add new event

                $("#add_event_form").on('submit', function (ev) {
                    ev.preventDefault();

                    var $event = $(this).find('.new-event-form'),
                        event_name = $event.val();

                    if (event_name.length >= 3) {

                        var newid = "new" + "" + Math.random().toString(36).substring(7);
                        // Create Event Entry
                        $("#external-events").append(
                            '<div id="' + newid + '" class="fc-event">' + event_name + '</div>'
                        );


                        var eventObject = {
                            title: $.trim($("#" + newid).text()) // use the element's text as the event title
                        };

                        // store the Event Object in the DOM element so we can get to it later
                        $("#" + newid).data('eventObject', eventObject);

                        // Reset draggable
                        $("#" + newid).draggable({
                            revert: true,
                            revertDuration: 0,
                            zIndex: 999
                        });

                        // Reset input
                        $event.val('').focus();
                    } else {
                        $event.focus();
                    }
                });

            }
        else
            {
                alert("Calendar plugin is not installed");
            }
        }
            ,
            //init
            $.CalendarPage = new CalendarPage, $.CalendarPage.Constructor = CalendarPage
        }
        (window.jQuery),


//initializing
            function ($) {
                "use strict";
                $.CalendarPage.init()
            }(window.jQuery);

        function Attendance_update(id, date, signin, signout) {
            $('#signin').val(signin);
            $('#id').val(id);
            $('#signout').val(signout);
            $('#Attendance_update_modal').modal('show');
        }

    </script>
@endsection