@extends('layout')

@section('gnb', view('gnb', ['service'=>'ielts']))

@section('subgnb', view('ielts.gnb'))

@section('content')
<div class="container">
    <div class="level-test-contents">
        <div class="wrapper">
            @if (empty(auth()->check()) and (empty(session()->get('name')) or empty(session()->get('phone'))))
                <div class="level-test-contents">
                    <div class="wrapper">
                        <div class="submit-result">
                            <h2>레벨테스트 결과보기</h2>
                            <div>
                                레벨테스트시 입력하셨던 이름과 전화번호를 입력하거나, <a href="/login?url=/ielts/level-test/result/{{ $id }}" style="color: rgb(0, 140, 255)">로그인</a>해 주세요
                            </div>
                            <div class="submit-input">
                                <form name="submit-result" method="post" action="/ielts/level-test/grade/{{ $id }}">
                                    @csrf
                                    <div>
                                        <input type="text" id="name" name="name" placeholder="이름" required="required">
                                        <input type="text" id="phone" name="phone" placeholder="전화번호" required="required">
                                        <button type="submit" class="btn-red">결과보기</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            @else
                <h2>레벨테스트 결과</h2>
                <div class="result-wrapper">
                    <strong>레벨 평가</strong>
                    <div class="flex">
                        <div>
                            <div class="level-chart">
                                <div class="level-result">
                                    <div>
                                        <p>IELTS 기준</p>
                                        <strong>{{ $user_level_txt[$user_level][0] }}</strong>
                                    </div>
                                    <div>
                                        <p>100점 기준</p>
                                        <strong>점수 {{ $total_score }}</strong>
                                    </div>
                                </div>
                                <canvas id="chart" width="443" height="268">

                                </canvas>
                            </div>
                        </div>
                        <div class="result-text">
                            <strong>Band Score Table에 따른 수준</strong>
                            <p>
                                {{ $user_level_txt[$user_level][1] }}
                            </p>
                            <p>
                                @if ($user_level == 'C')
                                    익숙한 몇 가지 상황에서만 언어구사가 가능하고 내용의 이해나 표현에 있어서 오해가 잦고 복잡하고 어려운 어휘를 사용하지 못하는 응시자임을 나타냅니다.
                                @elseif($user_level == 'B')
                                    대부분의 상황에서 실수를 하긴 하지만 전체적인 의미는 파악할 수 있고 부분적인 언어 구사력을 지니고 있는 응시자로 특히 자신의 분야에서 기본적인 의사소통은 가능한 응시자임을 나타냅니다.
                                @elseif($user_level == 'A')
                                    때로 부정확하거나 비적절한 언어를 구사하고 일부 상황에 대한 이해를 못하는 경우도 있지만 전체적으로 난이도가 높은 언어를 잘 구사하고 자세한 내용의 이해가 가능한 응시자임을 나타냅니다.
                                @endif
                            </p>
                            <strong>점수 결과</strong>
                            <p>
                                <strong>{{ session()->get('name') }}</strong>님의 점수<br>
                                Voca Test : <span class="red">{{ $voca_score }}점 / 30점</span><br>
                                Wrting Test : <span class="red">{{ $writing_score }}점 / 70점</span><br>
                                Total Score : <span class="red">{{ $total_score }}점 / 100점</span><br>
                                IELTS 기준 Band Score : <span class="red">{{ $user_level_txt[$user_level][0] }}</span><br>
                            </p> 
                        </div>
                    </div>
                </div>
                <div class="result-wrapper" style="border-bottom: 0;">
                    <strong>학습 코스 가이드</strong>  
                    <div class="course-guide">
                        <div class="course-title">
                            <i class="ico-guide-01">
                                강좌플랜 아이콘
                            </i>
                            <strong>강좌 Plan</strong>
                        </div>
                        <div class="guide">
                            <p>
                                레벨테스트 결과, 현재 <span class="red">{{ $user_level_txt[$user_level][0] }}</span>로 보입니다.<br>
                                @if ($user_level == 'C')
                                    기초부터 실전까지 탄탄히 다질 수 있는 <span class="red">‘ALL-PASS IELTS, 입문 200% 페이백’</span> 강좌를 추천드립니다.
                                @elseif($user_level == 'B')
                                    기초부터 실전까지 탄탄히 다질 수 있는 <span class="red">‘ALL-PASS IELTS, N개월 알짜패스’</span> 강좌를 추천드립니다.
                                @elseif($user_level == 'A')
                                    고득점 목표강좌 수강과 시험응시까지 한번에 준비할 수있는 <span class="red">‘FINAL! One-Stop IELTS, 실전 200% 페이백’</span> 강좌를 추천드립니다.
                                @endif
                            </p>

                            @if ($user_level == 'C' or $user_level == 'B')
                                <p>
                                    [대상]<br>
                                    ・IELTS의 기초부터 다지고 싶은 분<br>
                                    ・IELTS 실전력을 키워 목표 점수를 달성하고 싶은 분<br>
                                    ・IELTS 성적 정체기를 겪고 있는 분<br>
                                    ・IELTS의 빈틈을 탄탄히 메꾸고 싶으신 분
                                </p>
                                <p>
                                    [학습 전략]<br>
                                    ・ 필수 어휘 및 문장 단위의 영작법<br>
                                    ・ Writing 기초 다지기와 주제별 패턴훈련<br>
                                    ・ 기초 발음 훈련을 통한 Speaking 실력 향상
                                </p>
                                <p>
                                    [구성]<br>
                                    ・ 수강 기간 180일<br>
                                    ・ 교재 + 비법서 11권 (Cambridge 17, 18 포함)<br>
                                    ・ 영국문화원 아이엘츠 시험 응시권<br>
                                    ・ 첨삭 옵션 추가 시 : 주1회 첨삭 또는 1일 5회 첨삭
                                </p>
                            @elseif($user_level == 'A')
                                <p>
                                    [대상]<br>
                                    ・IELTS 실전력을 키워 고득점 점수를 달성하고 싶은 분<br>
                                    ・IELTS 성적 정체기를 겪고 있는 분<br>
                                    ・IELTS의 빈틈을 탄탄히 메꾸고 싶으신 분
                                </p>
                                <p>
                                    [학습 전략]<br>
                                    ・IELTS 전영역 고난이도 유형별 전략 학습<br>
                                    ・영역별 문제풀이로 최신 기출경향 파악<br>
                                    ・파이널 특강 - 시험직전 고득점 TIP
                                </p>
                                <p>
                                    [구성]<br>
                                    ・ 수강 기간 180일<br>
                                    ・ 교재 + 비법서 8권 (Cambridge 17, 18 포함)<br>
                                    ・ 영국문화원 아이엘츠 시험 응시권<br>
                                    ・ 첨삭 옵션 추가 시 : 주1회 첨삭 또는 1일 5회 첨삭
                                </p>
                            @endif
                        </div>
                    </div>
                    <div class="course-guide">
                        <div class="course-title">
                            <i class="ico-guide-01">
                                강좌플랜 아이콘
                            </i>
                            <strong>수업 Plan</strong>
                        </div>
                        <div class="guide">
                            <p>
                                @if ($user_level == 'C' or $user_level == 'B')
                                    [추천 학습 순서]<br>
                                    기본다지기 → Kings 4.0+ → Cambridge 17, 18 → 실전모의고사<br>
                                    더불어 함께 제공되는 단어장 및 비법서로 1일 목표량의 부가 학습을 꾸준히 이어가시면 성적 향상에 큰 도움이 됩니다.<br>
                                    모든 시험은 기본기가 제일 중요합니다.<br>
                                    아이엘츠의 탄탄한 기본기를 통한 7.0 고득점 달성과 시험 응시권까지 한 번에 가능한 ALL-PASS IELTS를 추천합니다.
                                @elseif($user_level == 'A')
                                    [추천 학습 순서]<br>
                                    Kings 6.0 이론/문제풀이 -> Cambridge 17, 18 -> 실전기출 W/S -> 실전모의고사 Vol.1 -> 파이널 특강<br>
                                    Kings강좌를 통해 이론과 유형별 전략을 익히고, IELTS의 바이블 Cambridge 강의로 실전문제풀이 훈련을 하세요.<br>
                                    이후 실전기출W/S과 실전모의고사로 기출문제 집중공략을 학습하고, 시험 직전 파이널 특강으로 IELTS 시험 완벽대비가 가능합니다.<br>
                                    더불어 함께 제공되는 단어장 및 비법서로 1일 목표량의 부가 학습을 꾸준히 이어가시면 성적 향상에 큰 도움이 됩니다.
                                @endif
                            </p>
                            <!-- 강좌 리스트 -->
                            <div class="rcmd-course">
                                @if ($user_level == 'C')
                                    <!-- 오전반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">IELTS 기초~ 고득점 준비를 위한 최적의 선택</p>
                                        <h3>ALL-PASS IELTS</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_01.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 초보자를 위한 기초 강의 포함!<br>
                                            · 최신 cambridge IELTS 시리즈포함<br>
                                            · 7.0 점수 달성까지 ‘무제한 수강’<br>
                                            ·  Writing/Speaking 첨삭도 ‘무제한 연장’<br>
                                            · 최신 강의 +교재 11권 포함<br>
                                            · 영국문화원 IELTS 시험응시권 100% 증정<br>
                                            (최대 333,000원 혜택) *UKVI CDT 시험 기준
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                    <!-- 저녁반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">IELTS 기초 ~ 6.5 완벽준비!</p>
                                        <h3>입문 200% 페이백</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_02.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 초보자를 위한 기초 강의 포함!<br>
                                            · 6.5목표 최적의 강좌 구성<br>
                                            · 최신 cambridge IELTS 시리즈<br>
                                            · 최신 강의 + 교재 10권 모두 포함<br>
                                            · 1일 1강만 하면 200% 페이백 !
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                @elseif($user_level == 'B')
                                    <!-- 오전반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">IELTS 기초~ 고득점 준비를 위한 최적의 선택</p>
                                        <h3>ALL-PASS IELTS</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_01.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 초보자를 위한 기초 강의 포함!<br>
                                            · 최신 cambridge IELTS 시리즈포함<br>
                                            · 7.0 점수 달성까지 ‘무제한 수강’<br>
                                            ·  Writing/Speaking 첨삭도 ‘무제한 연장’<br>
                                            · 최신 강의 +교재 11권 포함<br>
                                            · 영국문화원 IELTS 시험응시권 100% 증정<br>
                                            (최대 333,000원 혜택) *UKVI CDT 시험 기준
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                    <!-- 저녁반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">인강도 내가 원하는 만큼 수강하자!</p>
                                        <h3>N개월 알짜패스</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_03.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 90일/150일/365일 원하는 기간 수강!<br>
                                            · 1일 1,000원대로 인강 학습<br>
                                            · 기초부터 7.0까지 최적의 강의!<br>
                                            · 최신 cambridge IELTS 시리즈 포함!<br>
                                            · 강남 IELTS 어학원 현장강의 영상 포함!<br>
                                            · 최신 강의 + 교재 8권 포함
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                @elseif($user_level == 'A')
                                    <!-- 오전반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">2024 유학, 이민을 위한 FINAL IELTS!</p>
                                        <h3>FINAL! One-Stop IELTS</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_04.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 7.0 목표 최적의 강좌 모음!<br>
                                            · 최신 Cambridge IELTS 시리즈 포함!<br>
                                            · 기초부터 7.0까지 최적의 강의!<br>
                                            · Writing/Speaking 첨삭도 ‘무제한 연장’<br>
                                            · 최신 강의 + 교재 8권 포함<br>
                                            · 영국문화원 IELTS 시험응시권 100% 증정<br>
                                            (최대 333,000원 혜택) *UKVI CDT 시험 기준
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                    <!-- 저녁반 선택 시, 아래와 상품이 나열되어 합니다. -->
                                    <div>
                                        <p class="red">IELTS 실전 실력 단기간 향상!</p>
                                        <h3>실전 200% 페이백</h3>
                                        <div class="thumbnail">
                                            <img src="{{ env('AWS_S3_IMG_URL') }}/ielts/common/img_class_05.png" alt="">
                                        </div>
                                        <div class="desc">
                                            · 실전력 향상을 위한 파이널 강좌!<br>
                                            · 7.0 목표 최적의 강좌 구성<br>
                                            · 최신 Cambridge IELTS 시리즈<br>
                                            · 최신 강의 + 교재 9권 모두 포함<br>
                                            · 1일 1강만 하면 200% 페이백 !
                                        </div>
                                        <a href="#none">자세히 보기</a>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
                <table class="answer-check-table">
                    <colgroup>
                        <col width="15%">
                        <col width="50%">
                        <col width="35%">
                    </colgroup>
                    <thead>
                        <tr>
                            <th>유형</th>
                            <th>문제&amp;정답</th>
                            <th>정답유무 및 내가 쓴 답</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <th rowspan="8">어휘테스트</th>
                            <td>
                                <span class="q">경험</span>
                                <span class="a">experience</span>
                            </td>
                            <td>{{ $test->lt_test1 == 'experience' ? 'O':'X ('.$test->lt_test1.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">환경</span>
                                <span class="a">environment</span>
                            </td>
                            <td>{{ $test->lt_test2 == 'environment' ? 'O':'X ('.$test->lt_test2.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">교통체증</span>
                                <span class="a">traffic congestion</span>
                            </td>
                            <td>{{ $test->lt_test3 == 'traffic congestion' ? 'O':'X ('.$test->lt_test3.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">외국어</span>
                                <span class="a">foreign language</span>
                            </td>
                            <td>{{ $test->lt_test4 == 'foreign language' ? 'O':'X ('.$test->lt_test4.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">야채</span>
                                <span class="a">vegetable</span>
                            </td>
                            <td>{{ $test->lt_test5 == 'vegetable' ? 'O':'X ('.$test->lt_test5.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">실업</span>
                                <span class="a">unemployment</span>
                            </td>
                            <td>{{ $test->lt_test6 == 'unemployment' ? 'O':'X ('.$test->lt_test6.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">정부</span>
                                <span class="a">government / administration</span>
                            </td>
                            <td>{{ ($test->lt_test7 == 'government' or $test->lt_test7 == 'administration') ? 'O':'X ('.$test->lt_test7.')' }}</td>
                        </tr>
                        <tr>
                            <td>
                                <span class="q">Health</span>
                                <span class="a">obesity / stress</span>
                            </td>
                            <td>{{ $test->lt_test8 == 'obesity|stress' ? 'O':'X ('.$test->lt_test8.')' }}</td>
                        </tr>

                        <tr>
                            <th rowspan="13">영작테스트</th>
                            <td>
                                <span class="q">My sister has borrowed the novel from me.</span><br />
                                I </span><font color="#D53236">have lent</font> <span class="q">my sister the novel.</span>
                            </td>
                            <td>{{ $test->lt_test9 == 'have lent' ? 'O':'X ('.$test->lt_test9.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">She hasn't read a novel by Joan Brady before.<br />
                                This is </span><font color="#D53236">the first</font> <span class="q">novel by Joan Brady that she has read.</span>
                            </td>
                            <td>{{ $test->lt_test10 == 'the first' ? 'O':'X ('.$test->lt_test10.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">The novel is longer than Joan Brady's other books.<br />
                                    Joan Brady's other books are not as</span><font color="#D53236">long as</font> <span class="q">this one.</span>
                            </td>
                            <td>{{ $test->lt_test11 == 'long as' ? 'O':'X ('.$test->lt_test11.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">How much does the novel cost?<br />
                                    What is </span><font color="#D53236">the cost of</font> <span class="q">the novel?</span>
                            </td>
                            <td>{{ $test->lt_test12 == 'the cost of' ? 'O':'X ('.$test->lt_test12.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">A family ticket costs $10.<br />
                                    The cost of a family ticket </span><font color="#D53236">is</font> <span class="q">$10.</span>
                            </td>
                            <td>{{ $test->lt_test13 == 'is' ? 'O':'X ('.$test->lt_test13.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">You don't have to pay to visit the zoo on Thursdays.<br />
                                    You can visit the zoo </span><font color="#D53236">without</font> <span class="q">paying on Thursdays.</span>
                            </td>
                            <td>{{ $test->lt_test14 == 'without' ? 'O':'X ('.$test->lt_test14.')' }}</td>
                        </tr>

                        <tr>
                            <td>
                                <span class="q">Feeding the animals is not allowed.<br />
                                    You must not </span><font color="#D53236">feed</font> <span class="q">the animals.</span>
                            </td>
                            <td>{{ $test->lt_test15 == 'feed' ? 'O':'X ('.$test->lt_test15.')' }}</td>
                        </tr>
                
                    </tbody>
                </table>
            @endif
        </div>
    </div>
</div>
@endsection

@section('footer', view('footer'))

@section('script')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0"></script>
<script>
    $(document).ready(function () {
        Chart.defaults.font.size = 16;
        $(window).resize(function () { 
            var ww =$(window).width();
            if ( ww <= 768) {
                Chart.defaults.font.size = 12;
            } else {
                Chart.defaults.font.size = 16;
            }
        });
        Chart.defaults.font.family = "'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', '맑은고딕', MalgunGothic, 돋움, Dotum, arial, sans-serif";
        Chart.defaults.color = "#333333";
        Chart.register(ChartDataLabels);
        const ctx = document.getElementById('chart');
        new Chart(ctx, {
            type: 'bar',
            data: {
                labels: [['Voca Test'], ['Writing Test'], '총점'],
                datasets: [{
                    data: [{{ $voca_score }}, {{ $writing_score }}, {{ $total_score }}],
                    borderWidth: [0, 0, 0],
                    backgroundColor: ['#D53236','#D53236','#D53236'],
                    barThickness: 26
                }]
            },
            options: {
                plugins: { 
                    tooltip: {
                        enabled: false // <-- this option disables tooltips
                    },
                    legend: {
                        display: false,
                    },
                    datalabels: {
                        anchor: 'end',
                        align: 'top',
                        formatter: function(value, context) {
                                return Math.round(value) + '점';
                        },
                        font: {
                        weight: 'bold'
                        }
                    },
                },
                scales: {
                    x: {
                        grid: {
                            display: false,
                        },
                    },
                    y: {
                        beginAtZero: true,
                        min: 0,
                        max: 100,
                        ticks: {
                        // forces step size to be 50 units
                            stepSize: 50,
                            callback: function(value, index, ticks) {
                                return value + '점';
                            }
                        },
                        grid: {
                            display: false,
                        },
                    },
                },
            }
        });
    });
</script>
@endsection