상품평 상세 클릭시 해당 이미지 적용

src/main/java/com/style24/persistence/domain/Review.java

@@ -53,6 +53,7 @@ public class Review extends TscBaseDomain {
 	private String frontGb;
 	private String custGb;
 	private String brandNm;
+	private int attachSq;
 
 	private String custId;			// 고객ID
 	private String sysImgNm;		// 상품대표이미지

src/main/webapp/WEB-INF/views/web/goods/GoodsDetailReviewFormWeb.html

@@ -553,9 +553,13 @@
 						fileGbClass = '';
 						if (reviewAttach.fileGb == "M") fileGbClass = "mov";
 				tag += '				<li>\n';
-				tag += '					<a href="javascript:void();" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'Y\',\''+item.reviewSq+'\');">\n';
+				tag += '					<a href="javascript:void();" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'Y\',\''+item.reviewSq+'\','+aIdx+');">\n';
 				tag += '						<div class="pic">\n';
-				tag += '							<span class="thumb '+ fileGbClass +'" style="background-image:url('+ _imgUrl + reviewAttach.sysFileNm +');"></span>\n'; //<!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+					if (reviewAttach.fileGb == "M") {
+				tag +='					<span class="thumb '+fileGbClass+'"><iframe width="100%" height="100%" src="'+_kollusMediaUrl +'/'+reviewAttach.kmcKey +'?player_version=html5" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe></span>\n';
+					}else{
+				tag +='					<span class="thumb" style="background-image:url('+ _imgUrl + reviewAttach.sysFileNm +');\" >\n';
+					}
 				tag += '						</div>\n';
 				tag += '					</a>\n';
 				tag += '				</li>\n';		

src/main/webapp/WEB-INF/views/web/goods/GoodsReviewDetailFormWeb.html

@@ -34,6 +34,7 @@
 <input type="hidden" name="bestYn" th:value="${review.bestYn}" />
 <input type="hidden" name="photoYn" th:value="${review.photoYn}" />
 <input type="hidden" name="reviewSq" th:value="${review.reviewSq}" />
+<input type="hidden" name="attachSq" th:value="${review.attachSq}" />
 </form>
 <a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_review_best')" class="close-modal">Close</a> 
 <script th:inline="javascript">
@@ -55,6 +56,7 @@
 		// 목록
 		if (result.reviewList != null && result.reviewList.length > 0) {
 			let fileGbClass = '';
+			let rdx = $('#reviewDetailForm input[name=attachSq]').val();
 			$.each(result.reviewList, function(idx, review) {
 				let tag = '';
 				tag +='<div class="pop_cont">\n';
@@ -185,19 +187,21 @@
 				tag +='	<div class="thumblist">\n';
 				tag +='		<ul>\n';
 					let activeClass = '';
+					
 					$.each(review.reviewAttachList, function(aIdx, reviewAttach){
 						activeClass = '';
-						if (aIdx == 0){
+						if (aIdx == rdx){
 							activeClass = 'active';
 						}
 						fileGbClass = '';
 						if (reviewAttach.fileGb == "M") fileGbClass = "mov";
 				tag +='			<li>\n';
 				tag +='				<div class="pic '+activeClass+'"> \n'; <!-- 활성화시 active 클래스 추가 -->
-				tag +='					<span class="thumb" class="'+fileGbClass+'" style="background-image:url('+ _imgUrl + reviewAttach.sysFileNm +');\" >\n';<!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+				
 					if (reviewAttach.fileGb == "M") {
-				tag +='					<iframe width="100%" height="100%" src="'+_kollusMediaUrl +'/'+reviewAttach.kmcKey +'?player_version=html5" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>\n';
+				tag +='					<span class="thumb '+fileGbClass+'"><iframe width="100%" height="100%" src="'+_kollusMediaUrl +'/'+reviewAttach.kmcKey +'?player_version=html5" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe></span>\n';
 					}else{
+				tag +='					<span class="thumb" style="background-image:url('+ _imgUrl + reviewAttach.sysFileNm +');\" >\n';
 				tag +='					<img src="'+ _imgUrl + reviewAttach.sysFileNm +'" alt="">\n';	
 					}
 				tag +='					</span>\n';
@@ -238,7 +242,8 @@
 				        $this.find('.thumblist ul').attr('style', 'width:' + thumbListWidth + 'px;');
 				        
 				    });
-
+				
+				$('.pd_photoreviewdetail_pop .thumblist ul li').eq(rdx).trigger("click");
 			});
 		}
 		

src/main/webapp/ux/style24_link.js

@@ -640,10 +640,10 @@ function cfGoodsInstockAlarmInfo(goodsCd, colorCd) {
 * @access : public
 * @desc   : 상품평- 베스트 리뷰 보기
 * <pre>
-*		cfGoodsReviewDetail(goodsCd, bestYn, photoYn, reviewSq);
+*		cfGoodsReviewDetail(goodsCd, bestYn, photoYn, reviewSq, attachSq);
 * </pre>
 */
-function cfGoodsReviewDetail(goodsCd, bestYn, photoYn, reviewSq) {
+function cfGoodsReviewDetail(goodsCd, bestYn, photoYn, reviewSq, attachSq) {
 	var str = '<div class="modal fade pd_pop pd_photoreviewdetail_pop" id="layer_review_best" tabindex="-1" role="dialog" aria-labelledby="pdBestReviewLabel" aria-hidden="true"></div>';
 	if ("P" != _frontGb){
 		str = '<div class="modal pop_full fade pd_pop pd_photoreviewdetail_pop" id="layer_review_best" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
@@ -657,6 +657,7 @@ function cfGoodsReviewDetail(goodsCd, bestYn, photoYn, reviewSq) {
 	params += '&reviewSq=' + reviewSq;
 	params += '&bestYn=' + bestYn;
 	params += '&photoYn=' + photoYn;
+	if (typeof (attachSq) != 'undefined') params += "&attachSq=" + attachSq;
 	
 	cfOpenLayer(_PAGE_GOODS_REVIEW_DETAIL_LAYER+params, 'layer_review_best');
 }