@extends('layouts.master')
@section('content')
<div class="app-page-title">
    <div class="page-title-wrapper">
        <div class="page-title-heading">
            <div>
                {{ $title }}
                <div class="page-title-subheading">A list of standard Payroll reports.</div>
            </div>
        </div>
    </div>
    
    @if(isset($error) || session('error'))
    <div class="alert alert-danger">
        {{ $error ?? session('error') }}
    </div>
    @endif
    @if(session('success'))
    <div class="alert alert-success">
        {{ session('success') }}
    </div>
    @endif
</div>

<div class="main-card card">
    <div class="card-body">
        <table style="width: 100%;" id="example1" class="table table-hover table-striped table-bordered">
            <thead>
                <tr>
                    <th>Report Name</th>
                    <th>Description</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach($reports as $report)
                <tr>
                    <td>{{ $report['name'] }}</td>
                    <td>{{ $report['description'] }}</td>
                    <td style="text-align: right; width:20%;">
                        @if(auth()->user()->roles->first()->permissions->contains('name', 'Run payrolls') || auth()->user()->roles->first()->permissions->contains('name', 'View reports'))
                        
                        <a data-bs-toggle="modal" data-bs-target="{{ $report['targetModal'] }}" class="btn-shadow fbtn-wide btn-pill me-3 btn btn-outline-success">Generate Report</a>

                        <form action="{{ route('pam-reports.downloads') }}" method="POST" style="display: inline;">
                            @csrf
                            @method('POST')
                            
                            <!-- Hidden input for report_type -->
                            <input type="hidden" name="report_type" value="{{ $report['type'] }}">

                            <!-- View Button with blue outline and tooltip -->
                            <button type="submit" class="btn-shadow fbtn-wide btn-pill me-3 btn btn-outline-primary" title="View Report">
                              View
                            </button>
                        </form>

                        @endif
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection

@section('modal')

