@extends('layouts.app_layout')

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

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

                <div class="row">
                    <div class="col-md-12 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Code:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->code ?? '—' }}</p>
                    </div>

                    <div class="col-md-12 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Title:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->title ?? '—' }}</p>
                    </div>

                    <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Course Type:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->course_type ?? '—' }}</p>
                    </div>

                    <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Total Hours:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->total_hours ?? '—' }}</p>
                    </div>

                    <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Batch Size Min:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->batch_size_min ?? '—' }}</p>
                    </div>

                     <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Batch Size Max:</strong></label>
                        <p class="mb-0">{{ $trainingProgram->batch_size_max ?? '—' }}</p>
                    </div>

                    <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Fees:</strong></label>
                        <p class="mb-0">{{ number_format($trainingProgram->fees, 2) ?? '—' }}</p>
                    </div>

                     <div class="col-md-3 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Pay Per Student:</strong></label>
                        <p class="mb-0">{{ number_format($trainingProgram->pay_per_student, 2) ?? '—' }}</p>
                    </div>

                    @foreach([
                    'commencement' => 'Commencement',
                    'eligibility_of_training_institute' => 'Eligibility of Training Institute',
                    'eligibility_criteria_of_candidates' => 'Eligibility Criteria of Candidates',
                    'eligibility_of_trainees_final_assessment' => 'Eligibility of Trainees Final Assessment',
                    'objectives' => 'Objectives',
                    'background' => 'Background',
                    'course_curriculum' => 'Course Curriculum',
                    ] as $field => $label)
                    <div class="col-md-12 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>{{ $label }}:</strong></label>
                        <p class="mb-0">{!! $trainingProgram->$field ?? '—' !!}</p>
                    </div>
                    @endforeach

                    <div class="col-md-12 card py-2 bg-light mb-3">
                        <label class="form-label"><strong>Uploaded File:</strong></label>
                        <div>
                            @if ($trainingProgram->file_name)
                            <a href="{{ $trainingProgram->file_name_full_path }}" target="_blank" class="btn btn-secondary">
                                <i class="fa fa-eye"></i> View File
                            </a>
                            @else
                            <p class="text-muted mb-0">No file uploaded.</p>
                            @endif
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
@endsection


@section('pages-scripts')
@can('approve training program')
<script>
    $(document).ready(function() {
        // Approve Form Validation
        $("#approveForm").validate({
            rules: {
                is_approved: {
                    required: true,
                },
                remarks: {
                    required: function(element) {
                        return $("input[name='is_approved']:checked").val() == "0";
                    },
                    maxlength: 500
                }
            },
            messages: {
                is_approved: "Please select approval status.",
                remarks: {
                    required: "Remarks are required when rejecting.",
                    maxlength: "Remarks should not exceed 500 characters."
                }
            },
            submitHandler: function(form) {
                let formData = new FormData(form);

                $.ajax({
                    url: "{{ route('training-programs.approve', $trainingProgram->id) }}",
                    type: "POST",
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        Swal.fire("Success!", response.message, "success").then(() => {
                            window.location.href = "{{ route('training-programs.index') }}";
                        });
                    },
                    error: function(xhr) {
                        if (xhr.status === 422) {
                            let errors = xhr.responseJSON.errors;
                            let errorMsg = Object.values(errors).flat().join("<br>");
                            Swal.fire("Validation Error", errorMsg, "error");
                        } else {
                            Swal.fire("Error!", "Something went wrong!", "error");
                        }
                    }
                });

                return false;
            }
        });
    });
</script>
@endcan

@can('publish training program')
<script>
    $(document).ready(function() {
        // Publish Form Validation
        $("#publishForm").validate({
            rules: {
                is_published: {
                    required: true,
                },
            },
            submitHandler: function(form) {
                let formData = new FormData(form);

                $.ajax({
                    url: "{{ route('training-programs.publish', $trainingProgram->id) }}",
                    type: "POST",
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        Swal.fire("Success!", response.message, "success").then(() => {
                            window.location.href = "{{ route('training-programs.index') }}";
                        });
                    },
                    error: function(xhr) {
                        if (xhr.status === 422) {
                            let errors = xhr.responseJSON.errors;
                            let errorMsg = Object.values(errors).flat().join("<br>");
                            Swal.fire("Validation Error", errorMsg, "error");
                        } else {
                            Swal.fire("Error!", "Something went wrong!", "error");
                        }
                    }
                });

                return false;
            }
        });
    });
</script>
@endcan
@endsection