@extends($service.'.layout')

{{-- @section('subgnb', view('ielts.gnb')) --}}

@section($service.'-css')
    <!-- promotion -->
    {!! resource('css/common/board.css') !!}
@endsection

@section("progress")
    @include('progress')
@endsection

@section($service."-content")
    <div id="wrap" @class(['boardPage', $board['page']])>
        <div class="max-width">
            <div class="pageTitle">
                <button type="button" onclick="history.back()" class="backBtn mo-backBtn"></button>
                <h1>{{ $board['name'] }}</h1>
            </div>

            <div class="board-top">
                <!-- 검색 -->
                <div class="searchWrap">
                    <form action="{{ route($board['page']. ".index", $service) }}" method="get" id="search-form">

                        <input type="hidden" name="paginate" id='paginate' value="{{ Request::get('paginate', 10) }}" />
                        @if ($board['page'] == 'faq')
                            <input type="hidden" name="faq_type" id='faq_type' value="{{ Request::get('faq_type') }}" />
                            <div class="search">
                                <input type="text" placeholder="검색어를 입력하세요." name="keyword" value="{{ Request::get("keyword") }}">
                                <input type="submit" value="검색" class="search-submit">
                            </div>
                        @endif

                    </form>
                </div>

                @if ($board['page'] == 'faq')

                    <!-- 게시판 카테고리 -->
                    <div class="categoryWrap customLine">
                        @if($inquiryTypes)
                            <div class="flex">
                                <a href="javascript:onChangeType('')" @class(['active' => empty(Request::get('faq_type'))])>전체</a>
                                @foreach ($inquiryTypes as $key => $type)
                                    <a href="javascript:onChangeType('{{ $key }}')" @class(['active' => Request::get("faq_type") == $key])>{{ $type }}</a>
                                @endforeach
                            </div>
                        @endif
                    </div>
                @endif
            </div>

            <!-- 게시판 리스트 -->
            <div class="board-list default">
                <div class="headWrap pc-headWrap">
                    <div class="flex">
                        <div class="number">No</div>
                        <div class="subject">제목</div>
                        <div class="count">조회수</div>
                        <div class="date">작성일</div>
                    </div>
                </div>
                <!-- 게시글 / 공지사항 등록 영역 -->
                <ul class="notice flex">
                    @if ($fixedPosts != null)
                        <x-board.inquiry-wrap :posts="$fixedPosts" isFixed=1 type="{{ $board['page'] }}" />
                    @endif

                </ul>
                <!-- 게시글 영역 -->
                <ul class="list flex" id="inquiry_list">
                    <x-board.inquiry-wrap :posts="$posts" isFixed=0 type="{{ $board['page'] }}" />
                </ul>
            </div>

            {{ $posts->links() }}
        </div>
    </div>
@endsection

@section($service.'-script')
    {!! resource('js/components/infinite-scroll.js') !!}
    <script>
        function onChangeType(value) {
            $('#faq_type').val(value);
            $('#search-form').submit()
        }

        new InfiniteScroll("inquiry_list", {
            url: "{{ route($board['page'] . '.index', ['service' => $service]) }}",
            mobileOnly : true,
            maxWidth: 1200,
            getFilter : function() {
                if ($('#faq_type').length > 0) {
                    return {'faq_type' : $('#faq_type').val() } ;
                }
                return false;
            }
        })


    </script>
@endsection