<div class="modal fade" id="unitDeductionsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Earning by Unit Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-unit-deductions')}}">
                    @csrf
                    @php

            
                    @endphp
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_unit_dedu" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_unit_dedu')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id" class="form-control select2" style="width: 100%;">
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>

                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit_id" class="form-control select2" style="width: 100%;">
                                @foreach($pamEmpUnitModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->name }}
                                </option>
                                @endforeach
                            </select>

                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select an Earning<span class="text-danger">*</span></label>
                            <select name="dedu_def_id" id="dedu_def_id" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollDeductionsModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>

                            @error('dedu_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->



                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>
<div class="modal fade" id="unitEarningsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Earning by Unit Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-unit-earnings')}}">
                    @csrf
                    @php


                    @endphp
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_unit_earn" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_unit_earn')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_unit" class="form-control select2" style="width: 100%;">

                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>

                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit" class="form-control select2" style="width: 100%;">

                                @foreach($pamEmpUnitModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->name }}
                                </option>
                                @endforeach
                            </select>

                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select an Earning<span class="text-danger">*</span></label>
                            <select name="earn_def_id" id="earn_def_id" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollEarningsModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>

                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->



                    <div class="modal-footer"> <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>

                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="departmentDeductionsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Deduction by Department Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-department-deductions')}}">
                    @csrf
                    @php

                    @endphp
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_depart_dedu" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_depart_dedu')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_by_department" class="form-control select2" style="width: 100%;">

                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach

                            </select>

                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit_dedu" class="form-control select2" style="width: 100%;">

                                @foreach($pamEmpUnitModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->name }}
                                </option>
                                @endforeach
                            </select>

                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Department<span class="text-danger">*</span></label>
                            <select name="department_id" id="department_dedu" class="form-control select2" style="width: 100%;">

                                <option value="0">
                                    Select a Department
                                </option>
                            </select>

                            @error('department_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select a Deductions<span class="text-danger">*</span></label>
                            <select name="dedu_def_id" id="dedu_def_id" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollDeductionsModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>

                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->



                    <div class="modal-footer"> <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>

                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="departmentEarningsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Earnings By Department Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-department-earnings')}}">
                    @csrf
                    @php

                    @endphp
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_depart_earn" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_depart_earn')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_earning" class="form-control select2" style="width: 100%;">

                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>

                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit_earn" class="form-control select2" style="width: 100%;">

                                @foreach($pamEmpUnitModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->name }}
                                </option>
                                @endforeach
                            </select>

                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Department<span class="text-danger">*</span></label>
                            <select name="department_id" id="department_earn" class="form-control select2" style="width: 100%;">

                                <option value="0">
                                    Select a Department
                                </option>
                            </select>

                            @error('department_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select an Earning<span class="text-danger">*</span></label>
                            <select name="earn_def_id" id="earn_def_id_earning" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollEarningsModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>

                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->



                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>
<!-- Start Payroll Summary Modal -->
<div class="modal fade" id="deductionsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Deduction Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-deductions')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_deductions" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_deductions')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_deductions" class="form-control select2" style="width: 100%;">
                              
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
             
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select all Deductions or a specific Deduction<span class="text-danger">*</span></label>
                            <select name="dedu_def_id" id="dedu_def_id_deductions" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollDeductionsModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('dedu_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- End Payroll Summary Modal -->

<!-- Start Payroll Earnings Modal -->
<div class="modal fade" id="earningsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Earnings Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-earnings')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_earnings" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_earnings')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_earnings" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
              
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select all Earnings or a specific Earning<span class="text-danger">*</span></label>
                            <select name="earn_def_id" id="earn_def_id_earnings" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollEarningsModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- End Payroll Earnings Modal -->

<div class="modal fade" id="deductionDeviationsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Deduction Deviation Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-deduction-deviations')}}">
                    @csrf

                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_dedu_deviation" class="form-control select2" style="width: 100%;">
                            
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_dedu_deviation')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_dedu_deviation" class="form-control select2" style="width: 100%;">
                              
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id_dedu_deviation')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                  
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select all Deductions or a specific Deduction<span class="text-danger">*</span></label>
                            <select name="dedu_def_id" id="dedu_def_id_dedu_deviation" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollDeductionsModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('dedu_def_id_dedu_deviation')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="earningDeviationsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Earnings Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-earning-deviations')}}">
                    @csrf

                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_earn_deviation" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_earn_deviation')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_earn_deviation" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
           
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select all Earnings or a specific Earning<span class="text-danger">*</span></label>
                            <select name="earn_def_id" id="earn_def_id_deviation" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollEarningsModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('earn_def_id_deviation')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- Start Payroll Register Modal -->
<div class="modal fade" id="payrollRegisterModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Register Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-register')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_register" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_register')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_register" class="form-control select2" style="width: 100%;">
                            
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit_id_register" class="form-control select2" style="width: 100%;">
                                <option value="0">All Units</option>
                                @foreach($pamEmpUnitModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->name }}</option>
                                @endforeach
                            </select>
                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="modal fade" id="unitEarningsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Earning by Unit Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-unit-earnings')}}">
                    @csrf
                    @php


                    @endphp
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_unit_earn" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_unit_earn')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">

                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_unit" class="form-control select2" style="width: 100%;">

                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>

                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit" class="form-control select2" style="width: 100%;">

                                @foreach($pamEmpUnitModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->name }}
                                </option>
                                @endforeach
                            </select>

                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

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

                            <label class="form-label">Select an Earning<span class="text-danger">*</span></label>
                            <select name="earn_def_id" id="earn_def_id" class="form-control select2" style="width: 100%;">

                                @foreach($pamPayrollEarningsModal as $ite)

                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>

                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->



                    <div class="modal-footer"> <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>

                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>
</div>
<!-- End Payroll Register Modal -->

