@extends('panel.layouts.master')
@section('title','ویرایش سوال')

@section('content')
    <!-- begin::page loader-->
    @include('panel.layouts.sidebar')
    @include('panel.layouts.header')
    <style>
        .btn-custom{
            border-radius: 0;
            width: 5rem;
            height: 2.5rem;
            justify-content: center;
        }

        table input{
            text-align: center !important;
        }
    </style>
    <main class="main-content">
        <div class="card">
            <div class="card-body">
                <div class="card-title d-flex justify-content-between align-items-center">
                    <h6>ویرایش سوال</h6>
                </div>
                <form action="{{ route('banks.update',$bank->id) }}" method="post" class="needs-validation" novalidate enctype="multipart/form-data">
                    @csrf
                    @method('PATCH')
                    <div class="row">
                        <div class="col-lg-12 mt-3">
                            <div class="form-group">
                                <label for="question">سوال</label>
                                <textarea name="question" id="question" class="form-control mt-2 editor @error('question') is-invalid @enderror">{!! old('question', $bank->question) !!}</textarea>
                                @error('question')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-6 mt-3">
                            <div class="form-group">
                                <label for="image">تصویر</label>
                                <input type="file" name="image" class="form-control mt-2 @error('image') is-invalid @enderror">
                                @if($bank->image)
                                    <img src="{{ asset($bank->image) }}" width="100" height="100" alt="image">
                                @endif
                                @error('image')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        {{-- <div class="col-lg-6 mt-3">
                            <div class="form-group">
                                <label for="time">زمان سوال<span class="text-danger">*</span></label>
                                <input type="number" name="time" id="time" class="form-control mt-2 @error('time') is-invalid @enderror" value="{{ old('time', $bank->time) }}">
                                @error('time')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div> --}}
                        <div class="col-lg-4 mt-3">
                            <div class="form-group">
                                <label for="category_id">دسته بندی<span class="text-danger">*</span></label>
                                <select name="category_id" id="category_id" class="form-control mt-2 @error('category_id') is-invalid @enderror">
                                    <option value="" selected>انتخاب کنید</option>
                                    @foreach($categories as $category)
                                        <option value="{{ $category->id }}" {{ old('category_id') == $category->id || $bank->category_id == $category->id ? 'selected' : '' }}>{{ $category->name }}</option>
                                    @endforeach
                                </select>
                                @error('category_id')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-4 mt-3">
                            <div class="form-group">
                                <label for="correct_answer">گزینه درست<span class="text-danger">*</span></label>
                                <select name="correct_answer" id="correct_answer" class="form-control mt-2 @error('correct_answer') is-invalid @enderror">
                                    <option value="1" {{ old('correct_answer') == '1' || $bank->correct_answer == '1' ? 'selected' : '' }}>گزینه اول</option>
                                    <option value="2" {{ old('correct_answer') == '2' || $bank->correct_answer == '2' ? 'selected' : '' }}>گزینه دوم</option>
                                    <option value="3" {{ old('correct_answer') == '3' || $bank->correct_answer == '3' ? 'selected' : '' }}>گزینه سوم</option>
                                    <option value="4" {{ old('correct_answer') == '4' || $bank->correct_answer == '4' ? 'selected' : '' }}>گزینه چهارم</option>
                                </select>
                                @error('correct_answer')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-4 mt-3">
                            <div class="form-group">
                                <label for="status">وضعیت<span class="text-danger">*</span></label>
                                <select name="status" id="status" class="form-control mt-2 @error('status') is-invalid @enderror">
                                    <option value="1" selected {{ old('status') == '1' || $bank->status == '1' ? 'selected' : '' }}>منتشر شده</option>
                                    <option value="0" {{ old('status') == '0' || $bank->status == '0' ? 'selected' : '' }}>منتشر نشده</option>
                                </select>
                                @error('status')
                                    <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mt-3">
                                <div class="form-group">
                                    <label for="answer_1">پاسخ اول</label>
                                    <textarea name="answer_1" id="answer_1" class="form-control mt-2 editor @error('answer_1') is-invalid @enderror">{!! old('answer_1', $bank->answer_1) !!}</textarea>
                                    @error('answer_1')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 mt-3">
                                <div class="form-group">
                                    <label for="answer_2">پاسخ دوم</label>
                                    <textarea name="answer_2" id="answer_2" class="form-control mt-2 editor @error('answer_2') is-invalid @enderror">{!! old('answer_2', $bank->answer_2) !!}</textarea>
                                    @error('answer_2')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 mt-3">
                                <div class="form-group">
                                    <label for="answer_3">پاسخ سوم</label>
                                    <textarea name="answer_3" id="answer_3" class="form-control mt-2 editor @error('answer_3') is-invalid @enderror">{!! old('answer_3', $bank->answer_3) !!}</textarea>
                                    @error('answer_3')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 mt-3">
                                <div class="form-group">
                                    <label for="answer_4">پاسخ چهارم</label>
                                    <textarea name="answer_4" id="answer_4" class="form-control mt-2 editor @error('answer_4') is-invalid @enderror">{!! old('answer_4', $bank->answer_4) !!}</textarea>
                                    @error('answer_4')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-12 mt-3">
                            <div class="form-group">
                                <button type="submit" class="btn btn-success btn-custom">ثبت</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </main>
@endsection
@section('script')
    <script src="/assets/tinymce/tinymce.min.js"></script>

    <script type="text/javascript">
        $('.js-example-basic-single').select2();

        {{-- tinymce --}}
        var useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;

        tinymce.init({
            selector: '.editor',
            plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media template codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap quickbars emoticons',
            imagetools_cors_hosts: ['picsum.photos'],
            directionality: 'rtl',
            menubar: 'file edit view insert format tools table help',
            toolbar: 'undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent |  numlist bullist | forecolor backcolor removeformat | pagebreak | charmap emoticons | fullscreen  preview save print | insertfile image media template link anchor codesample | ltr rtl',
            toolbar_sticky: true,
            autosave_ask_before_unload: true,
            autosave_interval: '30s',
            autosave_prefix: '{path}{query}-{id}-',
            autosave_restore_when_empty: false,
            autosave_retention: '2m',
            image_advtab: true,
            template_cdate_format: '[Date Created (CDATE): %m/%d/%Y : %H:%M:%S]',
            template_mdate_format: '[Date Modified (MDATE): %m/%d/%Y : %H:%M:%S]',
            height: 440,
            image_caption: true,
            quickbars_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote quickimage quicktable',
            noneditable_noneditable_class: 'mceNonEditable',
            toolbar_mode: 'sliding',
            contextmenu: 'link image imagetools table',
            skin: useDarkMode ? 'oxide-dark' : 'oxide',
            content_css:'dark',
            content_style: "@import url('/public/css/fonts.css?family=Vazir FD'); body div{width:100% !important;height:100% !important}",
        });

    </script>
@endsection