@extends("domains.common.layouts.layout")

@routes("user")
@routes("product")
@section("header")
<style>
    div.ts-wrapper div.ts-control input {
        height: auto;
    }
</style>
@endsection

@section("main-content")
<div class="container-fluid detail">
    <!-- start page title -->
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <h1><span class="point-color">합격 후기</span> 게시글 관리</h1>
            </div>
        </div>
    </div>
    <!-- end page title -->

    <div class="row">
        <div class="col-xl-12 col-lg-12 order-lg-2 order-xl-1">
            <div class="card">
                <div class="card-body">
                    <form action="" class="search-form" method="GET">
                        <div class="search-input-wrap">
                            <div class="search-input">
                                <label for="register_start_date">등록일</label>
                                <input type="date" name="register_start_date" value="{{ Request::get("register_start_date") }}">
                                -
                                <input type="date" name="register_end_date" value="{{ Request::get("register_end_date") }}">
                            </div>
                            <div class="search-input">
                                <label for="activated">전시 상태</label>
                                <select name="activated" id="activated">
                                    <option value="" @selected(Request::get("activated") === null)>전체</option>
                                    <option value="1" @selected(Request::get("activated") === "1")>전시</option>
                                    <option value="0" @selected(Request::get("activated") === "0")>비전시</option>
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="created_by">작성자</label>
                                <input type="text" name="created_by" id="created_by" value="{{ Request::get('created_by') }}" placeholder="전체">
                            </div>
                            <div class="search-input">
                                <label for="title">제목</label>
                                <input type="text" name="title" id="title" value="{{ Request::get('title') }}">
                            </div>
                            <div class="search-input">
                                <label for="service_id">서비스 구분</label>
                                <select name="service_id" id="service_id">
                                    <option value="" >전체</option>
                                    @foreach ($services as $service)
                                        <option value={{ $service->id }} @selected(Request::get("service_id", null) == $service->id)>{{ $service->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="pass_overall">합격 점수</label>
                                <select name="pass_overall" id="pass_overall">
                                    <option value="">전체</option>
                                    @foreach ($scores as $score)
                                    <option value="{{ $score }}" @selected(Request::get("pass_overall") == $score)>{{ $score }} 이상</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="attainment_period">달성 기간</label>
                                <select name="attainment_period" id="attainment_period">
                                    <option value="">전체</option>
                                    @foreach ($attainmentPeriods as $period)
                                    <option value="{{ $period }}" @selected(Request::get("attainment_period") == $period)>{{ $period }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="target_country_id">목적 국가</label>
                                <select name="target_country_id" id="target_country_id">
                                    <option value="target_country_id">전체</option>
                                    @foreach ($countries as $country)
                                    <option value="{{ $country->id }}" @selected(Request::get("target_country_id") == $country)>{{ $country->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="goal_id">목적</label>
                                <select name="goal_id" id="goal_id">
                                    <option value="">전체</option>
                                    @foreach ($goals as $goal)
                                    <option value="{{ $goal->id }}" @selected(Request::get("goal_id") == $goal)>{{ $goal->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="search-input">
                                <label for="exam_date_start">시험 응시일</label>
                                <input type="date" name="exam_date_start" value="{{ Request::get("exam_date_start") }}">
                                -
                                <input type="date" name="exam_date_end" value="{{ Request::get("exam_date_end") }}">
                            </div>
                            <div class="search-input">
                                <label for="product_id">상품명</label>
                                <input type="text" name="product_id" id="product_id" value="{{ Request::get('product_id') }}" placeholder="전체">
                            </div>
                            <div class="search-input">
                                <input type="hidden" name="paginate" value="{{ Request::get("paginate") }}">
                                <input type="hidden" name="order_by" value="{{ Request::get("order_by") }}">
                                <input type="hidden" name="sort" value="{{ Request::get("sort") }}">
                            </div>
                        </div>
                        <button type="submit" class="search-button">조회</button>
                    </form>

                </div> <!-- end card-body-->
            </div> <!-- end card-->
        </div> <!-- end col-->
    </div>
    <!-- end row -->

    <div class="row">
        <div class="col-xl-12 col-lg-12 order-lg-2 order-xl-1">
            <div class="card">
                <div class="card-body">
                    <div class="user-btn-wrap">
                        <div class="pagination-result">
                            <span>총 <strong class="point-color">{{ $posts->total() }}</strong>건</span>
                        </div>
                        <div class="pagination-helper">
                            <div class="pagination-wrapper">
                                {{ $posts->links("vendor.pagination.default") }}
                            </div>
                            <select id='paginate-control' class='form-select-sm data-length-select' onchange="copyValue('.data-length-select', 'input[name=paginate]', '.search-form')">
                                <option value="10" @selected(Request::get("paginate") == null || Request::get("paginate") == 10)>10개씩 보기</option>
                                <option value="30" @selected(Request::get("paginate") == 30)>30개씩 보기</option>
                                <option value="50" @selected(Request::get("paginate") == 50)>50개씩 보기</option>
                                <option value="100" @selected(Request::get("paginate") == 100)>100개씩 보기</option>
                            </select>
                            <button type="button" class="button btn-style-2" onclick="excelDownload('.search-form', '{{ route('api.board.post-excel', $boardId) ?? '' }}')">엑셀다운로드</button>
                            <button type="button" class="button btn-style-8" onclick="">증빙 자료 다운</button>
                            {{-- TODO 증빙자료 다운 --}}
                            <button type="button" class="button btn-style-8" onclick="edmPopupOpen({{ Js::from(route('board.popup.fixed-posts', $boardId)) }}, null);">상단고정 관리</button>
                        </div>
                    </div>
                    <table class="default-table">
                        <colgroup>
                            <col width="60">
                            <col width="120">
                            <col width="80">
                            <col width="100">
                            <col width="80">
                            <col width="80">
                            <col width="100">
                            <col width="80">
                            <col width="80">
                            <col>
                            <col>
                            <col width="80">
                            <col width="80">
                            <col width="80">
                        </colgroup>
                        <thead class="table-light">
                            <tr>
                                <th scope="col" class="th_nm">번호</th>
                                <th scope="col">등록일시</th>
                                <th scope="col">전시 상태</th>
                                <th scope="col">서비스 구분</th>
                                <th scope="col">합격 점수</th>
                                <th scope="col">달성 기간</th>
                                <th scope="col">시험 응시일</th>
                                <th scope="col">목적 국가</th>
                                <th scope="col">목적</th>
                                <th scope="col">상품명</th>
                                <th scope="col">제목</th>
                                <th scope="col">조회수</th>
                                <th scope="col">댓글</th>
                                <th scope="col">작성자</th>
                            </tr>
                        </thead>
                        <tbody style="text-align: center">
                            @forelse ($posts as $post)
                            <tr onclick="window.location.href='{{ route('board.post-detail', [$boardId, $post->id]) }}'">
                                <td>{{ $post->id }}</td>
                                <td>
                                    @if (isset($post->created_at))
                                    {{ explode(" ", $post->created_at)[0] }} <br>
                                    {{ explode(" ", $post->created_at)[1] }}
                                    @else
                                        -
                                    @endif
                                </td>
                                <td>{{ $post->activated == 1 ? "전시" : "비전시" }}</td>
                                <td>{{ $post->service?->name }}</td>
                                <td>{{ $post->pass_overall }}</td>
                                <td>{{ $post->attainment_period }}</td>
                                <td>{{ isset($post->exam_date) ? explode(" ", $post->exam_date)[0] : "-" }}</td>
                                <td>{{ $post->targetCountry->name }}</td>
                                <td>{{ $post->goal->name }}</td>
                                <td class="text-left">
                                    <a href="{{ Js::from(route('product.detail', $post->product?->id ?? '')) }}">{{ $post->product?->name }}</a>
                                </td>
                                <td>{{ $post->title }}</td>
                                <td><strong class="point-color">{{ $post->views }}</strong>회</td>
                                <td><strong class="point-color">{{ count($post->comments) }}</strong>개</td>
                                <td><a href="{{ route('user.detail', $post->createdBy?->id) }}">{{ $post->createdBy?->edm_id }}</a></td>
                            </tr>
                            @empty
                            <tr><td colspan="14">No data</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div> <!-- end card-body-->
            </div> <!-- end card-->
        </div> <!-- end col-->
    </div>
    <!-- end row -->
</div>
@endsection

@push("script")
<script>
    let createdByTomSelect = null;
    let productIdTomSelect = null;

    window.addEventListener("load", () => {
        createdByTomSelect = new TomSelect("#created_by", {
            plugins: [
                "input_autogrow",
            ],
            valueField: "id",
            labelField: "name",
            searchField: "name",
            maxItems: 1,
            load: (query, callback) => {
                edmAjax({
                    method: "GET",
                    url: route('api.user.by-name'),
                    data: {
                        query: query,
                    },
                    callback: callback,
                    isBlock: false,
                });
            },
            onFocus: () => {
                edmAjax({
                    method: "GET",
                    url: route('api.user.by-name'),
                    data: {
                        count: 5
                    },
                    callback: response => {
                        createdByTomSelect.addOptions(response.data);
                        createdByTomSelect.open();
                    },
                    isBlock: false,
                });
            },
        });

        productIdTomSelect = new TomSelect("#product_id", {
            plugins: [
                "input_autogrow",
            ],
            valueField: "id",
            labelField: "name",
            searchField: "name",
            maxItems: 1,
            load: (query, callback) => {
                edmAjax({
                    method: "GET",
                    url: route('api.product.by-name'),
                    data: {
                        query: query,
                    },
                    callback: callback,
                    isBlock: false,
                });
            },
            onFocus: () => {
                edmAjax({
                    method: "GET",
                    url: route('api.product.by-name'),
                    data: {
                        count: 5
                    },
                    callback: response => {
                        productIdTomSelect.addOptions(response.data);
                        productIdTomSelect.open();
                    },
                    isBlock: false,
                });
            },
        });
    });
</script>
@endpush