@extends('layout.layout')

@section('content')
    <div class="container py-5">
        @include('components.alert')
        <div class="mb-3">
            <p class="fw-bold">Add New Feedback</p>
            <hr>
        </div>
        <form action="{{ route('performance-report.store') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="">
                <div class="row">
                    <div class="col-md-6 mb-3">
                        <div class="d-flex align-items-center gap-5">
                            <div class="fw-bold">Student Name</div>
                            <div>
                                @foreach ($course->studentInvoices as $student)
                                    {{ $student->student->first_name }} {{ $student->student->last_name }}
                                    <input type="hidden" name="student_id" value="{{ $student->student_id }}">
                                @endforeach
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">

                        <input type="hidden" name="schedule_id" value="{{ $course->id }}">



                        <div class="d-flex align-items-center gap-5">
                            <div class="fw-bold">Date / Time</div>
                            {{-- <div>{{ $course->start_date }} @foreach ($course->scheduledSlots as $slot)
                                    {{ formatTime($slot->slot_start) }}
                                @endforeach
                            </div> --}}
                            @php
                                $date = now()->format('Y-m-d');
                                $time = now()->format('H:i');
                            @endphp
                            <div>
                                @if ($existingReport)
                                    {{ $existingReport->created_at->format('Y-m-d H:i') }}
                                @else
                                    {{ $date }} {{ $time }}
                                @endif
                            </div>
                        </div>
                    </div>

                    <hr>
                    <div class="col-md-6 my-3 text-start">

                        <label for="goals_{{ $course->id }}" class="form-label fw-bold">Goals<span
                                class="text-danger">*</span></label>
                        <input type="text" name="goals" id="goals_{{ $course->id }}" class="form-control"
                            value="{{ old('goals', $existingReport->goals ?? '') }}" required>



                    </div>
                    <div class="col-md-6 my-3 text-start">

                        <label for="feedback_{{ $course->id }}" class="form-label fw-bold">Feedback<span
                                class="text-danger">*</span></label>
                        <input type="text" name="feedback" id="feedback_{{ $course->id }}" class="form-control"
                            value="{{ old('feedback', $existingReport->feedback ?? '') }}" required>
                    </div>
                    <hr>


                    <div class="col-md-12 my-3 text-start">
                        <span class="fw-bold">Current Skills </span>
                        <hr>
                    </div>

                    <div class="col-md-12 my-3 text-start">
                        <label for="listening_{{ $course->id }}" class="form-label fw-bold">Listening<span
                                class="text-danger">*</span></label>
                        <input type="text" name="listening" id="listening_{{ $course->id }}" class="form-control"
                            value="{{ old('listening', $existingReport->listening ?? '') }}" required>
                    </div>


                    <hr>
                    <div class="col-md-12 my-3 text-start">
                        <label for="reading_{{ $course->id }}" class="form-label fw-bold">Reading<span
                                class="text-danger">*</span></label>
                        <input type="text" name="reading" id="reading_{{ $course->id }}" class="form-control"
                            value="{{ old('reading', $existingReport->reading ?? '') }}" required>
                    </div>

                    <hr>
                    <div class="col-md-12 my-3 text-start">
                        <label for="speaking_{{ $course->id }}" class="form-label fw-bold">Speaking<span
                                class="text-danger">*</span></label>
                        <input type="text" name="speaking" id="speaking_{{ $course->id }}" class="form-control"
                            value="{{ old('speaking', $existingReport->speaking ?? '') }}" required>
                    </div>

                    <hr>
                    <div class="col-md-12 my-3 text-start">
                        <label for="vocabulary_{{ $course->id }}" class="form-label fw-bold">Vocabulary<span
                                class="text-danger">*</span></label>
                        <input type="text" name="vocabulary" id="vocabulary_{{ $course->id }}" class="form-control"
                            value="{{ old('vocabulary', $existingReport->vocabulary ?? '') }}" required>
                    </div>

                    <hr>
                    <div class="col-md-12 my-3 text-start">
                        <label for="grammar_{{ $course->id }}" class="form-label fw-bold">Grammar<span
                                class="text-danger">*</span></label>
                        <input type="text" name="grammar" id="grammar_{{ $course->id }}" class="form-control"
                            value="{{ old('grammar', $existingReport->grammar ?? '') }}" required>
                    </div>

                    <hr>
                    <div class="col-md-12 my-3 text-start">
                        <label for="objectives_{{ $course->id }}" class="form-label fw-bold">Objectives<span
                                class="text-danger">*</span></label>
                        <textarea name="objectives" id="objectives_{{ $course->id }}" class="form-control" required>
                            {{ old('objectives', is_array($existingReport->objectives ?? null) ? implode("\n", $existingReport->objectives) : json_decode($existingReport->objectives ?? '', true) ?? '') }}
                        </textarea>


                    </div>

                </div>
            </div>
            <div class="d-flex justify-content-end gap-2">
                <a href="{{ route('courseDemo') }}" class="btn btn-secondary">Cancel</a>
                <button type="submit" class="btn btn-primary">Submit</button>
            </div>
        </form>


    </div>
@endsection
<script src="{{ asset('assets/js/ckeditor/ckeditor.js') }}"></script>


<script>
    document.addEventListener('DOMContentLoaded', function() {
        try {
            CKEDITOR.replace(`objectives_{{ $course->id }}`, {
                height: 200
            });
        } catch (e) {
            console.error('CKEditor initialization failed for objectives:', e);
        }
    });
</script>

<style>
    /* .cke_top{
        background:#357bff !important;
        border-bottom: 1px solid #357bff !important;
        border-radius: 10px !important;
        border-top-left-radius: 10px !important;
        border-top-right-radius: 10px !important;
    } */
</style>