<!-- Start Payroll Summary Modal -->
<div class="modal fade" id="payrollSummaryModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Summary Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-summary')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_summary" class="form-control select2" style="width: 100%;">
                             
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->short_description }}</option>
                                @endforeach
                            </select>
                            @error('payroll_id_summary')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Period<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_summary" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Unit<span class="text-danger">*</span></label>
                            <select name="unit_id" id="unit_id_summary" class="form-control select2" style="width: 100%;">
                                <option value="0">All Units</option>
                                @foreach($pamEmpUnitModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->name }}</option>
                                @endforeach
                            </select>
                            @error('unit_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- End Payroll Summary Modal -->

<!-- Start PAYE Modal -->
<div class="modal fade" id="pAYEModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">PAYE Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.paye')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_paye" class="form-control select2" style="width: 100%;">
                             
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->short_description }}</option>
                                @endforeach
                            </select>
                            @error('payroll_id_paye')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_paye" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->

                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select an earning to be included on the PAYE report</label>
                            <select name="earn_def_id" id="earn_def_id_paye" class="form-control select2" style="width: 100%;">
                                <option value="0" selected>None</option>
                                @foreach($pamPayrollEarningsModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->short_description }}</option>
                                @endforeach
                            </select>
                            @error('earn_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="nAPSAModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">NAPSA Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.napsa')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_napsa" class="form-control select2" style="width: 100%;">
                             
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->short_description }}</option>
                                @endforeach
                            </select>
                            @error('payroll_id_napsa')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_napsa" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="nHIMAModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">NHIMA Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.nhima')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_nhima" class="form-control select2" style="width: 100%;">
                             
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">{{ $ite->short_description }}</option>
                                @endforeach
                            </select>
                            @error('payroll_id_nhima')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_nhima" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div> <!-- Close the row here -->
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="contributionsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Payroll Contributions Report Options</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('pam-reports.payroll-contributions')}}">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select a specific Payroll<span class="text-danger">*</span></label>
                            <select name="payroll_id" id="payroll_id_contributions" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('payroll_id_contributions')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select Pay Run<span class="text-danger">*</span></label>
                            <select name="pay_run_period_id" id="pay_run_period_id_contributions" class="form-control select2" style="width: 100%;">
                               
                            @foreach($pamPayRunModal as $ite)
                                @php
                                    // Create a DateTime object using the calendar_month and calendar_year
                                    $date = DateTime::createFromFormat('!m-Y', $ite->calendar_month . '-' . $ite->calendar_year);
                                    // Format the date to get the full month name
                                    $monthName = $date->format('F');
                                @endphp
                                <option value="{{ $ite->id }}">
                                    {{ $monthName . ' - ' .  $ite->calendar_year }}
                                </option>
                            @endforeach
                            </select>
                            @error('pay_run_period_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
              
                    <div class="row">
                        <div class="mb-3 col-md-12">
                            <label class="form-label">Select all contributiond or a specific contribution<span class="text-danger">*</span></label>
                            <select name="cont_def_id" id="cont_def_id_contributions" class="form-control select2" style="width: 100%;">
                                @foreach($pamPayrollContributionsModal as $ite)
                                <option value="{{ $ite->id }}">
                                    {{ $ite->short_description }}
                                </option>
                                @endforeach
                            </select>
                            @error('cont_def_id')
                            <div class="text-danger">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-dark" data-bs-dismiss="modal" aria-label="Close">Close</button>
                        <button id="save_btn" class="btn-shadow float-end btn-wide btn-pill me-3 btn btn-outline-success" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- End PAYE Modal -->

@endsection

@section('scripts')

 
<script>
    $(function() {
    $('#unitDeductionsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id').select2({
            dropdownParent: $('#unitDeductionsModal')
        });
        $('#unit_id').select2({
            dropdownParent: $('#unitDeductionsModal')
        });
        $('#dedu_def_id').select2({
            dropdownParent: $('#unitDeductionsModal')
        });
        $('#payroll_id_unit_dedu').select2({
            dropdownParent: $('#unitDeductionsModal')
        });
    });

    $('#unitEarningsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_unit').select2({
            dropdownParent: $('#unitEarningsModal')
        });
        $('#unit').select2({
            dropdownParent: $('#unitEarningsModal')
        });
        $('#earn_def_id').select2({
            dropdownParent: $('#unitEarningsModal')
        });
        $('#payroll_id_unit_earn').select2({
            dropdownParent: $('#unitEarningsModal')
        });
    });


    $('#departmentDeductionsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_by_department').select2({
            dropdownParent: $('#departmentDeductionsModal')
        });
        $('#unit_dedu').select2({
            dropdownParent: $('#departmentDeductionsModal')
        });
        $('#department_dedu').select2({
            dropdownParent: $('#departmentDeductionsModal')
        });
        $('#dedu_def_id').select2({
            dropdownParent: $('#departmentDeductionsModal')
        });
        $('#payroll_id_depart_dedu').select2({
            dropdownParent: $('#departmentDeductionsModal')
        });
    });

 
    $('#departmentEarningsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_earning').select2({
            dropdownParent: $('#departmentEarningsModal')
        });
        $('#unit_earn').select2({
            dropdownParent: $('#departmentEarningsModal')
        });
        $('#department_earn').select2({
            dropdownParent: $('#departmentEarningsModal')
        });
        $('#earn_def_id').select2({
            dropdownParent: $('#departmentEarningsModal')
        });
        $('#payroll_id_depart_earn').select2({
            dropdownParent: $('#departmentEarningsModal')
        });
        
    });

    $('#deductionsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_deductions').select2({
            dropdownParent: $('#deductionsModal')
        });
        $('#payroll_id_deductions').select2({
            dropdownParent: $('#deductionsModal')
        });
        $('#dedu_def_id_deductions').select2({
            dropdownParent: $('#deductionsModal')
        });
    });

    $('#earningsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_earnings').select2({
            dropdownParent: $('#earningsModal')
        });
        $('#payroll_id_earnings').select2({
            dropdownParent: $('#earningsModal')
        });
        $('#earn_def_id_earnings').select2({
            dropdownParent: $('#earningsModal')
        });
    });

    $('#contributionsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_contributions').select2({
            dropdownParent: $('#contributionsModal')
        });
        $('#payroll_id_contributions').select2({
            dropdownParent: $('#contributionsModal')
        });
        $('#cont_def_id_contributions').select2({
            dropdownParent: $('#contributionsModal')
        });
    });

    $('#deductionDeviationsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_dedu_deviation').select2({
            dropdownParent: $('#deductionDeviationsModal')
        });
        $('#payroll_id_dedu_deviation').select2({
            dropdownParent: $('#deductionDeviationsModal')
        });
        $('#dedu_def_id_dedu_deviation').select2({
            dropdownParent: $('#deductionDeviationsModal')
        });
    });

    $('#earningDeviationsModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_earn_deviation').select2({
            dropdownParent: $('#earningDeviationsModal')
        });
        $('#payroll_id_earn_deviation').select2({
            dropdownParent: $('#earningDeviationsModal')
        });
        $('#earn_def_id_earn_deviation').select2({
            dropdownParent: $('#earningDeviationsModal')
        });
    });

    $('#payrollRegisterModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_register').select2({
            dropdownParent: $('#payrollRegisterModal')
        });
        $('#unit_id_register').select2({
            dropdownParent: $('#payrollRegisterModal')
        });
        $('#payroll_id_register').select2({
            dropdownParent: $('#payrollRegisterModal')
        });
    });

    $('#payrollSummaryModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_summary').select2({
            dropdownParent: $('#payrollSummaryModal')
        });
        $('#unit_id_summary').select2({
            dropdownParent: $('#payrollSummaryModal')
        });
        $('#payroll_id_summary').select2({
            dropdownParent: $('#payrollSummaryModal')
        });
      
    });

    $('#pAYEModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_paye').select2({
            dropdownParent: $('#pAYEModal')
        });
        $('#payroll_id_paye').select2({
            dropdownParent: $('#pAYEModal')
        });
        $('#earn_def_id_paye').select2({
            dropdownParent: $('#pAYEModal')
        });
    });


    $('#nAPSAModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_napsa').select2({
            dropdownParent: $('#nAPSAModal')
        });
        $('#payroll_id_napsa').select2({
            dropdownParent: $('#nAPSAModal')
        });
       
    });
    $('#nHIMAModal').on('shown.bs.modal', function () {
        $('#pay_run_period_id_nhima').select2({
            dropdownParent: $('#nHIMAModal')
        });
        $('#payroll_id_nihma').select2({
            dropdownParent: $('#nHIMAModal')
        });
       
    });
});

