@extends("board.layout.layout-board")
@section("header")
{!! resource('js/components/multiSelect.js') !!}
{!! resource('css/components/multiSelect.css') !!}
@endsection


@section("board-content")


    @php
        $content = $post->content();
        $speaker = $post->speaking();
    @endphp

<li class="mb-3 row mx-0 align-middle">
    <label class="col-1">시험장소</label>
    <div class="col-11">
        <select class="form-select" name="exam_venue_id">
            @foreach($examVanues as $loc)
            <option value="{{ $loc->id }}">{{ $loc->location }} / {{ $loc->name }}</option>
            @endforeach
        </select>
    </div>
</li>

<li class="mb-3 row mx-0 align-middle">
    <label class="col-1">응시구분</label>
    <div class="col-5">{{ $post->exam_type == "CDT" ? "CDT 시험장" : "일반 시험장" }}</div>
    <label class="col-1">응시일자</label>
    <div class="col-5">
        <input type="date" name="exam_date" value="{{ $post->exam_date }}" class="form-control" />
    </div>
</li>

<li class="mb-3 row mx-0 align-middle">
    <label class="col-1">시험장 평가</label>
    <div class="col-11 row px-0 mx-0">
        <div class="col-2">
            <label>접근성</label>
            <div>
                <input type="hidden" name="access_rating" value="{{ $post->access_rating }}" />
                @for($i = 5 ; $i > 0 ; $i --)
                    <span @class(["badge", "btn-score",
                        "badge-warning" => $i == $post->access_rating,
                        "badge-outline-warning" => $i != $post->access_rating,
                    ])>{{ $i }}</span>
                @endfor
            </div>
        </div>
        <div class="col-2">
            <label>음향상태</label>

            <div>
                <input type="hidden" name="audio_rating" value="{{ $post->audio_rating }}" />
                @for($i = 5 ; $i > 0 ; $i --)
                    <span @class(["badge",  "btn-score",
                        "badge-warning" => $i == $post->audio_rating,
                        "badge-outline-warning" => $i != $post->audio_rating,
                    ])>{{ $i }}</span>
                @endfor
            </div>
        </div>
        <div class="col-2">
            <label>시설</label>
            <div>
                <input type="hidden" name="amenities_rating" value="{{ $post->amenities_rating }}" />
                @for($i = 5 ; $i > 0 ; $i --)
                    <span @class(["badge", "btn-score",
                        "badge-warning" => $i == $post->amenities_rating,
                        "badge-outline-warning" => $i != $post->amenities_rating,
                    ])>{{ $i }}</span>
                @endfor
            </div>
        </div>
    </div>
    <label class="col-1 mt-3"></label>
    <div class="col-11 row px-0 mx-0 mt-3">
        <label class="col-1">간단리뷰</label>
        <div class="col-11">
            @if ($content->title)
            <input type="hidden" class="form-control" name="title" value="" />
            <textarea class="form-control form-control-sm font-sm" rows="10" name="content">{{ $content->content }}</textarea>
            @else
            <input type="text" class="form-control font-sm" name="content" value="{{ $content->content }}">
            @endif
        </div>
    </div>

    <label class="col-1 mt-3">Speaker 평가</label>
    <div class="col-11 row px-0 mx-0 mt-3">
        <label class="col-1">제목</label>
        <div class="col-11">
            <input class="form-control font-sm" name="speaking_title" value="{{ $speaker->title }}" />
        </div>
    </div>
    <label class="col-1 mt-3"></label>
    <div class="col-11 row px-0 mx-0 mt-3">
        <label class="col-1">간단리뷰</label>
        <div class="col-11">
            <textarea class="form-control form-control-sm font-sm" rows="15" name="speaking_content">{!! $speaker->content !!}</textarea>
        </div>
    </div>
</li>
@endsection


@push("script")

    <script>
        $(function() {
            $('.btn-score').on("click", function() {
                const target = $(this).closest("div");

                target.find(".badge").removeClass("badge-warning").addClass("badge-outline-warning");
                $(this).addClass("badge-warning").removeClass("badge-outline-warning");

                target.find("input[type=hidden]").val($(this).text());
            })
        })
    </script>
@endpush