모바일 딜 상품상세

src/main/webapp/WEB-INF/views/mob/common/layout/GoodsLayoutMob.html

@@ -9,6 +9,7 @@
 
 	<th:block th:replace="~{web/common/fragments/VariablesWeb :: variables}"></th:block>
 	
+	
 	<div class="app">
 		<!-- GNB -->
 		<th:block th:replace="~{mob/common/fragments/GnbSubGoodsMob :: gnb}"></th:block>

src/main/webapp/WEB-INF/views/mob/goods/CardPrmtFormMob.html

@@ -66,7 +66,7 @@
 									<td>
 										<div class="info_card">
 											<p th:text="${cardInfo.minNoItrt + '~' + cardInfo.maxNoItrt + '개월 무이자'}">2~6개월 무이자</p>
-											<p th:text="${cardInfo.minPayAmt + '만원 이상 구매 시'}">5만원 이상 구매 시</p>
+											<p th:text="${#numbers.formatInteger(cardInfo.minPayAmt, 0,'COMMA') + '원 이상 구매 시'}">5만원 이상 구매 시</p>
 										</div>
 									</td>
 								</tr>

src/main/webapp/WEB-INF/views/mob/goods/GoodsDealDetailFormMob.html

@@ -719,37 +719,45 @@
 
 
 		// =============딜리스트팝업========================================================
-		//팝업 - 딜리뷰상품 리스트팝업
-		$(document).on('click','#listReviewPop .close, #listReviewPop .deal_list_select ul > li',function(e){
-			$("#listReviewPop").hide(); 
-			return false;
-		});
+			//팝업 - 딜리뷰상품 리스트팝업
+			$(document).on('click','.deal_listReview_open',function(e){
+                $("#listReviewPop").show();
+                return false;
+            }).on('click','#listReviewPop .close, #listReviewPop .deal_list_select ul > li',function(e){
+				$("#listReviewPop").hide(); 
+				return false;
+			});
 
 			//팝업 - 딜문의상품 리스트팝업
-		$(document).on('click','#listQnaPop .close, #listQnaPop .deal_list_select ul > li',function(e){
-			$("#listQnaPop").hide(); 
-			return false;
-		});
+			$(document).on('click','.deal_listQna_open',function(e){
+                $("#listQnaPop").show();
+                return false;
+            }).on('click','#listQnaPop .close, #listQnaPop .deal_list_select ul > li',function(e){
+				$("#listQnaPop").hide(); 
+				return false;
+			});
 
 			//팝업 - 딜배송상품 리스트팝업
-		$(document).on('click','#listDeliveryPop .close, #listDeliveryPop .deal_list_select ul > li',function(e){
-			$("#listDeliveryPop").hide(); 
-			return false;
-		});
-
-		//팝업 - 딜상세정보 리스트팝업
-	 	$(document).on('click','#pdDescrpPop .deal_listDescrp_open',function(e){
-			$(this).toggleClass("active");
-			 $("#listDescrpPop").toggle();
-			 return false;
-		 }).on('click','#listDescrpPop .deal_list_select ul > li',function(e){
-			$("#pdDescrpPop .deal_listDescrp_open").removeClass("active");
-			$("#listDescrpPop").hide(); 
-			return false;
-		}); 
-			// ============================================================================//
-
+			$(document).on('click','.deal_listDelivery_open',function(e){
+                $("#listDeliveryPop").show();
+                return false;
+            }).on('click','#listDeliveryPop .close, #listDeliveryPop .deal_list_select ul > li',function(e){
+				$("#listDeliveryPop").hide(); 
+				return false;
+			});
 
