<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GoodsReviewPhotoFormMob.html
 * @desc	: 상품평 - 포토/영상 리스트 팝업
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE		 AUTHOR	  DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.04.008   eskim		최초 작성
 *******************************************************************************
 -->
<!-- 댓글 이미지 팝업 -->
<!-- <div class="modal fade thumb_img_pop" id="thumbImgPop" tabindex="-1" role="dialog" aria-labelledby="thumbImgLabel" aria-hidden="true"> -->
        <div class="modal-dialog" role="document">
            <div class="modal-content" th:with="frontUrl=${@environment.getProperty('domain.front')}, imgView=${@environment.getProperty('upload.image.view')}">
				<div class="modal-header sr-only">
                    <h5 class="modal-title" id="thumbImgLabel">이미지 상세보기</h5>
                </div>
                <div class="modal-body">
                    <div class="pop_cont">
 						<div class="swiper-container">
							<div class="swiper-wrapper">
								<!-- 이미지 슬라이드 영역 -->
							<th:block th:each="a, stat : ${imgList}">
								<div class="swiper-slide">
									<div class="pop_img" th:style="${'background-image:url('+imgView+'/'+a.sysFileNm+');'}">
									</div>
								</div>
							</th:block>
							</div>
						</div>
						<div class="swiper-button-next"></div>
						<div class="swiper-button-prev"></div>						
						<div class="swiper-pagination"></div>
                    </div>
                </div>
            </div>
        </div>        
<!--     </div> -->
	<!-- //댓글 이미지 팝업 -->	
<a href="javascript:void(0);" rel="modal:close"	onclick="cfCloseLayer('layer_review_photo')" class="close-modal">Close</a>
<script th:inline="javascript">



$(document).ready( function() {
	let attchSq = 0; 
	let img = [[${imgList[1].sysFileNm}]];
	if (!gagajf.isNull( [[${counsel.rnum}]])){
		attchSq = [[${counsel.rnum}]]-1;
	} 
	
	if (!gagajf.isNull(img)) {
		var contactPopSwiper = new Swiper('.thumb_img_pop .swiper-container', {
			navigation: {
				nextEl: '.thumb_img_pop .swiper-button-next',
				prevEl: '.thumb_img_pop .swiper-button-prev',
			},
			pagination: {
				el: '.thumb_img_pop .swiper-pagination',
				clickable: true,
			},
					
			observer:true,
			observeParents: true,
		});		
		
		contactPopSwiper.slideTo(attchSq, 0, false);
		contactPopSwiper.update();
	}
	else{
		$(".swiper-pagination").append('<span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 1"></span>');
		$(".swiper-pagination").addClass("swiper-pagination-clickable swiper-pagination-bullets");
		$(".swiper-button-next").addClass("swiper-button-disabled");
		$(".swiper-button-prev").addClass("swiper-button-disabled");
		
	}
	
	


});
/*<![CDATA[*/
	
/*]]>*/
</script>
</html>