</script>


<script>
    $(document).ready(function() {
        $('#unit_earn').on('change', function() {
            var unitId = this.value;
            $('#department_earn').html('');
            $.ajax({
                url: '{{ route('getPamEmpDepartments') }}?unit_id=' + unitId,
                type: 'get',
                success: function(res) {
                    //  $('#department').html('<option value="">Select Department</option>');
                    $.each(res, function(key, value) {
                        $('#department_earn').append('<option value="' + value.id +
                            '">' + value.name + '</option>');
                    });
                    // If you have another dropdown with id 'city', you can populate it here
                    // $('#city').html('<option value="">Select City</option>');
                }
            });
        });
        $('#unit_dedu').on('change', function() {
            var unitId = this.value;
            $('#department_dedu').html('');
            $.ajax({
                url: '{{ route('getPamEmpDepartments') }}?unit_id=' + unitId,
                type: 'get',
                success: function(res) {
                    //  $('#department').html('<option value="">Select Department</option>');
                    $.each(res, function(key, value) {
                        $('#department_dedu').append('<option value="' + value.id +
                            '">' + value.name + '-' + value.id +'</option>');
                    });
                    // If you have another dropdown with id 'city', you can populate it here
                    // $('#city').html('<option value="">Select City</option>');
                }
            });
        });


    });
</script>
@endsection