@php
    $lectureComparison = [];
@endphp

@extends($service.'.layout')

@section('page-title', "수강 신청")

@section($service.'-css')
	{!! resource('css/'.$service.'/sub.css') !!}
	{!! resource('css/myclass/lecture.css') !!}
@endsection

@section($service."-content")
<div class="lecture-container list-container {{ $service }}" id="wrap">
    <div class=" max-width">
        <div class="pageTitle">
            <button type="button" onclick="history.back()" class="backBtn mo-backBtn"></button>
            <h1>수강신청</h1>
        </div>
	<!-- 배너 (임시) -->
        @if ($service == 'ielts')
        <div class="lecture-banner-wrapper">
            <!-- todo 배너 -->
            <button type="button" class="comparisonPopupOn" style="background: linear-gradient(90deg, #7028FF 0%, #1500D5 96.36%, #fff 100%);">
                <p>나에게 딱 맞는 수강상품은? <br class="mo-br">한 눈에 비교하고 선택하세요.</p>
            </button>

            <!-- TODO 수강상품 비교 (팝업) -->
            @php
                $lectureComparison = [
                // 상품명, 아이콘구성, 옵션구성, 강좌구성(p태그), 제공강의수, 첨삭, CDT, 학습자료(교재), 수강기간, 수강대상, 수강료
                // 응시권 : lecture-ticket-con.svg / CDT모의고사 : lecture-mockTest-icon.svg / 환급 : lecture-refund-icon.svg
                // 응시권 : icon-1, cdt모의고사 : icon-2, 환급 : icon-3, 응시권 + cdt : icon-4
                    ['입문올패스',
                        'icon-4',
                        '무제한 연장 (180일)<br>매주 첨삭 (180일)<br>무제한 첨삭 (60일)',
                        '<p>edm 문법마스터</p> <p>edm IELTS 기본다지기</p> <p>실전모의고사1</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>Kings 4.0 이론</p> <p>Kings 4.0 문제풀이</p> <p>Kings 6.0 이론</p> <p>Kings 6.0 문제풀이</p> <p>실전기출 W/S</p> <p>파이널 특강</p>',
                        '(A) 383강 <br>/ (G) 342강',
                        '무제한/ 매주',
                        'CDT 2회 + 첨삭 2회',
                        '기본다지기 <br>캠브리지 19 외 8권',
                        '180일 <br>(무제한 첨삭: 60일) ',
                        'IELTS가 처음인 사람 <br>토익 점수 600점 이하 <br>IELTS 목표점수 6.0 이상',
                        '65만원<br>72만원<br>72만원'
                    ],['실전올패스',
                        'icon-4',
                        '무제한 연장 (180일)<br>매주 첨삭 (180일)<br>무제한 첨삭 (60일)',
                        '<p>실전모의고사1</p> <p>실전모의고사2</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>Kings 6.0 이론</p> <p>Kings 6.0 문제풀이</p> <p>실전기출 W/S</p> <p>파이널 특강</p>',
                        '(A) 302강 <br>/ (G) 251강',
                        '무제한/ 매주',
                        'CDT 2회 + 첨삭 2회',
                        '실전모의고사 <br>캠브리지 외 6권',
                        '180일 <br>(무제한 첨삭: 60일) ',
                        'IELTS 경험이 있는 사람 <br>토익 점수 600점 이하 <br>IELTS 목표점수 7.0 이상',
                        '54만원<br>61만원<br>61만원'
                    ],['N개월 실속팩',
                        'icon-2',
                        '90일 / 150일 / 365일',
                        '<p>edm IELTS 기본다지기</p> <p>edm 문법마스터</p> <p>실전모의고사1</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>Kings 6.0 이론</p> <p>Kings 6.0 문제풀이</p> <p>중급 Lv1</p> <p>중급 Lv2</p> <p>파이널 특강</p>',
                        '(A) 404강 <br>/ (G) 372강',
                        '베이직 5회권',
                        'CDT 2회',
                        '기본다지기 <br>캠브리지 외 4권',
                        '90일/150일/365일',
                        'IELTS가 처음인 사람 <br>토익점수 600점 이하 <br>IELTS 목표점수 6.0 이상',
                        '35만9천원 <br>39만9천원 <br>43만9천원'
                    ],['200% 환급반(입문)',
                        'icon-3',
                        '입문 / 실전',
                        '<p>edm IELTS 기본다지기</p> <p>실전모의고사1</p> <p>실전모의고사2</p> <p>edm 문법 마스터</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>edm IELTS Speaking</p> <p>Kings 4.0 이론</p> <p>Kings 4.0 문제풀이</p>',
                        '(A) 366강 <br>/ (G) 310강',
                        '베이직 5회권', '-',
                        '기본다지기<br>캠브리지 외 7권', '120일', '(입문) <br>IELTS가 처음인 사람 <br>토익점수 600점 이하 <br>IELTS 목표점수 6.0 이상', '35만9천원'
                    ],['200% 환급반(실전)',
                        'icon-3',
                        '입문 / 실전',
                        '<p>실전모의고사1</p><p>실전모의고사2</p><p>Cambridge IELTS 18</p><p>Cambridge IELTS 19</p><p>edm IELTS Speaking</p><p>Kings 6.0 이론</p><p>Kings 6.0 문제풀이</p><p>실전기출 W/S</p><p>파이널 특강</p>',
                        '(A) 308강 <br>/ (G) 257강',
                        '베이직 5회권',
                        '-',
                        '실전모의고사 <br>캠브리지 외 6권',
                        '120일',
                        '(실전) <br>IELTS 경험이 있는 사람 <br>토익점수 600점 이상 <br>IELTS 목표점수 6.0 이상',
                        '29만9천원'
                    ], ['라이팅 스피킹 30일',
                        'icon-4',
                        '-',
                        '<p>Writing Task1</p> <p>Writing Task2</p> <p>Speaking</p>',
                        '(A) 28강 <br>/ (G) 28강',
                        '1일 1첨삭',
                        'CDT 2회', '실전모의고사 <br>Essential Vocabulary 외 4권',
                        '30일',
                        'IELTS 경험이 있는 사람 <br>토익점수 600점 이상 <br>IELTS 목표점수 7.0 이상 <br>*라이팅/스피킹 특화된 강의',
                        '43만9천원'
                    ], ['간호패키지(입문)',
                        'icon-4',
                        '입문 / 실전',
                        '<p>edm IELTS 기본다지기</p> <p>실전모의고사1</p> <p>실전모의고사2</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>Kings 4.0 이론</p> <p>Kings 4.0 문제풀이</p> <p>Kings 6.0 이론</p> <p>Kings 6.0 문제풀이</p> <p>실전기출 W/S</p> <p>파이널 특강</p>',
                        '424강',
                        '매주첨삭',
                        'CDT 2회 + 첨삭 4회',
                        '기본다지기 <br>캠브리지 외 9권',
                        '210일',
                        '(입문) <br>IELTS가 처음인 사람 <br>토익점수 600점 이하 <br>IELTS 목표점수 7.0 이상',
                        '65만원'
                    ], ['간호패키지(실전)',
                        'icon-4',
                        '입문 / 실전',
                        '<p>실전모의고사1</p> <p>실전모의고사2</p> <p>Cambridge IELTS 18</p> <p>Cambridge IELTS 19</p> <p>Kings 6.0 이론</p> <p>Kings 6.0 문제풀이</p> <p>실전기출 W/S</p> <p>파이널 특강</p>',
                        '302강',
                        '매주첨삭',
                        'CDT 2회 + 첨삭 4회',
                        '실전모의고사 <br>캠브리지 외 6권',
                        '210일',
                        '(실전) <br>IELTS 경험이 있는 사람 <br>토익점수 600점 이상 <br>IELTS 목표점수 7.0 이상',
                        '54만원'
                    ]
                ];
            @endphp
            <div class="popupArea">
                <div class="popupWrap-lecture-comparison">
                    <div class="popup">
                        <div class="closeIcon closeBtn"></div>
                        <div class="textWrap">
                            <p class="title">수강상품 비교</p>
                            <div class="scrollWidth">
                                <div class="scrollWrap">
                                    <div class="selectArea flex sb">
                                        <p class="info-text">비교할 상품을 선택해 주세요.</p>
                                        <div class="dropDownMenu type2">
                                            <div class="selectBox">
                                                <button type="button" class="label" data-selected="수강 상품 선택" data-default="수강 상품 선택">수강 상품 선택</button>
                                                <div class="optionListWrap">
                                                    <div class="scrollWidth">
                                                        <ul class="optionList scrollWrap">
                                                            <!-- TODO 활성화 메뉴 active class 추가 -->
                                                            @foreach ($lectureComparison as $item)
                                                                <li class="optionItem"><button type="button" data-account="">{{ $item[0] }}</button></li>
                                                            @endforeach
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="dropDownMenu type2">
                                            <div class="selectBox">
                                                <button type="button" class="label" data-selected="수강 상품 선택" data-default="수강 상품 선택">수강 상품 선택</button>
                                                <div class="optionListWrap">
                                                    <div class="scrollWidth">
                                                        <ul class="optionList scrollWrap">
                                                            <!-- TODO 활성화 메뉴 active class 추가 -->
                                                            @foreach ($lectureComparison as $item)
                                                                <li class="optionItem"><button type="button" data-account="">{{ $item[0] }}</button></li>
                                                            @endforeach
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="comparison-table">
                                            <table>
                                                <thead>
                                                    <!-- TODO 선택한 상품명 -->
                                                    <th>비교항목</th>
                                                    <td></td>
                                                    <td></td>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <th></th>
                                                        <td>
                                                            <div class="iconBox">

                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="iconBox">

                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <th>옵션구성</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>강좌구성</th>
                                                        <td class="lecture-composition"></td>
                                                        <td class="lecture-composition"></td>
                                                    </tr>
                                                    <tr>
                                                        <th>제공<br class="mo_tab-br">강의수</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>첨삭</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>CDT</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>학습자료 <br>(교재)</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>수강기간</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>수강대상</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                    <tr>
                                                        <th>수강료</th>
                                                        <td></td>
                                                        <td></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                        <p class="bottom-text">*강의수와 교재 정보는 운영 상황이 따라 변동될 수 있습니다.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <button type="button" class="popupClose closeBtn">확인</button>
                    </div>
                    <div class="dim"></div>
                </div>
            </div>
        </div>
        @endif
        {{-- 검색 --}}
        <div class="lecture-top-wrapper">
            <div class="max-height">
                <div class="lecture-top-container">
                    @if ($service == 'ielts')
                        <div class="lecture-category-select-wrapper">
                            <p>나에게 맞는 강좌는?</p>
                            <div>
                                <form name="product-search-form" method="get" action="{{ route("enrol", ['service' => $service]) }}">
                                    <div class="flex sb align-c">
                                        <div class="lecture-category-select">
                                            <!-- <select name="module">
                                                <option value="">모듈</option>
                                                <option value="academic" @selected(request()->module == "academic")>Academic</option>
                                                <option value="general" @selected(request()->module == "general")>General</option>
                                            </select> -->
                                            <div class="dropDownMenu type2">
                                                <div class="selectBox">
                                                    <button type="button" class="label" data-selected="모듈" data-default="모듈">모듈</button>
                                                    <div class="optionListWrap">
                                                        <div class="scrollWidth">
                                                            <ul class="optionList scrollWrap">
                                                                <!-- 활성화 메뉴 active class 추가 -->
                                                                <li class="optionItem"><button type="button" data-account="Academic">Academic</button></li>
                                                                <li class="optionItem"><button type="button" data-account="General">General</button></li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- <select name="current_level">
                                                <option value="">현재 레벨</option>
                                                @foreach(config('edmclass.current_level') as $k => $v)
                                                <option value="{{ $k }}" @selected(request()->current_level == $k)>{{ $v }}</option>
                                                @endforeach
                                            </select> -->
                                            <div class="dropDownMenu type2">
                                                <div class="selectBox">
                                                    <button type="button" class="label" data-selected="현재 레벨" data-default="현재 레벨">현재 레벨</button>
                                                    <div class="optionListWrap">
                                                        <div class="scrollWidth">
                                                            <ul class="optionList scrollWrap">
                                                                <!-- 활성화 메뉴 active class 추가 -->
                                                                @foreach(config('edmclass.current_level') as $k => $v)
                                                                    <li class="optionItem"><button type="button" data-account="{{ $v }}">{{ $v }}</button></li>
                                                                @endforeach
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- <select name="etc_product_type">
                                                <option value="">시험 응시권</option>
                                                <option value="1" @selected(request()->etc_product_type == 1)>포함</option>
                                            </select> -->
                                            <div class="dropDownMenu type2">
                                                <div class="selectBox">
                                                    <button type="button" class="label" data-selected="시험 응시권" data-default="시험 응시권">시험 응시권</button>
                                                    <div class="optionListWrap">
                                                        <div class="scrollWidth">
                                                            <ul class="optionList scrollWrap">
                                                                <!-- 활성화 메뉴 active class 추가 -->
                                                                <li class="optionItem"><button type="button" data-account="포함">포함</button></li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                        <button type="submit" class="button">검색</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    @else
                        <ul class="lecture-tab-list">
                            @foreach($productCategories as $categoryName => $products)
                            <li class="lecture-tab common-tab">
                                <strong>{{ $categoryName }}</strong>
                                <p>
                                    @foreach ($products as $product)
                                    <a href="javascript:;" id="product-btn-{{ $product->id }}" data-product-id="{{ $product->id }}" data-module="{{ $product->module }}" data-category="{{ $categoryName }}">{{ $product->name }}</a>
                                    @endforeach
                                </p>
                            </li>
                            @endforeach
                        </ul>
                        <div class="lecture-tab-module common-tab">
                            <strong>모듈을 선택하세요</strong>
                            <p>
                                <a href="javascript:;" data-module="academic">Academic</a>
                                <a href="javascript:;" data-module="general">General</a>
                            </p>
                            <p>
                                <a>전체선택</a>
                            </p>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <div class="lecture-cont-wrapper">

                @if ($service == 'ielts')
                <div class="lecture-tab-nav-wrapper">
                    <ul class="lecture-tab-nav-list">
                        @foreach($productCategories as $categoryName => $products)
                        <li>
                            <a href="#none" class="{{ $loop->first ? 'active' : '' }}" onclick="fnMove('category-{{ preg_replace('/[^a-zA-Z0-9-_]/', '-', $categoryName) }}')"><span>{{ $categoryName }}</span></a>
                        </li>
                        @endforeach
                    </ul>
                </div>
                @else
                {{--
                <ul class="lecture-catagory-list" id="lecture-catagory-list">
                    <li><a href="#none">Title<button class="icon-close"></button></a></li>
                </ul>--}}
                @endif

                <div class="lecture-section">
                    @foreach($productCategories as $categoryName => $products)
                    <span class="lecture-cont-anchor" id="category-{{ preg_replace('/[^a-zA-Z0-9-_]/', '-', $categoryName) }}"></span>
                    <div class="lecture-cont">
                        <strong class="lecture-cont-title" data-category="{{ $categoryName }}">{{ $categoryName }}</strong>

                        @foreach($products as $product)
                            <div class="lecture-cont-box" id="product-{{ $product->id }}" data-module="{{ $product->module }}">
                                <div class="lecture-thumbnail">
                                    <img src="{{ $product->thumbnail }}" alt="">
                                </div>
                                <div class="lecture-info">
                                    <div class="lecture-detail-title">
                                        @if ($product->promotion_flag_word)
                                        <div class="flag {{ $product->promotion_flag }}">
                                            <span>{{ $product->promotion_flag_word }}</span>
                                        </div>
                                        @endif
                                        <p>{{ $product->name }}</p>
                                    </div>
                                    <div class="lecture-detail-desc">
                                        {{ $product->description }}
                                    </div>
                                    {{-- @if (!empty($product->maxDiscount) || !empty($product->cdt_count))
                                    <div class="lecture-detail-badge">
                                        @if (!empty($product->maxDiscount))
                                            <span class="badge red">최대 {{ $product->maxDiscount }}%할인</span>
                                        @endif
                                        @if (!empty($product->cdt_count))
                                            <span class="badge purple">CDT 모의고사 {{ $product->cdt_count }}회</span>
                                        @endif

                                        <span class="badge yellow">노란단어</span>
                                        <span class="badge green">W단어</span>
                                        <span class="badge green">태그 최대 5개</span>
                                    </div>
                                    @endif --}}
                                    <div class="lecture-detail-list">
                                        <ul>
                                            @foreach($product->productOptions as $option)
                                                <li>
                                                    <a href="{{ route('product', ['service' => $service, 'product_id'=>$product->id, 'option_id'=>$option->id]) }}">
                                                        <span class="month">{{ $option->name }}</span>
                                                        <span class="right">
                                                            <span class="price-wrap">
                                                                @if ($option->is_discounted && $option->isInDiscountPeriod() || $option->discount_rate > 0)
                                                                    <span class="price-before">{{ number_format($option->consumer_price) }}원</span>
                                                                @endif
                                                                <span class="price">{{  $option->is_discounted && $option->isInDiscountPeriod() ? number_format($option->discount_price):number_format($option->sales_price) }}원</span>
                                                            </span>


                                                                <span class="desc">
                                                                    @if ($option->is_discounted && $option->isInDiscountPeriod() || $option->discount_rate > 0)
                                                                    <span>{{ round($option->discount_rate) }}%</span> 할인
                                                                    @endif
                                                                </span>

                                                        </span>
                                                    </a>
                                                </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                    @endforeach
                </div>
        </div>