+			//팝업 - 딜상세정보 리스트팝업
+			$(document).on('click','#pdDescrpPop .deal_listDescrp_open',function(e){
+				$(this).toggleClass("active");
+                $("#listDescrpPop").toggle();
+                return false;
+            }).on('click','#listDescrpPop .deal_list_select ul > li',function(e){
+				$("#pdDescrpPop .deal_listDescrp_open").removeClass("active");
+				$("#listDescrpPop").hide(); 
+				return false;
+			});
+			// ============================================================================//	
+		
 		 //탭 - 딜상품 > 상품상세정보 탭
 		 $(document).on('click','.pd.deal .tab_detail_nav ul li',function(e){
 			 $(this).addClass('active').siblings().removeClass('active');

src/main/webapp/WEB-INF/views/mob/goods/GoodsDetailFormMob.html

@@ -51,7 +51,7 @@
 										<div class="swiper-slide">
 											<div class="movbox">
 												<th:block th:if="${goodsVideo.videoGb == 'Y'}">
-												<iframe id="prodctThumbVideo" class="pd_mov" width="100%" height="100%" th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0&autoplay=1&mute=1'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+												<iframe width="100%" height="100%" th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0&autoplay=1&mute=1'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 												</th:block>
 												<th:block th:unless="${goodsVideo.videoGb == 'Y'}">
 												<iframe id="child" class="pd_mov" width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
@@ -257,6 +257,7 @@
 						<iframe th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 						</th:block>
 						<th:block th:unless="${goodsVideo.videoGb == 'Y'}">
+						<iframe class="pd_mov" width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 						</th:block>
 					</div>
 					</th:block>
@@ -1954,10 +1955,10 @@
 		}); 
 		
 		//슬라이드 - 함께하면 할인되는 다다익선 상품
-        var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
-            slidesPerView: 3,
-            spaceBetween: 8,
-        }); 
+		var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
+			slidesPerView: 3,
+			spaceBetween: 8,
+		}); 
 		
 		//슬라이드 - 베스트리뷰
 		var riviewSwiper = new Swiper('.riview_box .area_slider .swiper-container', {
@@ -2071,13 +2072,13 @@
 		});
 
 		 //관심상품 등록
-        $(document).on('click','.pd .itemLike',function(e){
-            $(this).toggleClass('active');
-            return false;
-        });   
+		$(document).on('click','.pd .itemLike',function(e){
+			$(this).toggleClass('active');
+			return false;
+		});   
 
-       
-        
+	   
+		
 		fnOptionSoldout();
 		
 		// 광고 스크립트용
@@ -2156,10 +2157,19 @@
 		
 		// ep 쿠폰확인
 		fnEpCouponDown([[${afLinkCd}]], [[${params.goodsCd}]], 1);
+		
+		
+		 $('.Purchase_pop .btPop_close').click(function(){
+			$('html, body').css({'overflow': 'visible', 'height': '100%'});
+			$('.container').removeClass('btPop_open');
+			autome.style.top  = 100 + "%";
+			return false;
+		});
+		 
 	});
 	
 	 // 상품상세 asis html  이지미 경로 수정
