@extends('layouts.training_centre_layout')

@section('content')
<!-- [ Page Header ] start -->
 <x-page-header title="{{ $pageTitle }}" :backButton="true" />

<!-- [ Page Header ] end -->
<div class="row">
    <div class="col-12">
        <div id="smartwizard">
            <ul class="nav nav-tabs border-bottom">
                <li class="nav-item">
                    <a class="nav-link active" href="#step-1" data-bs-toggle="tab" role="tab">
                        <span class="num">1</span>
                        Personal Info
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#step-2" data-bs-toggle="tab" role="tab">
                        <span class="num">2</span>
                        Education
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#step-3" data-bs-toggle="tab" role="tab">
                        <span class="num">3</span>
                        Course & Centre
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#step-4" data-bs-toggle="tab" role="tab">
                        <span class="num">4</span>
                        Documents
                    </a>
                </li>
                @if (!in_array($applicationStatus->application_status, ['APPROVED','REJECTED','DISCRIPENCY_FOUND']))
                    <li class="nav-item">
                        <a class="nav-link" href="#step-action" data-bs-toggle="tab" role="tab">
                            <span class="num">5</span>
                            Action
                        </a>
                    </li>
                @endif   
            </ul>

            <div class="tab-content p-3 bg-white">
                <!-- Step 1: Personal Information -->
                <div id="step-1" class="tab-pane active" role="tabpanel">
                    @if ($studentDetails->personalDetail->count() > 0)
                    <div class="preview-section">
                        <div class="card">
                            <div class="card-body">
                                <h5>Personal Details:</h5>
                                <div class="row g-3">
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Full Name:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->name }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Email:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->email }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Phone:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->phone }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Date of Birth:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->dob }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Gender:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->genderDetail->type_name }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">City:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->correspondence_city }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Address:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->correspondence_address }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">PIN Code:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->correspondence_pincode }}</span>
                                        </div>
                                    </div>
                                </div>     
                            </div>
                        </div>
                        <div class="card mt-3">
                            <div class="card-body">
                                <h5>Emergency Contact:</h5>
                                <div class="row g-3">
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Contact Name:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->emergency_name }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Contact Phone:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->emergency_phone }}</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 col-12">
                                        <div class="preview-item">
                                            <label class="preview-label fw-bold">Relationship:</label>
                                            <span class="preview-value d-block">{{ $studentDetails->personalDetail->relationship }}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endif
                </div>

                <!-- Step 2: Educational Background -->
                <div id="step-2" class="tab-pane" role="tabpanel">
                    <div class="preview-section">
                        @if ($studentDetails->educationDetail->count() > 0)
                            <h4 class="preview-section-title mb-3">Educational Details</h4>
                            @foreach ($studentDetails->educationDetail as $educationDetail)

                            {{-- {{ dd($educationDetail) }} --}}

                            <div class="card">
                                <div class="card-body">
                                    <h5 class="education-preview-title">Education {{ $loop->index + 1 }}</h5>
                                    <div class="row g-3">
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Qualification:</label>
                                                <span class="preview-value d-block">{{ $educationDetail->qualification->name }}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Board/University:</label>
                                                <span class="preview-value d-block">{{ $educationDetail->board }}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Institution:</label>
                                                <span class="preview-value d-block">{{ $educationDetail->institution }}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Year of Passing:</label>
                                                <span class="preview-value d-block">{{ $educationDetail->year }}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Percentage/Grade:</label>
                                                <span class="preview-value d-block">{{ $educationDetail->grade }}</span>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6 col-12">
                                            <div class="preview-item">
                                                <label class="preview-label fw-bold">Document:</label>
                                                @if ($educationDetail->file_path_url)
                                                    <a href="{{ $educationDetail->file_path_url }}"
                                                        class="btn btn-outline btn-sm ms-2" target="_blank">
                                                        <i class="fas fa-file-pdf me-1"></i>
                                                        View Certificate
                                                    </a>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        @endif

                    </div>
                </div>

                <!-- Step 3: Course Selection -->
                <div id="step-3" class="tab-pane" role="tabpanel">
                    <div class="preview-section">
                        @if ($studentDetails->courseSelectionDetail->count() > 0)
                            <h4 class="preview-section-title mb-3">Course & Centre Selection</h4>
                            @foreach ($studentDetails->courseSelectionDetail as $courseSelectionDetail)
                            <div class="card">
                                <div class="card-body">
                                    <div class="preview-item">
                                        <label class="preview-label fw-bold">Selected Training Program:</label>
                                        <span class="preview-value d-block">
                                            {{ $courseSelectionDetail->course->title }}<br>
                                            <small class="text-muted">(Duration: {{ $courseSelectionDetail->course->total_hours }} hours, Type: {{ $courseSelectionDetail->course->course_type_desc }})</small>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        @endif
                    </div>
                </div>

                <!-- Step 4: Document Upload -->
                <div id="step-4" class="tab-pane" role="tabpanel">
                    @if ($studentDetails->uploadDetail->count() > 0)
                        <div class="preview-section">
                            <h4 class="preview-section-title mb-3">Uploaded Documents</h4>
                            <div class="row g-3">
                                <div class="col-md-6">
                                    <div class="preview-item">
                                        <label class="preview-label form-label fw-bold">Photograph:</label>
                                        <span class="preview-value d-block">
                                            <a href="{{ $studentDetails->uploadDetail->photo_full_path }}" target="_blank" class="btn btn-secondary btn-sm">
                                                <i class="fa fa-eye"></i> View Photo
                                            </a>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="preview-item">
                                        <label class="preview-label form-label fw-bold">Address Proof:</label>
                                        <span class="preview-value d-block">
                                            <a href="{{ $studentDetails->uploadDetail->address_proof_full_path }}" target="_blank" class="btn btn-secondary btn-sm">
                                                <i class="fa fa-eye"></i> View Document
                                            </a>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="preview-item">
                                        <label class="preview-label form-label fw-bold">Experience Certificate:</label>
                                        <span class="preview-value d-block">
                                            <a href="{{ $studentDetails->uploadDetail->experience_certificate_full_path }}" target="_blank" class="btn btn-secondary btn-sm">
                                                <i class="fa fa-eye"></i> View Document
                                            </a>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="preview-item">
                                        <label class="preview-label form-label fw-bold">Medical Certificate:</label>
                                        <span class="preview-value d-block">
                                            <a href="{{ $studentDetails->uploadDetail->medical_certificate_full_path }}" target="_blank" class="btn btn-secondary btn-sm">
                                                <i class="fa fa-eye"></i> View Document
                                            </a>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                </div>

                <!-- Step 5: Action -->
                @if (!in_array($studentDetails->application_status, ['APPROVED','REJECTED','DISCRIPENCY_FOUND']))
                <div id="step-action" class="tab-pane" role="tabpanel">
                    <form action="" id="scrutiny_details_form">
                        @csrf
                        <div class="row">
                            <div class="col-12">
                                <h5>
                                    Following discrepancies are found in the application:
                                </h5>
                            </div>
                            <div class="col-12">
                                <div class="checkbox-grid">
                                    @foreach ($scrutinyList as $list)

                                        @php
                                            $base_name = strtolower(str_replace(' ', '_', $list->name));
                                            $input_name = $base_name;
                                        @endphp

                                        <div class="col-12 mb-3">
                                            <div class="row align-items-center">
                                                <div class="col-md-6 d-flex flex-column">
                                                    <label class="form-label mb-2">{{ $list->name }}</label>
                                                    <div class="d-flex align-items-center">
                                                        <span class="me-3">Is there any discrepancy in this?</span>
                                                        <label class="checkbox-label me-3">
                                                            <input type="radio" name="{{ $input_name }}_status" value="yes">
                                                            <span class="checkbox-custom"></span>
                                                            Yes
                                                        </label>
                                                        <label class="checkbox-label">
                                                            <input type="radio" name="{{ $input_name }}_status" value="no">
                                                            <span class="checkbox-custom"></span>
                                                            No
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label">Remarks</label>
                                                    <textarea name="{{ $input_name }}_remarks" class="form-input form-control" rows="4"></textarea>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="col-12 mb-3 text-center">
                                <button id="scrutiny_details_form_btn" class="btn btn-primary btn-sm">
                                    <i class="fa fa-check"></i> Submit
                                </button>
                                <button type="button" id="reject_application_btn" class="btn btn-danger btn-sm" data-bs-toggle="offcanvas" data-bs-target="#rejectApplicationStatusOffcanvas">
                                    <i class="fa fa-check"></i> Reject Application
                                </button>
                            </div>
                            <p class="mb-0">
                                <strong>Note:</strong>
                                If no discrepancy is found in the application, then the application will be approved.
                            </p>
                        </div>
                    </form>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>
