@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 class="card">
            <div class="card-body">
                <p>
                    All (<span class="text-danger">*</span>) marked fields are required.
                </p>
                <form id="trainerForm" enctype="multipart/form-data">
                    @csrf

                    <div class="row">
                        <!-- Photo -->
                        <div class="mb-3">
                            @if ($trainer->photo)
                            <div class="mt-2">
                                <strong>Current Photo:</strong><br>
                                <img src="{{ $trainer->photo_path }}" alt="Trainer Photo" class="img-fluid rounded" style="max-height: 100px;">
                            </div>
                            @endif

                            <label class="form-label">Trainer Photo:</label>
                            <input type="file" name="photo" class="form-control" accept=".jpg,.jpeg,.png" />
                            <p class="text-danger mb-0">
                                Allowed types jpg, jpeg, png. Max allowed size 2MB.
                            </p>
                        </div>

                        <!-- Name -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Trainer Name: <span class="text-danger">*</span></label>
                            <input type="text" name="name" class="form-control" value="{{ $trainer->name }}" required />
                        </div>

                        <!-- DOB -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Date of Birth: <span class="text-danger">*</span></label>
                            <input type="date" name="dob" class="form-control" value="{{ $trainer->dob }}" required />
                        </div>

                        <!-- Highest Qualification -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Highest Qualification: <span class="text-danger">*</span></label>
                            <input type="text" name="higher_qualification" class="form-control" value="{{ $trainer->higher_qualification }}" required />
                        </div>

                        <!-- Qualification Certificate -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Highest Qualification Certificate:</label>
                            <input type="file" name="higher_qualification_certificate" class="form-control" accept=".pdf,.jpg,.jpeg,.png" />
                            @if ($trainer->higher_qualification_certificate)
                            <div class="mt-2">
                                <strong>Current File:</strong>
                                <a href="{{ $trainer->higher_qualification_certificate_path }}" target="_blank" class="d-block">View File</a>
                            </div>
                            @endif
                        </div>

                        <!-- Experience -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Experience (Years): <span class="text-danger">*</span></label>
                            <input type="number" name="experience" class="form-control" min="0" value="{{ $trainer->experience }}" required />
                        </div>

                        <!-- Experience Certificate -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">Experience Certificate:</label>
                            <input type="file" name="experience_certificate" class="form-control" accept=".pdf,.jpg,.jpeg,.png" />
                            @if ($trainer->experience_certificate)
                            <div class="mt-2">
                                <strong>Current File:</strong>
                                <a href="{{ $trainer->experience_certificate_path }}" target="_blank" class="d-block">View File</a>
                            </div>
                            @endif
                        </div>

                        <!-- NISD Certificate -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">NISD Certificate:</label>
                            <input type="file" name="nisd_certificate" class="form-control" accept=".pdf,.jpg,.jpeg,.png" />
                            @if ($trainer->nisd_certificate)
                            <div class="mt-2">
                                <strong>Current File:</strong>
                                <a href="{{ $trainer->nisd_certificate_path }}" target="_blank" class="d-block">View File</a>
                            </div>
                            @endif
                        </div>

                        <!-- TOT Certificate -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">TOT Certificate:</label>
                            <input type="file" name="tot_certificate" class="form-control" accept=".pdf,.jpg,.jpeg,.png" />
                            @if ($trainer->tot_certificate)
                            <div class="mt-2">
                                <strong>Current File:</strong>
                                <a href="{{ $trainer->tot_certificate_path }}" target="_blank" class="d-block">View File</a>
                            </div>
                            @endif
                        </div>

                        <!-- TOA Certificate -->
                        <div class="col-md-6 col-12 mb-3">
                            <label class="form-label">TOA Certificate (Optional):</label>
                            <input type="file" name="toa_certificate" class="form-control" accept=".pdf,.jpg,.jpeg,.png" />
                            @if ($trainer->toa_certificate)
                            <div class="mt-2">
                                <strong>Current File:</strong>
                                <a href="{{ $trainer->toa_certificate_path }}" target="_blank" class="d-block">View File</a>
                            </div>
                            @endif
                        </div>

                        <div class="col-12 text-center">
                            <button type="submit" class="btn btn-primary"><i class="fa fa-save"></i> Update Trainer</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('pages-scripts')
<script>
    $(document).ready(function() {
        $("#trainerForm").validate({
            rules: {
                name: {
                    required: true
                },
                dob: {
                    required: true
                },
                higher_qualification: {
                    required: true
                },
                experience: {
                    required: true,
                    number: true,
                    min: 0
                }
            },
            submitHandler: function(form) {
                let formData = new FormData(form);

                $.ajax({
                    url: "{{ route('training-centre.trainers.update', $trainer->id) }}",
                    method: "POST",
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function(response) {
                        if (response.success) {
                            Swal.fire({
                                title: "Updated!",
                                text: response.message,
                                icon: "success",
                                confirmButtonText: "OK"
                            }).then(() => {
                                window.location.href = "{{ route('training-centre.trainers.index') }}";
                            });
                        } else {
                            toastr.error(response.message);
                        }
                    },
                    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"
                            });
                        }
                    }
                });
            }
        });
    });
</script>
@endsection