@extends($service.'.layout')

@section($service . '-css')
    {!! resource('css/'.$service.'/sub.css') !!}
    {!! resource('css/myclass/my_class.css') !!}

    @if ($service == 'academy')
        {!! resource('css/myclass/my_class_academy.css') !!}
    @endif
@endsection

@section($service . "-content")
@php
    $content = $post?->content;
    $allowTeachers = $service == 'ielts' ? [29, 33, 28, 30, 31] : [];
@endphp
<div class="container">
    <div class="my-class-wrapper">
        <div class="wrapper">
            @include('classroom.'.$service.'.menu')
            <div class="my-class-contents">
                <div class="row">
                    <div class="column c100p">
                        <div class="card my-class-sub boardWrite">
                            <h2>1:1 학습문의</h2>
                            <form action="" class="w100p" enctype="multipart/form-data" id="studyForm">
                                @if ($post)
                                    <input type="hidden" name="id" value="{{ $post?->id }}" />
                                @endif
                                <div class="topWrap">
                                    <div class="boxWrap">
                                        <div class="box titleBox required"><p>문의강좌</p></div>
                                        <div class="box contentBox">
                                            <select name="enrollment_course_id" id="course_id" class="w100p">
                                                @if (! $post)
                                                    <option value="" disabled selected>수강 중인 강좌를 선택해 주세요.</option>
                                                @endif
                                                @foreach ($courses as $course)
                                                    <option value="{{ $course['id'] }}" @selected($post?->enrollment_course_id == $course['id'])>{{ $course['name'] }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
									<!-- TODO 강사 추가 -->
									<div class="boxWrap">
                                        <div class="box titleBox required"><p>강사</p></div>
                                        <div class="box contentBox">
											<select name="teacher_id" id="teacher_id" class="w100p">
                                                <option value="" disabled selected>강사를 선택해 주세요.</option>
                                                @foreach ($teachers as $teacher)
                                                    @if ( ! empty($allowTeachers) && ! in_array($teacher->id, $allowTeachers)) @continue @endif
                                                    <option value="{{ $teacher->id }}"  @selected($teacher->id == $post?->teacher_id)>{{ $teacher->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="boxWrap">
                                        <div class="box titleBox required"><p>제목</p></div>
                                        <div class="box contentBox subject">
                                            <input type="text" class="w100p" name="title" id="title" placeholder="제목을 입력해주세요." value="{{ $content?->title }}">
                                        </div>
                                    </div>
                                </div>
                                <textarea class="text-editor" name="content" id="content">{{ $content ?  htmlspecialchars_decode($content?->content, ENT_QUOTES) : $board['template'] }}</textarea>
                                <!-- 파일 첨부 -->

                                <x-board.attachments :files="$post?->getAttachments()" isPreview="{{ false }}" isView="{{ false }}" max="5" />

                                <div class="bottomBtnWrap flex">
                                    <!-- 목록 버튼 -->
                                    <div class="go-list">
                                        <a href="{{ route('classroom.study.index', ['service' => $service]) }}">목록 보기</a>
                                    </div>

                                    <!-- 등록하기 버튼 -->
                                    <div class="applyWrap">
                                        <label><input type="button" value="{{ $post ? "수정하기" : "등록하기" }}" id="btnSubmit" onclick="onSubmit()" disabled></label>
                                    </div>
                                </div>
                            </form>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection



@section($service . "-script")
    {!! resource('js/common/board/default.js') !!}
    {!! resource('js/common/board/file-upload.js') !!}


    <script>
        const fileUploadType = 'text';
        setPageConfig({
            "service" : '{{ $service }}',
            "boardType" : '{{ $board["page"] }}',
            "isActiveInfinity" : false,
            "isLogin" : "{{ Auth::check() }}",
        })
    </script>
    <script>

        $(function() {
            validation();

            $('#course_id, #teacher_id').on("change", function() {
                validation()
            });

            $('#title, #content').on("keyup", function() {
                validation();
            })
        })

        function validation() {
            const isValid = ! $.isEmptyObject($('#title').val()) && ! $.isEmptyObject($('#course_id').val()) && ! $.isEmptyObject($('#content').val()) && ! $.isEmptyObject($('#teacher_id').val())

            $('#btnSubmit').prop("disabled", ! isValid);
            isValid ? $('#btnSubmit').addClass("active") : $('#btnSubmit').removeClass("active");



            return isValid;
        }

        async function onSubmit() {

            if ( onCheckBanWord($('#content').val()) ) {
                alertPopup("사용할 수 없는 단어가 포함되어 있습니다.");
                return false;
            }

            const formData = setFileFormData(new FormData(document.getElementById("studyForm")));

            const result = await useFetch('{{ route("classroom.study.store", ["service" => $service , "id" => $post?->id]) }}', {
                method: 'POST',
                body: formData,
                headers: { 'Accept': 'application/json'}
            });

            if (result.status) {
                alertPopup("학습문의가 {{ $post ? '변경되었습니다.' : '작성되었습니다.\n답변은 영업일 기준 1~3일이 소요됩니다.' }}", {
                    onConfirm: function() {
                        location.href = '{{ route("classroom.study.index", ["service" => $service ]) }}'
                    },
                    onClose: function() {
                        location.href = '{{ route("classroom.study.index", ["service" => $service ]) }}'
                    },
                })
            } else {
                alertPopup(result.message)
            }
        }
    </script>
@endsection