<x-offcanvas.centre.reject-student :id="$studentDetails->id"/>

@endsection
@section('pages-scripts')
@yield('reject-application-offcanvas-script')

<script>
$(document).ready(function () {

    $('#scrutiny_details_form').validate({
        rules: {
            @foreach ($scrutinyList as $list)
                @php
                    $base_name = strtolower(str_replace(' ', '_', $list->name));
                    $status_name = $base_name . '_status';
                    $remarks_name = $base_name . '_remarks';
                @endphp

                '{{ $status_name }}': {
                    required: true
                },

                '{{ $remarks_name }}': {
                    required: function () {
                        return $('input[name="{{ $status_name }}"]:checked').val() === 'yes';
                    }
                }

                @if (!$loop->last), @endif
            @endforeach
        },

        messages: {
            @foreach ($scrutinyList as $list)
                @php
                    $base_name = strtolower(str_replace(' ', '_', $list->name));
                    $status_name = $base_name . '_status';
                    $remarks_name = $base_name . '_remarks';
                @endphp

                '{{ $status_name }}': {
                    required: "Please select a status for {{ $list->name }}."
                },

                '{{ $remarks_name }}': {
                    required: "Remarks are required for {{ $list->name }} when status is YES."
                }

                @if (!$loop->last), @endif
            @endforeach
        },

        submitHandler: function (form) {

            Swal.fire({
                title: "Are you sure?",
                text: "Do you want to submit the scrutiny details?",
                icon: "warning",
                showCancelButton: true,
                confirmButtonText: "Yes, Submit",
                cancelButtonText: "Cancel"
            }).then((result) => {

                if (result.isConfirmed) {

                    let formData = new FormData(form);

                    $.ajax({
                        url: "{{ route('training-centre.students.new-application.store-scrutiny-details', ['id' => $studentDetails->id]) }}",
                        method: 'POST',
                        data: formData,
                        processData: false,
                        contentType: false,

                        success: function (response) {
                            if (response.success === true) {
                                Swal.fire({
                                    title: "Success!",
                                    text: response.message,
                                    icon: "success",
                                    confirmButtonText: "OK"
                                }).then(() => {
                                    window.location.href = response.redirect_url;
                                });
                            } else {
                                Swal.fire({
                                    title: "Error!",
                                    text: response.message || "Something went wrong. Please try again.",
                                    icon: "error"
                                });
                            }
                        },

                        error: function (xhr) {
                            if (xhr.status === 422) {
                                let errors = xhr.responseJSON.errors;
                                let errorMessages = Object.values(errors).flat().join("<br>");
                                Swal.fire({
                                    title: "Validation Error",
                                    html: errorMessages,
                                    icon: "error"
                                });
                            } else {
                                Swal.fire({
                                    title: "Error!",
                                    text: xhr.responseJSON.message || "Something went wrong. Please try again.",
                                    icon: "error"
                                });
                            }
                        }
                    });

                }

            }); // END confirmation
        }
         });

        // Button click triggers form validation
        $('#scrutiny_details_form_btn').on('click', function (e) {
            e.preventDefault();
            $('#scrutiny_details_form').submit();
        });

    });
</script>
@endsection