@extends('classroom.feedback.layout-mobile')

@section("feedback-content")
    <div class="correct-popup-wrap"  style="display: block;">
        <div class="correct-popup-header">
            <a href="{{route('classroom.feedback-list', ['service' => $service])}}" class="ico-back">뒤로가기</a>
            <h2>
                <span>첨삭 내역</span>
                <strong>첨삭 피드백</strong>
            </h2>
            <a href="{{route('classroom.feedback-list', ['service' => $service])}}" class="ico-close" data-disabled='true'>닫기</a>
        </div>
        <div class="correct-popup-container">
            @if ($feedbackRequest->enrollmentFeedbackResponse)
                @php
                    $feedbackResponse = $feedbackRequest->enrollmentFeedbackResponse;
                @endphp

                    <div class="correct-popup-contents">
                    <!-- cdt w -->

                    @include('classroom.feedback.partials.grade', ['subject' => 'Writing', 'isMobile' => 1])

                    @if (!empty($feedbackResponse->feedback_files))
                        <div class="correct-detail-wrap">
                            <h3>
                                첨삭 내용
                            </h3>
                            @if ( $feedbackType == 'CDT')
                                @foreach ($cdtFeedbacks as $request )
                                    @include('classroom.feedback.partials.files', [
                                        'subject' => 'Writing',
                                        'feedbackResponse' => $request->enrollmentFeedbackResponse,
                                        'request' => $request,
                                        'isMobile' => true
                                    ])
                                @endforeach
                            @else
                                @include('classroom.feedback.partials.files', ['subject' => 'Writing', 'isMobile' => true])
                            @endif
                        </div>
                    @endif
                    <!-- // -->
                    <x-comment.comment-replay page="feedback" />
                </div>

            @endif

            <div id="info01" class="info-popup-wrap">
                <div class="info-popup height-auto">
                    <a href="#none" class="close-info"></a>
                    {{-- <h3>
                        <i class="ico-pencil"></i>
                        내답변 보기
                    </h3> --}}
                    <div @class(['overflow-wrap', "cdt" => $feedbackType == 'CDT'])>
                        @if ( $feedbackType == 'CDT')
                            @include('classroom.feedback.partials.requests', ['isMobile' => true])
                        @else
                            @include('classroom.feedback.partials.request', ['isMobile' => true])
                        @endif
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection

@section('feedback-script')

@if ($feedbackType == 'CDT')
        <script>
            let bullets = ['Task 1','Task 2'];
            let swiper = null;
            function onEvent() {
                if ( swiper == null ) {
                    swiper = new Swiper(".ctSwiper", {
                        navigation: {
                            nextEl: ".btn-next",
                            prevEl: ".btn-prev",
                        },
                        pagination: {
                            el: ".swiper-pagination",
                            clickable: true,
                            renderBullet: function (index, className) {
                                return '<div class="' + className + '"><span>'+bullets[index]+'</span></div>';
                            }
                        },
                    });
                }
            }

        </script>
    @endif

@endsection