{{-- Extends layout --}}
@extends(getThemeBasePath())

@section('page_title')
{{$page_title}}
@endsection

{{-- Content --}}
@section('content')
    <!--begin::Card-->
    <form class="form" method="post" action="{{ $action }}" id="manage_form">
        @if (!empty($data['id']))
            @method('PUT')
        @endif
        @csrf
        <!--begin::Header-->
        <div class="card-header flex-wrap border-0 pt-6 pb-0">
            @include("backend.alerts")
            <div class="card-title">
                <div class="d-flex justify-content-end" data-kt-customer-table-toolbar="base">
                    <div class="menu-item px-3">
                        <a href="{{route('risk_assessed_role_emp_reg.download.report')}}" target="__blank" class="btn btn-primary btn-hover-rise" data-kt-export="pdf">
                            <span class="svg-icon svg-icon-2">
                                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                    <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2" rx="1" transform="rotate(90 12.75 4.25)" fill="currentColor"></rect>
                                    <path d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z" fill="currentColor"></path>
                                    <path d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z" fill="#C4C4C4"></path>
                                </svg>
                            </span>
                            Export as PDF
                        </a>
                    </div>
                    <button type="submit" class="btn btn-primary btn-hover-rise mr-2" id="submit_btn" onclick="$('#manage_form').submit();">Submit</button>
                </div>
            </div>
            <!--end::Card body-->
            <div class="table-responsive">
                <!--begin::Datatable-->
                <table class="table table-bordered table-hover table-checkable dataTable no-footer"
                    style="margin:10px 20px;">
                    <thead>
                        <tr class="col text-left text-uppercase" style="color:rgb(172, 172, 172);">
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Risk Assessed Role Title</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Employee Name</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Date Of Birth</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Employee Address</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Eligible For Exemption ?</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:20%;" colspan="2">Worker Application</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;" rowspan="2">Interim bar, Suspension, Exclusion, or Allegations of Misconduct</th>
                        </tr>
                        <tr class="col text-left text-uppercase" style="color:rgb(172, 172, 172);">
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;">Number</th>
                            <th style="border: 1px solid #E8E8E8;font-weight: 500;width:10%;">Outcome Expiry Date</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($users as $user)
                            <tr style="text-align:center;border: 1px solid #E8E8E8;">
                                <td style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <p> {{ $designation[$user->id] }} </p>
                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <input class="form-control form-control-lg form-control-solid" type="hidden" name="emp_data[{{ $user->id }}][emp_id][answer]" id="emp_id" value="{{ $user->id }}" readonly autocomplete="off">
                                        <p>{{ $user->first_name . " ".$user->last_name }}</p>
                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <p>{{ date('d-m-Y', strtotime($user->dob)) }}</p>
                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8;">
                                    <div>
                                        <p class="text-left">
                                        {!! $user->address ? $user->address . ', <br>' : '' !!}
                                        {!! $user->city ? $user->city . ', <br>' : '' !!}
                                        {{ $states[$user->id] ? $states[$user->id] . '-' : '' }}
                                        {!! $user->postcode ? $user->postcode . ', <br>' : '' !!}
                                        @foreach (config('constant.countries') as $cKey => $cVal)
                                            @if ($user->country == $cKey)
                                            {{ $cVal }}</p>
                                            @endif
                                        @endforeach
                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8; ">
                                    <div style="width: 10rem;">
                                        <div class="form-group">
                                            <div class="radio-inline">
                                                @foreach (config('constant.employment_check_register') as $val)
                                                    <label class="radio">
                                                        <input class="form-check-input" type="radio"
                                                            value="{{ $val }}"
                                                            name="emp_data[{{ $user->id }}][eligible_for_exemption_radio][answer]"
                                                            {{ isset($savedData[$user->id]['eligible_for_exemption_radio']) && $savedData[$user->id]['eligible_for_exemption_radio']['answer'] == $val ? 'checked' : '' }} />
                                                        <span></span>
                                                        {{ $val }}
                                                    </label>
                                                @endforeach
                                            </div>
                                        </div>
                                            <div class="form-group">
                                            <label>Start Date</label>
                                            <input class="form-control form-control-lg form-control-solid age-datepicker"
                                                type="text"
                                                name="emp_data[{{ $user->id }}][exemption_start_date][answer]"
                                                value="{{ $savedData[$user->id]['exemption_start_date']['answer'] ?? '' }}"
                                                autocomplete="off">
                                            </div>
                                            <div class="form-group">
                                            <label>End Date</label>
                                            <input class="form-control form-control-lg form-control-solid age-datepicker"
                                                type="text"
                                                name="emp_data[{{ $user->id }}][exemption_end_date][answer]"
                                                value="{{ $savedData[$user->id]['exemption_end_date']['answer'] ?? '' }}"
                                                autocomplete="off">
                                            </div>
                                            <div class="form-group">
                                            <label>Supervisor Name</label>
                                            <input class="form-control form-control-lg form-control-solid" type="text"
                                                name="emp_data[{{ $user->id }}][exemption_supervisor_name][answer]"
                                                value="{{ $savedData[$user->id]['exemption_supervisor_name']['answer'] ?? '' }}"
                                                autocomplete="off">
                                            </div>

                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <div class="form-group">
                                        <input class="form-control form-control-lg form-control-solid" type="number"
                                            name="emp_data[{{ $user->id }}][worker_application_no][answer]"
                                            value="{{ $savedData[$user->id]['worker_application_no']['answer'] ?? '' }}"
                                            autocomplete="off" placeholder="Number only" len="20">

                                        </div>
                                    </div>
                                </td>

                                <td style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <div class="form-group">
                                        <label>Out Come </label>
                                        <input class="form-control form-control-lg form-control-solid " type="text"
                                            name="emp_data[{{ $user->id }}][worker_application_outcome][answer]"
                                            value="{{ $savedData[$user->id]['worker_application_outcome']['answer'] ?? '' }}"
                                            autocomplete="off">
                                        </div>
                                            <div class="form-group">
                                        <label>Expiry Date</label>
                                        <input class="form-control form-control-lg form-control-solid age-datepicker"
                                            type="text"
                                            name="emp_data[{{ $user->id }}][worker_application_expiry_date][answer]"
                                            value="{{ $savedData[$user->id]['worker_application_expiry_date']['answer'] ?? '' }}"
                                            autocomplete="off"></div>
                                    </div>
                                </td>
                                <td class="text-left" style="border: 1px solid #E8E8E8;">
                                    <div style="width: 10rem;">
                                        <div class="form-group">
                                            <div class="form-check">
                                                <label class="checkbox">
                                                <input type="checkbox" class="form-check-input" id="interim_bar_{{ $user->id }}" name="emp_data[{{ $user->id }}][interim_bar][answer]" {{ isset($savedData[$user->id]['interim_bar']) && $savedData[$user->id]['interim_bar']['answer'] == 'on' ? 'checked' : '' }}>Interim bar</label>
                                            </div>
                                            <div class="form-check">
                                                <label class="checkbox">
                                                <input type="checkbox" class="form-check-input" id="suspension_{{ $user->id }}" name="emp_data[{{ $user->id }}][suspension][answer]" {{ isset($savedData[$user->id]['suspension']) && $savedData[$user->id]['suspension']['answer'] == 'on' ? 'checked' : '' }}>Suspension</label>
                                            </div>
                                            <div class="form-check">
                                                <label class="checkbox">
                                                <input type="checkbox" class="form-check-input" id="exclusion_{{ $user->id }}" name="emp_data[{{ $user->id }}][exclusion][answer]" {{ isset($savedData[$user->id]['exclusion']) && $savedData[$user->id]['exclusion']['answer'] == 'on' ? 'checked' : '' }}>Exclusion</label>
                                            </div>
                                            <div class="form-check">
                                                <label class="checkbox">
                                                <input type="checkbox" class="form-check-input" id="misconduct_allegations_{{ $user->id }}" name="emp_data[{{ $user->id }}][misconduct_allegations][answer]" {{ isset($savedData[$user->id]['misconduct_allegations']) && $savedData[$user->id]['misconduct_allegations']['answer'] == 'on' ? 'checked' : '' }}>Misconduct allegations</label>
                                            </div>
                                        </div>
                                        <label for="allegation_action">Allegation action</label>
                                        <input class="form-control form-control-lg form-control-solid" type="text" name="emp_data[{{ $user->id }}][allegation_action][answer]" value="{{ $savedData[$user->id]['allegation_action']['answer'] ?? '' }}" autocomplete="off">
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
                <!--end::Datatable-->
            </div>
            {{ $users->links('pagination::bootstrap-4') }}
            <!--begin::Card body-->
            <br>
            <div class="card-title">
                <div class="d-flex justify-content-end" data-kt-customer-table-toolbar="base">
                    <div class="menu-item px-3">
                        <a href="{{route('risk_assessed_role_emp_reg.download.report')}}" target="__blank" class="btn btn-primary btn-hover-rise" data-kt-export="pdf">
                            <span class="svg-icon svg-icon-2">
                                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                    <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2" rx="1" transform="rotate(90 12.75 4.25)" fill="currentColor"></rect>
                                    <path d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z" fill="currentColor"></path>
                                    <path d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z" fill="#C4C4C4"></path>
                                </svg>
                            </span>
                            Export as PDF
                        </a>
                    </div>
                    <button type="submit" class="btn btn-primary btn-hover-rise mr-2" id="submit_btn" onclick="$('#manage_form').submit();">Submit</button>
                </div>
            </div>
            <!--end::Card body-->
            <!--end::Header-->
        </div>
    </form>
    <!--end::Card-->
@endsection

{{-- Scripts Section --}}
@section('scripts')
    <script type="text/javascript">
        $(document).ready(function() {
            $('#manage_form').validate({
                // ignore: [],
                invalidHandler: function(form, validator) {
                    var errors = validator.numberOfInvalids();
                    if (errors && errors == 1) {
                        console.log(validator.errorList)
                    }
                }
            });

            // Sweet Alert

            $(document).on('click', '.page-link', function(event) {
                event.preventDefault(); // Prevent the default link behavior
                Swal.fire({
                    text: "Save Data Before Changing Page !",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    confirmButtonText: 'Yes, Save Data!',
                    cancelButtonColor: '#d33',
                    cancelButtonText: 'No, Continue'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $('#manage_form').submit();
                        Swal.fire(
                            'Saved!',
                            'Your Data has been Saved.',
                            'success'
                        );
                    } else {
                        window.location.href = $(this).attr('href'); // Redirect to the next page
                    }
                });
            });

        });
    </script>
@endsection