-    window.onload = function(){
+	window.onload = function(){
    	 $(".pd_descrp .cont_body").find('img').each(function() {
 			let tmpImgSrc = $(this).attr('src');
 			if (tmpImgSrc.indexOf('Upload') == 1 ){  // /Upload
@@ -2167,42 +2177,65 @@
 			}
 			
 		});
-	}
-	 
-	 $('.Purchase_pop .btPop_close').click(function(){
-			$('html, body').css({'overflow': 'visible', 'height': '100%'});
-			$('.container').removeClass('btPop_open');
-			autome.style.top  = 100 + "%";
-			return false;
-		});
-     
-     $(window).scroll(function(){
-		var lastScrollTop = 0;
-		var st = $(this).scrollTop();
-		if($('header').hasClass("main") !== true){
-			if (st > lastScrollTop){
-				$(".app .gnb").css("position", "fixed");
-				$(".htop").css("background", "#fff");
-				$(".app .gnb .btn-expand").css("position", "fixed");
-				$(".tabbar").removeClass("fixed");
-			} else {
-				$(".app .gnb").css("position", "fixed");
-				$(".htop").css("background", "#fff");
-				$(".app .gnb .btn-expand").css("position", "fixed");
-				$(".tabbar").addClass("fixed");
-				setTimeout(function(){
-					if($(window).scrollTop() === 0){
-						$(".app .gnb").css("position", "relative");
-						$(".app .gnb .btn-expand").css("position", "absolute");
-					}
-				},300)
+	
+   	/*
+		let goodsVideoList = [[${goodsVideoList}]];
+		let videoFlag = false;
+		if (goodsVideoList != null){
+			
+			$.each(goodsVideoList, function(idx, goodsVideo) {
+				if ("M" == goodsVideo.videoGb){
+					videoFlag = true;
+					return false;
+				}
+				
+			});
+		}
+			
+		 if (videoFlag){
+			try {
+				var controller = new VgControllerClient({
+					target_window: document.getElementById('child').contentWindow
+				});
+				//console.log(controller.get_screen());
+				//controller.enable_fullscreen_button(true);
+				// 여기서부터 이벤트 리스너를 등록하거나, 웹페이지 Element에 메소드를 bind하면 됩니다.
+			} catch(e) {
+				// Videogateweay Controller Library는 window.postMessage API를 이용하기 때문에
+				// 해당 기능을 지원하지 않는 웹브라우져에서는 동작하지 않습니다.
+				// 이 부분에 적절한 fail-over 코드를 추가하여 주십시요.
 			}
-			if(st < 10) {
-				$(".htop").css("background", "transparent");
+			controller.mute();
+			controller.play();
+			controller.set_control_visibility(false);
+			
+		}	 */
+		
+		/* $(window).scroll(function(){
+			var scrollTop= $(window).scrollTop();
+			var itemTop=$('.descript_box').offset().top;
+			var winHeight = $(window).height();
+			console.log(winHeight-scrollTop);
+			console.log(winHeight/1.5);
+			if (winHeight-scrollTop <= winHeight/1.5){
+				controller.pause();
+			} else {
+				controller.play();
+				controller.set_control_visibility(false);
 			}
-			lastScrollTop = st;
-		}
-     });
+
+			controller.on('done', function() {
+				controller.play();
+				controller.set_control_visibility(false);
+			});
+		}); */
+
+		$(document).on('click','.pop_open_btn',function(){
+				$('.modal.photo_comment_popup .pop_detail').toggleClass('active');
+		});
+		
+	};
+	
 /*]]>*/
 </script>
 

src/main/webapp/WEB-INF/views/mob/goods/GoodsDetailQnaFormMob.html

@@ -68,6 +68,7 @@
 /*<![CDATA[*/
 	
 	var fnGoodsQnaList = function() {
+		$('.close-modal').trigger("click");
 		gagajf.ajaxFormSubmit($('#goodsQnaForm').prop('action'), '#goodsQnaForm', fnGetListCallback);
 	}
 

src/main/webapp/WEB-INF/views/mob/goods/GoodsIncludeFormMob.html

@@ -37,8 +37,8 @@
 		<div class="tab_detail_nav">
 			<ul>
 				<li class="active"><a href="javascript:void(0)">상세정보</a></li>
-				<li><a href="javascript:void(0)">리뷰<em><th:block  th:text="${(goodsReviewCnt <= 9999) ? #numbers.formatInteger(goodsReviewCnt, 0,'COMMA')  : '9,999+'}"></th:block></em></a></li>
-				<li><a href="javascript:void(0)">문의<em><th:block  th:text="${(goodsQnaCnt <= 9999) ? #numbers.formatInteger(goodsQnaCnt, 0,'COMMA')  : '9,999+'}"></th:block></em></a></li>
+				<li><a href="javascript:void(0)">리뷰<em><th:block  th:text="${(goodsInfo.reviewRegCnt <= 9999) ? #numbers.formatInteger(goodsInfo.reviewRegCnt, 0,'COMMA')  : '9,999+'}"></th:block></em></a></li>
+				<li><a href="javascript:void(0)">문의<em><th:block  th:text="${(goodsInfo.goodsQnaCnt <= 9999) ? #numbers.formatInteger(goodsInfo.goodsQnaCnt, 0,'COMMA')  : '9,999+'}"></th:block></em></a></li>
 				<li class=""><a href="javascript:void(0)">배송/반품</a></li>
 			</ul>
 		</div>
@@ -48,7 +48,7 @@
 				<div class="item_prod" th:each="goodsInfo, status : ${goodsDealComposeList}">
 					<div class="item_state">
 						<a href="javascript:void(0);" class="itemLink" th:onclick="fnOpenGoodsDealDetail([[${goodsInfo.goodsCd}]],[[${goodsInfo.compsGoodsCd}]])">
-							<div class="rank detail"><span>상품<em class="number" th:text="${#numbers.formatInteger(status.count,2)}">01</em></span></div>
+							<div class="shape dealdetail"><span>상품<br/><th:block th:text="${#numbers.formatInteger(status.count,2)}">01</th:block> </span></div>
 							<div class="itemPic">
 								<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm+'?RS=156'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
 							</div>
@@ -159,12 +159,12 @@
 										<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm+'?RS=331'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
 									</div>
 									<p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">BRAND NAME1</p>
-									<div class="itemName" th:text="${goodsInfo.goodsFullNm}">남성 </div>
+									<div class="itemName" ><span class="tit_option" th:text="${'[상품'+status.count+']'}">[상품1]</span><th:block th:text="${goodsInfo.goodsFullNm}"></th:block> </div>
 									<div class="itemText">
 										<span class="tx1">(리뷰 <th:block  th:text="${(goodsInfo.reviewRegCnt <= 9999) ? #numbers.formatInteger(goodsInfo.reviewRegCnt, 0,'COMMA')  : '9,999+'}"></th:block>)</span>
 									</div>
 								</a>
-								<input type="hidden" name="selectGoods" th:value="${goodsInfo.compsGoodsCd}" />
+								<input type="hidden" name="selectGoods" th:value="${goodsInfo.compsGoodsCd}"  th:attr="currPrice=${goodsInfo.currPrice}, selfGoodsYn=${goodsInfo.selfGoodsYn}"/>
 							</div>
 						</div>
 					</li> 
@@ -194,7 +194,7 @@
 										<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm+'?RS=331'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
 									</div>
 									<p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">BRAND NAME1</p>
-									<div class="itemName" th:text="${goodsInfo.goodsFullNm}">남성 </div>
+									<div class="itemName" ><span class="tit_option" th:text="${'[상품'+status.count+']'}">[상품1]</span><th:block th:text="${goodsInfo.goodsFullNm}"></th:block> </div>
 									<div class="itemText">
 										<span class="tx1">(문의 <th:block  th:text="${(goodsInfo.goodsQnaCnt <= 9999) ? #numbers.formatInteger(goodsInfo.goodsQnaCnt, 0,'COMMA')  : '9,999+'}"></th:block>)</span>
 									</div>
@@ -229,7 +229,7 @@
 										<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm+'?RS=331'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
 									</div>
 									<p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">BRAND NAME1</p>
-									<div class="itemName" th:text="${goodsInfo.goodsFullNm}">남성 </div>
+									<div class="itemName" ><span class="tit_option" th:text="${'[상품'+status.count+']'}">[상품1]</span><th:block th:text="${goodsInfo.goodsFullNm}"></th:block> </div>
 								</a>
 								<input type="hidden" name="selectGoods" th:value="${goodsInfo.compsGoodsCd}" />
 							</div>
@@ -334,9 +334,11 @@
 		fnGoodsDetailReview(params);  // ajax html
 		
 		$('.pd_pop.pd_listReview_pop').find('.deal_list_select .list li').each(function() { 
-			
+			$(this).removeClass('selected');
 			if (goodsCd == $(this).find('input[name=selectGoods]').val()){
-				let tag = $(this).parent().parent().find('.item_prod').parent().html();
+				$(this).addClass('selected');
+				//let tag = $(this).find('.item_prod').parent().html();
+				let tag = $(this).html();
 				$('.tab_detail_cont.pd_review .item_blk').html(tag);
 			}
 		});

src/main/webapp/WEB-INF/views/mob/goods/GoodsQnaDetailFormMob.html

@@ -94,7 +94,9 @@
 			return false;
 		}
 		
-		mcxDialog.confirm("저장하시겠습니까?", {
+		gagajf.ajaxFormSubmit($('#goodsQnaDetailForm').prop('action') , $('#goodsQnaDetailForm'), btnGoodsQnaSaveCallBack());
+		
+		/* mcxDialog.confirm("저장하시겠습니까?", {
 			cancelBtnText: "취소",
 			sureBtnText: "확인",
 			sureBtnClick: function() {
@@ -105,10 +107,14 @@
 						}
 				);
 			}
-		});
+		}); */
 		
 	}
 
+	var btnGoodsQnaSaveCallBack = function(){
+		setTimeout(fnGoodsQnaList, 100);
+	}
+	
 /*]]>*/
 </script>
  </html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsReviewDetailFormMob.html

@@ -34,13 +34,13 @@
 						<div class="swiper-container thumb_list">
 							<div class="swiper-wrapper">
 								<th:block th:if="${review.reviewAttachList != null and !review.reviewAttachList.empty}" >
-								<th:block th:each="reviewAttach, attachStatus : ${review.reviewAttachList}" th:if="${attachStatus.first}">
+								<th:block th:each="reviewAttach, attachStatus : ${review.reviewAttachList}">
 								<div class="swiper-slide">
 									<div class="thumb " th:classAppend="${(reviewAttach.fileGb == 'M') ? 'mov' :''}">
 										<th:block th:if="${reviewAttach.fileGb == 'M'}">
 											<video poster="http://cdn.011st.com/11dims/resize/1999x1999/quality/75/11src/review/10201202/3121412332/2e66698576d64c5c9977a6fe6606008d.jpg" muted="muted" preload="metadata" controls="controls">
-											<source src="http://snsvideo.11st.co.kr/movie/item/www/675/67518524_06_1_C1.mp4" type="video/mp4">
-										</video>
+												<source src="http://snsvideo.11st.co.kr/movie/item/www/675/67518524_06_1_C1.mp4" type="video/mp4">
+											</video>
 										</th:block>
 										<th:block th:unless="${reviewAttach.fileGb == 'M'}">
 											<img th:src="${imgUrl+'/'+reviewAttach.sysFileNm}" alt="">
@@ -159,7 +159,23 @@
 /*<![CDATA[*/
 	
 	$(document).ready( function() {
-
+		 //슬라이드 - 포토,영상리뷰팝업 
+        var photoreviewdetailSwiper = new Swiper('.pd_photoreviewdetail_pop .area_slider .swiper-container', {
+            observer: true,
+            observeParents: true,
+            slidesPerView: 1,
+            pagination: {
+                el: '.swiper-pagination',
+                type: 'fraction',
+            },
+        });
+        // 포토,베스트리뷰숨김
+        var review_open=$(".btn_review_open");
+        $(document).on('click','.btn_review_open',function(e){
+            $(this).toggleClass('active');
+            $(this).next(".review_list").toggleClass('active');
+            return false;
+        });
 
 	});
 	

src/main/webapp/WEB-INF/views/mob/goods/GoodsShopBenefitFormMob.html

@@ -32,10 +32,10 @@
 							<tbody>
 								<tr th:if="${(goodsCoupon1List != null and !goodsCoupon1List.empty)}">
 									<th>즉시할인</th>
-									<td th:each="goodsCoupon, status : ${goodsCoupon1List}" th:if="${status.first}">최대
+									<td th:each="goodsCoupon, status : ${goodsCoupon1List}" th:if="${status.first}"><p>최대
 									<th:block th:if="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}원|"></th:block>
 									<th:block th:unless="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${goodsCoupon.dcVal}%|"></th:block>
-									 할인</td>
+									 할인</p></td>
 								</tr>
 								<tr th:if="${(goodsCouponList != null and !goodsCouponList.empty)}">
 									<th>쿠폰할인</th>

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

@@ -73,7 +73,7 @@
 									<td>
 										<div class="info_card">
 											<p th:text="${cardInfo.minNoItrt + '~' + cardInfo.maxNoItrt + '개월 무이자'}">2~6개월 무이자</p>
-											<p th:text="${cardInfo.minPayAmt + '만원 이상 구매 시'}">5만원 이상 구매 시</p>
+											<p th:text="${#numbers.formatInteger(cardInfo.minPayAmt, 0,'COMMA') + '원 이상 구매 시'}">5만원 이상 구매 시</p>
 										</div>
 									</td>
 								</tr>