<!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.08   eskim		최초 작성
 *******************************************************************************
 -->
<div class="modal-dialog" role="document">
	<div class="modal-content" th:with="imageUrl=${@environment.getProperty('upload.image.view')}">
		<div class="modal-header">
			<h5 class="modal-title" id="comment_popup">포토 댓글</h5>
		</div>
		<div class="modal-body">
			<div class="pop_cont">
				<div class="pop_slide">
					<div class="swiper-container">
						<div class="swiper-wrapper">
						<th:block th:each="a, stat : ${replyAttachList}">
							<div class="swiper-slide">
								<div class="img">
									<img th:src="${imageUrl + a.sysFileNm}">
								</div>
							</div>
						</th:block>
						</div>
					</div>
					<!-- Add Pagination -->
					<div class="swiper-pagination"></div>
				</div>
				<div class="pop_detail">
					<button class="pop_open_btn"><span class="sr-only"></span>
					</button>
					<!-- 210414_추가 : comment_wrap 태그 추가. -->
					
					<th:block th:each="a, stat : ${replyList}">	
					<div class="comment_wrap">
						<div class="review_p" th:text=${a.entryVal1}></div>
						<div class="comment_writer">
							<span class="writer" th:text="${a.maskingCustId}"></span> <span class="date" th:text="${a.entryDt}">2020.12.30</span>
						</div>
					</div>
					</th:block>
					<!-- //210414_추가 : comment_wrap 태그 추가. -->
				</div>
			</div>
		</div>
	</div>
</div>

<a href="javascript:void(0);" rel="modal:close"
	onclick="cfCloseLayer('photo_full_popup')" class="close-modal">Close</a>
<script th:inline="javascript">

/*<![CDATA[*/
	$(document).ready( function() {
		
		/* 210414_추가 : swiper fraction 숫자 1자리수 일때 앞에 0 스크립트 추가 */
	/* 	var togglePopOpen = function() {
			if ($('.pop_detail').hasClass('active')) {
				$('.pop_detail').removeClass('active');
			}else{
				$('.pop_detail').addClass('active');
			}
			
		}; */
		
		let replyAttchSq = 0; 
		if (!gagajf.isNull( [[${plan.attachSq}]])){
			replyAttchSq = [[${plan.attachSq}]];
		} 
		
		
		var photoreplydetailSwiper = new Swiper('.pop_slide .swiper-container', {
			observer: true,
			observeParents: true,
			slidesPerView: 1,
			pagination: {
				el: '.swiper-pagination',
				type: 'fraction',
			},
		});
	/* 	$(document).on('click','.pop_open_btn',function(){
			$('.modal.photo_comment_popup .pop_detail').toggleClass('active');
		}); */

		
		photoreplydetailSwiper.slideTo(replyAttchSq, 0, false);
		photoreplydetailSwiper.update();
		
	});
	
	
	
/*]]>*/
</script>
</html>