|
|
@@ -0,0 +1,91 @@
|
|
|
+<!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>
|