</div>
	{{-- <a href="#none" class="scroll-up">
		<img src="{{ env('AWS_S3_IMG_URL') }}/common/lecture/ico-scroll-top.png" alt="TOP">TOP
	</a> --}}
</div>
@endsection

@section($service.'-script')
	<script>
		@if ($service == 'academy')
		function updateModule() {
			$(".lecture-tab-module a").each(function () {
				const module = $(this).data('module');

				if ($(this).hasClass('active')) {
					$('.lecture-tab a[data-module="'+module+'"]').addClass('active');
					$('.lecture-cont-box[data-module="'+module+'"]').show();
				} else {
					$('.lecture-tab a[data-module="'+module+'"]').removeClass('active');
					$('.lecture-cont-box[data-module="'+module+'"]').hide();
				}
			});

			updateCategoryTabVisibility();
		}

		function updateProducts() {
			const productTabs = $(".lecture-tab a");
			let activeModules = [];

			productTabs.each(function(){
				const productId = $(this).data("product-id");
				const module = $(this).data("module");

				if ($(this).hasClass('active')) {
					$("#product-" + productId).slideDown();

					if (!activeModules.includes(module)) {
						activeModules.push(module);
					}
				} else {
					$("#product-" + productId).hide();
				}
			});

			$(".lecture-tab-module a").each(function () {
				const module = $(this).data('module');

				if (activeModules.includes(module)) {
					if (!$(this).hasClass('active')) $(this).addClass('active');
				} else {
					$(this).removeClass('active');
				}
			});

			updateCategoryTabVisibility();
		}

		function updateCategoryTabVisibility() {
			let activeCategories = [];

			$(".lecture-tab a.active").each(function(){
				const category = $(this).data('category');

				if (!activeCategories.includes(category)) {
					activeCategories.push(category);
				}
			});

			$(".lecture-cont-title").each(function(){
				const cat = $(this).data('category');

				if (activeCategories.includes(cat)) {
					$(this).show();
				} else {
					$(this).hide();
				}
			});
		}
		@endif

		$(document).ready(function () {
			@if ($service == 'academy')
			$(".lecture-tab a").click(function (event) {
				event.stopPropagation();
				$(this).toggleClass("active");
				updateProducts();
			});

			$(".lecture-tab-module a").click(function (event) {
				event.stopPropagation();
				$(this).toggleClass("active");
				updateModule();
			});

			$('a[data-module="academic"]').addClass('active');
			updateModule();
			@endif

			$(".lecture-tab-nav-list a").click(function() {
				$(".lecture-tab-nav-list a").removeClass("active");
				$(this).addClass("active");
			});

			// scroll top
			$(window).scroll(function() {
				if ($(this).scrollTop() > 600) {
					$(".scroll-up").fadeIn();
				} else {
					$(".scroll-up").fadeOut();
				}
			})
			$(".scroll-up").click(function() {
				$("html, body").animate({
					scrollTop: 0
				}, 600);
				return false;
			});


            // 배너 클릭 > 수강상품 비교 팝업
            $('.comparisonPopupOn').on('click', function(){
                $('.popupWrap-lecture-comparison').addClass('active');
            });
            $('.popupWrap-lecture-comparison .closeBtn, .popupWrap-lecture-comparison .dim').on('click',function(){
                $('.popupWrap-lecture-comparison').removeClass('active');
            });
		});

		function fnMove(idName) {
			var offset = $("#"+idName).offset();
			$('html,body').animate({scrollTop:offset.top},400);
		}
	</script>

    /* TODO 사강상품 비교 팝업 select */
    <script>
        let iconMap = {
            'icon-1': [{ img: 'lecture-ticket-con.svg', label: '응시권' }],
            'icon-2': [{ img: 'lecture-mockTest-icon.svg', label: 'CDT 모의고사' }],
            'icon-3': [{ img: 'lecture-refund-icon.svg', label: '환급' }],
            'icon-4': [
                { img: 'lecture-ticket-con.svg', label: '응시권' },
                { img: 'lecture-mockTest-icon.svg', label: 'CDT 모의고사' }
            ]
        };
        let AWS_IMG_URL = '{{ env("AWS_S3_IMG_URL") }}/ielts/common';
        let lectureComparisonData = @json($lectureComparison);
        let selectedIndexes = [null, null]; // 좌우 선택 인덱스 기억

        $(document).ready(function () {
            $('.popupWrap-lecture-comparison .dropDownMenu').each(function (colIndex) {
                $(this).find('.optionItem button').each(function (index) {
                    $(this).data('index', index); // 인덱스 추가
                }).on('click', function () {
                    let selectedIndex = $(this).data('index');
                    selectedIndexes[colIndex] = selectedIndex;
                    fillComparisonTable(colIndex, lectureComparisonData[selectedIndex]);
                    updateDropdownMenu();
                });
            });

            function updateDropdownMenu() {
                $('.popupWrap-lecture-comparison .dropDownMenu').each(function (colIndex) {
                    $(this).find('.optionItem button').each(function () {
                        let index = $(this).data('index');
                        $(this).toggle(index !== selectedIndexes[1 - colIndex]);
                    });
                });
            }

            function fillComparisonTable(col, data) {
                let $table = $('.comparison-table table');
                $table.find('thead td').eq(col).text(data[0]);

                // 아이콘 구성 (iconBox 클래스가 사라지지 않도록)
                let $iconCell = $table.find('tbody tr').eq(0).find('td').eq(col);
                let $iconBox = $iconCell.find('.iconBox');

                if ($iconBox.length === 0) {
                    $iconBox = $('<div class="iconBox"></div>').appendTo($iconCell);
                } else {
                    $iconBox.empty(); // 기존 아이콘 내용 비우기
                }

                (iconMap[data[1]] || []).forEach(icon => {
                    $iconBox.append(`
                        <div class="icon">
                            <figure style="background-image: url('${AWS_IMG_URL}/${icon.img}');"></figure>
                            <p>${icon.label}</p>
                        </div>
                    `);
                });

                // 나머지 데이터
                for (let i = 2; i <= 10; i++) {
                    $table.find('tbody tr').eq(i - 1).find('td').eq(col).html(data[i]);
                }
            }
        });
    </script>
@endsection