@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")
    <div class="container_m">
        <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">닫기</a>
            </div>
            <div class="correct-popup-container">
                <div class="correct-popup-contents">
                    <!-- basic s -->
                    @if ($feedbackRequest->enrollmentFeedbackResponse)
                        @php
                            $feedbackResponse = $feedbackRequest->enrollmentFeedbackResponse;
                        @endphp
                    <div class="correct-detail-wrap">
                        <h3>
                            <strong>항목별</strong> 점수
                        </h3>
                        <h4>
                            <i class="ico-score"></i>
                            Band Score <strong>{{ number_format($feedbackResponse->band_score, 1) }}</strong>
                        </h4>

                        <div class="score-wrap">
                            <div class="box">
                                <p class="txt">Fluency</p>
                                <p class="score">{{ number_format($feedbackResponse->grade_1, 1) }}</p>
                            </div>
                            <div class="box">
                                <p class="txt">Lexical Resources</p>
                                <p class="score">{{ number_format($feedbackResponse->grade_2, 1) }}</p>
                            </div>
                            <div class="box">
                                <p class="txt">Grammatical Range & Accuracy</p>
                                <p class="score">{{ number_format($feedbackResponse->grade_3, 1) }}</p>
                            </div>
                            <div class="box">
                                <p class="txt">Pronunciation</p>
                                <p class="score">{{ number_format($feedbackResponse->grade_4, 1) }}</p>
                            </div>
                        </div>

                    </div>
                    @endif
                    <div class="correct-detail-wrap">
                        @if ($feedbackRequest->enrollmentFeedbackPass->feedbackPass->type == 'Basic' || $feedbackRequest->enrollmentFeedbackPass->feedbackPass->type == 'CDT')
                        <div class="speaking-textarea">
                            <div class="swiper-pagination3"></div>
                            <div class="swiper skSwiper3">
                                <div class="swiper-wrapper">
                                        @if (!empty($feedbackResponse->feedback_part_1))
                                            <div class="swiper-slide">
                                                <h3>
                                                    첨삭 내용
                                                </h3>
                                                <ul class="file-down">
                                                    <li>
                                                        <a href="#none" onclick="downloadFeedback(1)">
                                                            <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/mo/ico-file-bs.svg" alt="">
                                                            <div>
                                                                <span class="file-name">Speaking_Part_1.pdf</span>
                                                                <span class="date">{{ \Carbon::parse($feedbackResponse->updated_at)->locale('ko')->isoFormat('YY.MM.DD(dd)') }}</span>
                                                            </div>
                                                            <i class="ico-download"></i>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <textarea name="" id=""  readonly>{{ $feedbackResponse->feedback_part_1 }}</textarea>
                                            </div>
                                        @endif

                                        @if (!empty($feedbackResponse->feedback_part_2))
                                                <div class="swiper-slide">
                                                    <h3>
                                                        첨삭 내용
                                                    </h3>
                                                    <ul class="file-down">
                                                        <li>
                                                            <a href="#none" onclick="downloadFeedback(2)">
                                                                <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/mo/ico-file-bs.svg" alt="">
                                                                <div>
                                                                    <span class="file-name">Speaking_Part_2.pdf</span>
                                                                    <span class="date">{{ \Carbon::parse($feedbackResponse->updated_at)->locale('ko')->isoFormat('YY.MM.DD(dd)') }}</span>
                                                                </div>
                                                                <i class="ico-download"></i>
                                                            </a>
                                                        </li>
                                                    </ul>
                                                    <textarea name="" id="" readonly>{{ $feedbackResponse->feedback_part_2 }}</textarea>
                                                </div>
                                        @endif


                                        @if (!empty($feedbackResponse->feedback_part_3))
                                                <div class="swiper-slide">
                                                    <h3>
                                                        첨삭 내용
                                                    </h3>
                                                    <ul class="file-down">
                                                        <li>
                                                            <a href="#none" onclick="downloadFeedback(3)">
                                                                <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/mo/ico-file-bs.svg" alt="">
                                                                <div>
                                                                    <span class="file-name">Speaking_Part_3.pdf</span>
                                                                    <span class="date">{{ \Carbon::parse($feedbackResponse->updated_at)->locale('ko')->isoFormat('YY.MM.DD(dd)') }}</span>
                                                                </div>
                                                                <i class="ico-download"></i>
                                                            </a>
                                                        </li>
                                                    </ul>
                                                    <textarea name="" id="" readonly>{{ $feedbackResponse->feedback_part_3 }}</textarea>
                                                </div>
                                       @endif
                                </div>
                            </div>
                            <script>
                                var bullet = [];

                                @if (!empty($feedbackResponse->feedback_part_1))
                                bullet.push('Part 1');
                                @endif

                                @if (!empty($feedbackResponse->feedback_part_2))
                                bullet.push('Part 2');
                                @endif

                                @if (!empty($feedbackResponse->feedback_part_3))
                                bullet.push('Part 3');
                                @endif

                                // bullet이 비어있으면 기본값 설정
                                if (bullet.length === 0) {
                                    bullet = ['Part 2', 'Part 3'];
                                }


                                var swiper = new Swiper(".skSwiper3", {
                                    pagination: {
                                        el: ".swiper-pagination3",
                                        clickable: true,
                                        renderBullet: function (index, className) {
                                            return '<div class="' + className + '"><span>' + (bullet[index]) + '</span></div>';
                                        }
                                    },
                                });

                                function downloadFeedback(part) {
                                    $.ajax({
                                        url: '{{ route("classroom.download-request-text", ['id' => $feedbackRequest->id, 'service' => $service]) }}&part=' + part,
                                        method: 'GET',
                                        xhrFields: {
                                            responseType: 'blob'
                                        },
                                        success: function(data) {
                                            const blob = new Blob([data], { type: 'application/pdf' });
                                            const link = document.createElement('a');
                                            link.href = window.URL.createObjectURL(blob);
                                            link.download = 'Speaking_Part_'+part+'.pdf';
                                            link.click();
                                        },
                                        error: function() {
                                            alert('Failed to download PDF.');
                                        }
                                    });
                                }
                            </script>
                        </div>
                        @else
                            <div class="correct-detail-wrap">
                                <h3>
                                    첨삭 내용
                                </h3>
                                <h5>
                                    <strong>{{ $feedbackResponse->teacher->name }}</strong>
                                </h5>
                                @if (!empty($feedbackResponse->feedback_files))
                                <ul class="file-down">
                                    @foreach(json_decode($feedbackResponse->feedback_files) as $file)
                                    <li>
                                        <a href="{{ app(S3Helper::class)->getDownloadPresignedUrl($file->s3_path) }}" target="_blank">
                                            @if ($feedbackRequest->enrollmentFeedbackPass->feedbackPass->type == 'Premium')
                                                <img src="{{$feedbackRequest->teacher ? app(S3Helper::class)->getPublicUrl($feedbackRequest->teacher->photo) : app(S3Helper::class)->getPublicUrl($feedbackResponse->teacher->photo)}}" alt="">
                                            @endif
                                            <div>
                                                <span class="file-name">{{ $file->original_name }}</span>
                                                <span class="date">{{ \Carbon::parse($feedbackResponse->updated_at)->locale('ko')->isoFormat('YY.MM.DD(dd)') }}</span>
                                            </div>
                                            <i class="ico-download"></i>
                                        </a>
                                    </li>
                                    @endforeach
                                </ul>
                                @endif
                            </div>
                        @endif
                    </div>
                    <!-- // -->
                    <div class="correct-detail-wrap">
                        @include('classroom.feedback-comment-mobile')
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section($service.'-script')
    <script>
        $(document).ready(function () {

        });
    </script>
@endsection