@extends($service.'.layout')

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

@section($service."-content")
    @if (!in_array($board['page'], ['teacher', 'test']))
    <div class="container_m">
        <div id="nav">
            <a href="{{ route('classroom.dashboard', ['service' => in_array($service, ['ielts', 'academy']) ? $service : 'ielts' ]) }}" class="ico-back">뒤로가기</a>
            <h2>1:1 학습문의</h2>
        </div>
        <div id="btn">
            <a href="{{ route('classroom.study.write', ['service' => $service]) }}" class="btn-go">
                <i class="ico-pencil-white"></i>
                문의 등록
            </a>
        </div>

        <div id="container">
            <ul class="board-list">
                    @if ($posts->isEmpty())
                        <li id="noData">
                            <a hre="#none">
                                등록된 게시물이 없습니다.
                            </a>
                        </li>
                    @else
                        <x-board.study-mobile-wrap :posts="$posts" />
                    @endif
            </ul>
        </div>
    </div>
    @else
        <div class="container_m boardList mock-test">
            <div class="max-width">
                <div id="nav">
                    <button type="button" onclick="history.back()" class="ico-back">뒤로가기</button>
                    <h2>자료실</h2>
                </div>
                <div id="tab">
                    <ul>
                        @foreach(['teacher', 'test'] as $type)
                            <li @class(['on' => $type == $board['page']])>
                                <a href="{{ route('classroom.' . $type . '.index', ['service' => $service]) }}">{{ $type == 'teacher' ? "선생님" : "모의고사" }}
                                    자료실</a>
                            </li>
                        @endforeach
                    </ul>
                </div>
                @if ($board['page'] == 'teacher' && $courses)
                    <form action="{{ route('classroom.' . $board['page'] . '.index', ['service' => 'academy']) }}" id="archiveForm">
                        <div class="filter">
                            <div class="dropDownMenu type2">
                                <div class="selectBox">
                                    <input type="hidden" name="course_id" value="{{Request::get("course_id")}}">
                                    <button type="button" class="label" id="course_id" data-selected="{{ Request::get("course_id") ?? "수강상품 선택"}}" data-default="수강상품 선택">수강상품 선택</button>
                                    <div class="optionListWrap">
                                        <div class="scrollWidth">
                                            <ul class="optionList scrollWrap">
                                                <li class="optionItem"><button type="button" data-account="">전체</button></li>
                                                <!-- 활성화 메뉴 active class 추가 -->
                                                @foreach($courses as $course)
                                                <li @class(["optionItem", "selected" =>$course['id'] == Request::get("course_id")])><button type="button" data-account="{{ $course['id'] }}">{{ $course['name']}}</button></li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="dropDownMenu type2">
                                <div class="selectBox">
                                    <input type="hidden" name="teacher_id" value="{{Request::get("teacher_id")}}">
                                    <button type="button" class="label" id="teacher_id" data-selected="선생님 선택" data-default="선생님 선택">선생님 선택</button>
                                    <div class="optionListWrap">
                                        <div class="scrollWidth">
                                            <ul class="optionList scrollWrap">
                                                <li class="optionItem"><button type="button" data-account="">전체</button></li>
                                                <!-- 활성화 메뉴 active class 추가 -->
                                                @foreach ($teachers as $teacher)
                                                <li @class(["optionItem","active" =>$teacher->id == Request::get("teacher_id")])><button type="button" data-account="{{ $teacher->id }}">{{ $teacher->name }}</button></li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                @endif
                <ul @class([$posts->isEmpty() ? 'board-list' : 'listWrap' ])>
                @if ($posts?->count() > 0 || $fixedPosts?->count() > 0)
                    @if ($fixedPosts && $fixedPosts->count() > 0)
                        <x-board.archive-mobile-wrap :posts="$fixedPosts" isFixed="1" type="{{ $board['page'] }}" service="{{ $service }}" />
                    @endif

                    <x-board.archive-mobile-wrap :posts="$posts" isFixed="0" type="{{ $board['page'] }}" service="{{ $service }}" />
                @else
                    <li id="noData">
                        <a hre="#none">
                            등록된 게시물이 없습니다.
                        </a>
                    </li>
                @endif
                </ul>
            </div>
        </div>
    @endif
@endsection

@section($service.'-script')
    <script>

        $(function() {
            $(".selected").trigger('click');
            $('.optionItem').on("click", function() {
                let val = $(this).find('button').data('account');
                let target = $(this).parents('.selectBox').find('input');
                target.val(val);
                $("#archiveForm").submit();
            })

            $("input[name='course_id']").on('change', function() {
                console.log('값이 변경되었습니다:', $(this).val());
            });
        })
    </script>
@endsection