@extends('components.dashboard.layouts.master')

@section('title', __('Edit Quiz'))

@push('head')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
@endpush

@section('content')
    <div class="app-content content">
        <div class="content-wrapper">
            <x-dashboard.layouts.breadcrumb now="{{ __('Edit Quiz') }}">
                <x-slot:name>{{ __('Quizzes List') }}</x-slot:name>
                <x-slot:route>{{ route('teacher.lessons.index') }}</x-slot:route>
            </x-dashboard.layouts.breadcrumb>
            @if(session('errors'))
                <div class="alert alert-danger">
                    <ul>
                        @foreach(session('errors')->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
            <form action="{{ route('teacher.lesson.updateQuiz', $lesson->id) }}" method="POST">
                @csrf
                @method('PUT')
                <input type="hidden" id="lesson_id" name="lesson_id" value="{{ $lesson->id }}">

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

                        {{-- Editable Fields --}}
                        <div class="form-group col-md-12">
                            <label>{{ __('Quiz Title') }}</label>
                            <input type="text" name="title" class="form-control"  value="{{ $quiz->title }}">
                        </div>
                        <div class="form-group col-md-6">
                            <label>{{ __('Duration (minutes)') }}</label>
                            <input type="number" name="duration" class="form-control"  value="{{ $quiz->duration }}">
                        </div>
                        <div class="form-group col-md-6">
                            <label>{{ __('Number of Questions') }}</label>
                            <input type="number" name="number_of_questions" readonly class="form-control" value="{{ $quiz->number_of_questions }}">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="success_percentage">{{ __('Success Percentage') }} %</label>
                            <input type="number" step="0.01" name="success_percentage" class="form-control"
                                   value="{{  $quiz->success_percentage  }}">
                            @error('success_percentage') <small class="text-danger">{{ $message }}</small> @enderror
                        </div>
                        <div class="form-group col-md-6">
                            <label>{{ __('Creation Type') }}</label>
                            <select name="creation_type" readonly class="form-control">
                                <option value="manual"  {{ $quiz->creation_type === 'manual' ? 'selected' : '' }}>{{ __('Manual') }}</option>
                                <option value="auto"   {{ $quiz->creation_type === 'auto' ? 'selected' : '' }}>{{ __('Auto') }}</option>
                            </select>
                        </div>
                        <div class="col-md-6 col-12">
                            <div class="form-group">
                                <label for="with_calculator">{{ __('With Calculator') }}</label>
                                <select id="with_calculator" name="with_calculator" class="form-control" required>
                                    <option value="1" {{ $quiz->with_calculator == 1 ? 'selected' : '' }}>{{ __('Active') }}</option>
                                    <option value="0" {{ $quiz->with_calculator == 0 ? 'selected' : '' }}>{{ __('Inactive') }}</option>
                                </select>
                            </div>
                            @error('with_calculator') <small class="text-danger">{{ $message }}</small> @enderror
                        </div>
                        <div class="col-md-6 col-12">
                            <label for="see_result">{{ __('See Result') }}</label>
                            <select name="see_result" class="form-control">
                                <option value="1" {{ $quiz->see_result == 1 ? 'selected' : '' }} >{{ __('Active') }}</option>
                                <option value="0" {{ $quiz->see_result == 0 ? 'selected' : '' }}>{{ __('Inactive') }}</option>
                            </select>
                            @error('see_result')
                            <small class="text-danger">{{ $message }}</small>
                            @enderror
                        </div>
                        {{-- Is Question Shuffle --}}
                        <div class="col-md-6 col-12 mt-2">
                            <label for="is_question_shuffle">{{ __('Is Question Shuffle') }}</label>
                            <select name="is_question_shuffle" class="form-control">
                                <option value="1" {{ old('is_question_shuffle',$quiz->is_question_shuffle) == '1' ? 'selected' : '' }}>{{ __('Active') }}</option>
                                <option value="0" {{ old('is_question_shuffle',$quiz->is_question_shuffle) == '0' ? 'selected' : '' }}>{{ __('Inactive') }}</option>
                            </select>
                            @error('is_question_shuffle') <small class="text-danger">{{ $message }}</small> @enderror
                        </div>

                        {{-- Is Answers Shuffle --}}
                        <div class="col-md-6 col-12 mt-2">
                            <label for="is_answer_shuffle">{{ __('Is Answers Shuffle') }}</label>
                            <select name="is_answer_shuffle" class="form-control">
                                <option value="1" {{ old('is_answer_shuffle',$quiz->is_answer_shuffle) == '1' ? 'selected' : '' }}>{{ __('Active') }}</option>
                                <option value="0" {{ old('is_answer_shuffle',$quiz->is_answer_shuffle) == '0' ? 'selected' : '' }}>{{ __('Inactive') }}</option>
                            </select>
                            @error('is_answer_shuffle') <small class="text-danger">{{ $message }}</small> @enderror
                        </div>

                        <!-- Status -->
                        <div class="col-md-6 col-12 mt-2">
                            <div class="form-group">
                                <label for="with_rules">{{ __('With Rules') }}</label>
                                <select id="with_rules" name="with_rules" class="form-control" required>
                                    <option value="1" {{ $quiz->with_rules === 1 ? 'selected' : '' }}>{{ __('Active') }}</option>
                                    <option value="0" {{ $quiz->with_rules === 0 ? 'selected' : '' }}>{{ __('Inactive') }}</option>
                                </select>
                            </div>
                            @error('with_rules') <small class="text-danger">{{ $message }}</small> @enderror
                        </div>


                        {{-- Editable Questions --}}
                        <div class="form-group col-12">
                            <label>{{ __('Update Questions') }}</label>
                            <select multiple name="questions[]" class="form-control" id="questions-select2"></select>
                        </div>

                        {{-- Display Selected Questions --}}
                        <div class="form-group col-12" id="questions-group">
                            <div class="overflow-x-auto mt-3 border rounded shadow-sm">
                                <table class="min-w-full divide-y divide-gray-200 bg-white text-sm text-left">
                                    <thead class="bg-gray-50">
                                    <tr>
                                        <th class="px-4 py-2 w-full" colspan="3">{{ __('Questions') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody class="divide-y divide-gray-100" id="question-table">
                                    <tr>
                                        <td class="px-4 py-3 text-center text-gray-500">
                                            {{ __('Select questions from the list above') }}
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <div class="form-group col-12 text-end mt-4">
                            <button class="btn btn-primary" type="submit">{{ __('Update Questions') }}</button>
                        </div>

                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection
@include('dashboard.lessons.edit-scripts')