@extends('teacher.layouts.layouts')

@section('content')
    @push('css')
        <style>
            /* Custom styles for checkboxes and forms */
            .form-check-input:checked {
                background-color: #007bff;
                /* Button color */
                border-color: #007bff;
            }

            .form-container {
                background-color: #f8f9fa;
                padding: 20px;
                border-radius: 10px;
                box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
            }

            .form-header {
                font-size: 24px;
                font-weight: bold;
                margin-bottom: 20px;
                text-align: center;
            }

            .form-group {
                margin-bottom: 15px;
            }

            .form-check {
                margin-left: 20px;
            }

            .form-section {
                margin-bottom: 30px;
            }

            .form-section h4 {
                font-size: 18px;
                font-weight: bold;
                margin-bottom: 10px;
                border-bottom: 2px solid #007bff;
                padding-bottom: 5px;
            }

            .btn-primary {
                background-color: #007bff;
                border-color: #007bff;
                padding: 10px 20px;
                font-size: 16px;
            }

            .curriculum-row {
                display: flex;
                flex-wrap: wrap;
                gap: 10px;
            }

            .curriculum-item {
                flex: 1 1 calc(25% - 10px);
                box-sizing: border-box;
            }
        </style>
    @endpush
    <div class="mt-5 d-flex justify-content-center">
        <div class="w-50">
            <h1 class="mt-5 mb-4 text-center">Create Student</h1>

            <!-- Educational Stage Selection Form -->
            {{-- <form action="{{ route('teacher.students.create') }}" method="GET">
                @csrf
                <div class="form-group">
                    <label for="educational_stage_id">Educational Stage</label>
                    <select class="form-control" id="educational_stage_id" name="educational_stage_id"
                        onchange="this.form.submit()" required>
                        <option value="">Select Educational Stage</option>
                        @foreach ($stages as $stage)
                            <option value="{{ $stage->id }}"
                                {{ request('educational_stage_id') == $stage->id ? 'selected' : '' }}>
                                {{ $stage->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </form> --}}

            <!-- Stage Year Selection Form -->
            {{-- @if ($stageYears->isNotEmpty())
                <form action="{{ route('teacher.students.create') }}" method="GET">
                    @csrf
                    <input type="hidden" name="educational_stage_id" value="{{ request('educational_stage_id') }}">

                    <div class="form-group">
                        <label for="stage_year_id">Stage Year</label>
                        <select class="form-control" id="stage_year_id" name="stage_year_id" onchange="this.form.submit()"
                            required>
                            <option value="">Select Stage Year</option>
                            @foreach ($stageYears as $stageYear)
                                <option value="{{ $stageYear->id }}"
                                    {{ request('stage_year_id') == $stageYear->id ? 'selected' : '' }}>
                                    {{ $stageYear->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </form>
            @endif --}}

            <!-- Curriculum and Student Information Form -->
            <form action="{{ route('teacher.students.store') }}" method="POST">
                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
                @csrf
                <div id="dynamic-selects">
                    <div class="mt-5 input-group">
                        <select name="educational_stage_id[]" class="form-control educationalStageId" id="educationalStageId">
                            <option value="">Select Educational Stage</option>
                            @foreach ($stages as $stage)
                                <option value="{{ $stage->id }}">{{ $stage->name }}</option>
                            @endforeach
                        </select>
                        <select name="stage_year_id[]" class="form-control stageYear" id="stageYear">
                            <option value="">Select Stage Year</option>
                        </select>
                        <select name="curriculum_id[]" class="form-control curriculumId" id="curriculumId">
                            <option value="">Select Curriculum</option>
                        </select>
                        <select name="teacher_id[]" class="form-control teacherId" id="teacherId">
                            <option value="">Select teacher</option>
                        </select>
                        <input type="hidden" id="Educational" class="Educational" name="educational_data[]">
                        <button type="button" class="btn btn-danger remove-selects"><i class="fas fa-trash-alt"></i>
                        </button>
                    </div>
                </div>

                <button type="button" id="add-selects" class="mt-3 btn btn-secondary">Add More</button>

                <!-- Student Information Form -->
                <form action="{{ route('teacher.students.store') }}" method="POST">
                    @csrf


                    <div class="form-group">
                        <label for="name">Name</label>
                        <input type="text" class="form-control" id="name" name="name" value="{{ old('name') }}"
                            required>
                    </div>

                    <div class="form-group">
                        <label for="email">Email</label>
                        <input type="email" class="form-control" id="email" name="email" value="{{ old('email') }}"
                            required>
                    </div>

                    <div class="form-group">
                        <label for="password">Password</label>
                        <input type="password" class="form-control" id="password" name="password" required>
                    </div>

                    <div class="form-group">
                        <label for="password_confirmation">Confirm Password</label>
                        <input type="password" class="form-control" id="password_confirmation" name="password_confirmation"
                            required>
                    </div>

                    <div class="form-group">
                        <label for="phone">Phone</label>
                        <input type="tel" class="form-control" id="phone" name="phone">
                    </div>

                    <div class="form-group">
                        <label for="address">Address</label>
                        <input type="text" class="form-control" id="address" name="address">
                    </div>


                    <div class="form-group">
                        <label for="group_type">Group Type</label>
                        <select class="form-control" id="group_type" name="group_type" required>
                            <option value="">Select Group Type</option>
                            <option value="private"
                                {{ old('group_type', isset($student) ? $student->group_type : '') === 'private' ? 'selected' : '' }}>
                                Private</option>
                            <option value="public"
                                {{ old('group_type', isset($student) ? $student->group_type : '') === 'public' ? 'selected' : '' }}>
                                Public</option>
                        </select>
                    </div>
                    <button type="submit" class="btn btn-primary">Create</button>
                </form>
        </div>
    </div>
@endsection

@push('js')
    @include('teacher.shared.input_student');
@endpush