@extends('admin.layouts.container')
@section('css')
    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/toastr.css') }}" />
@endsection
@section('content')
    <div class="side-title">
        <h3>{{$head ?? '' }}</h3>
    </div>

    <div class="border-item">
        <form class="form-row add_faq_form" method="post" action="{{ $action }}" enctype="multipart/form-data">
            @if($courseFaq ?? ''  && $courseFaq->id)
                @method('PUT')
            @endif
            @csrf
            <div class="form-group col-lg-12 border p-2">
                <label><b>{{ __('courses.select_courses') }}</b></label>
                <div class="row">
                    @if(count($courses))
                        @foreach($courses as $course)
                            <div class="col-sm-6">
                                <div class="custom-control custom-checkbox">
                                    <input {{in_array($course->id, $oldCourses) ? 'checked' : ''}} type="checkbox"  value="{{$course->id}}" class="custom-control-input" id="course_{{$course->id}}" name="courses[]">
                                    <label class="custom-control-label" for="course_{{$course->id}}">{{$course->name}}</label>
                                </div>
                            </div>
                        @endforeach
                    @endif
                </div>
            </div>

            {{--            <div class="form-group col-lg-12">--}}
            {{--                <label>{{ meta('course_id', getCurrentLocale()) ?? __('courses.course_id') }}</label>--}}
            {{--                <select name="course_id" class="form-control {{ $errors->has('course_id') ? 'is-invalid' : '' }}">--}}
            {{--                    <option value="">{{ meta('course_id', getCurrentLocale()) ?? __('courses.course_id') }}</option>--}}
            {{--                    @if(count($courses))--}}
            {{--                        @foreach($courses as $course)--}}
            {{--                            <option {{old('course_id', $courseFaq->course_id ?? null) == $course->id ? 'selected' : ''}} value="{{$course->id}}">{{$course->name}}</option>--}}
            {{--                        @endforeach--}}
            {{--                    @endif--}}
            {{--                </select>--}}
            {{--            </div>--}}
            @foreach(languages() as $language)
                <div class="form-group col-lg-12">
                    <label>{{ meta('question', $language->local) ?? __('courseFaqs.question') }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
                    <input type="text" class="form-control {{ $errors->has('question_'.$language->local) ? 'is-invalid' : '' }}" name="question_{{ $language->local }}" placeholder="{{ meta('question', $language->local) ?? __('courseFaqs.question') }}" value='{{ old("question_{$language->local}", $courseFaq[$language->local]->question ?? "") }}'/>
                </div>
                <div class="form-group col-lg-12">
                    <label>{{ meta('answer', $language->local) ?? __('courseFaqs.answer') }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
                    <textarea name="answer_{{ $language->local }}" class="form-control editor {{ $errors->has('answer_'.$language->local) ? 'is-invalid' : '' }}" placeholder="{{ meta('answer', $language->local) ?? __('courseFaqs.answer') }}">{!! old("answer_{$language->local}", $courseFaq[$language->local]->answer ?? "") !!}</textarea>
                </div>
            @endforeach


            <div class="text-center mt-5 col-12">
                <button class="butn add_faq_button"><span>{{ __('dashboard.save') }}</span></button>
            </div>
        </form>
    </div>

@endsection

@section('inner_js')
    <script src="{{ asset('assets/web/js/lib/toastr.min.js') }}"></script>

    <script>
        $('.add_faq_button').click(async function (e) {
            e.preventDefault();

            let form = $('.add_faq_form'),
                data = new FormData(form[0]),
                url = form.attr('action'),
                method = form.attr('method');

            const response=await ajax({
                url,
                data,
                dataType: 'json',
                method
            });

            if (response.url){
                window.location.href = response.url;
            }

            if (response.errors){
                toasterError(response.errors);
            }


        });
    </script>
@endsection