Merge branch 'bin2107' into jmh_tmp

src/main/java/com/style24/front/biz/thirdparty/EigeneaiApi.java

@@ -540,4 +540,25 @@ public class EigeneaiApi {
 		return new ArrayList<Result>();
 	}
 
+	/**
+	 * 당신을 위한 제안
+	 * 사용되는 화면 영역)
+	 * 		메인 > 당신을 위한 제안
+	 * @param goodsCd - 상품코드
+	 * @param size - 결과에 포함할 상품수
+	 * @return
+	 * @author bin2107
+	 * @since 2021. 9. 23
+	 */
+	public Collection<Result> getRecommendForYouList(String goodsCd, int size) {
+		String requestUrl = apiUrl + "/a037?cuid=" + cuid + "&size=" + size + "&iids=" + goodsCd + "&cps=true&cpt=m001";
+
+		Eigeneai eigeneai = this.getEigeneaiInfo(requestUrl);
+		if (eigeneai.getResults() != null && !eigeneai.getResults().isEmpty()) {
+			return eigeneai.getResults();
+		}
+
+		return new ArrayList<Result>();
+	}
+
 }

src/main/webapp/WEB-INF/views/mob/display/BrandSearchGoodsListFormMob.html

@@ -49,41 +49,14 @@
 				</div>
 
 				<!-- 이런상품은 어떤가요 -->
-				<div class="now_view" id="recomArea" style="display:none;">
+				<div class="now_view" id="recomArea">
 					<div class="store_product">
 						<div class="allresult-tit">
 							<h3>이런 상품은 어떤가요?</h3>
 						</div>
 						<div class="swiper-container sch_product">
 							<div class="swiper-wrapper" id="recommendItemArea">
-								<div class="swiper-slide">
-									<div class="item_prod">
-										<div class="item_state">
-											<button type="button" class="itemLike">관심상품 추가</button>
-											<a href="#none" class="itemLink">
-												<div class="itemPic">
-													<img class="vLHTC pd_img" th:src="${@environment.getProperty('domain.uximage')} + '/images/mo/br_main03.png'" alt="">
-												</div>
-												<p class="itemBrand">BRAND NAME</p>
-												<div class=" itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
-												<p class="itemPrice">
-													<span class="itemPrice_original">89,000</span>
-													80,100
-													<span class="itemPercent">10%</span>
-												</p>
-												<div class="itemcolorchip">
-													<span class="chip_color35" value="ABM">BEIGE</span>
-													<span class="chip_color54" value="BDS">BLACK</span>
-													<span class="chip_color40" value="YBR">WHITE</span>
-												</div>
-												<p class="itemBadge">
-													<span class="badge13">베스트 </span>
-												</p>
-												<div class="itemComment">#주문 폭주 상품</div>
-											</a>
-										</div>
-									</div>
-								</div>
+
 							</div>
 						</div>
 					</div>
@@ -518,7 +491,6 @@
 		$('#noDataFilter').hide();
 		$('#goodsNodata').hide();
 		$('#goodsKeyword').text('');
-		$('#recomArea').hide();
 		totalCnt = result.paging.totalCount;
 		$("#totCntId").text(totalCnt.addComma());
 		$("#prodListCnt").text('('+totalCnt.addComma()+')');
@@ -547,7 +519,6 @@
 			$('#eventNodata').hide();
 			$('#eventKeyword').text('');
 			$('#dataArea').show();
-			$('#recomArea').hide();
 			var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 			let lastPage = result.paging.pageNo;
 			let endRow = result.paging.endRow - result.paging.pageSize;
@@ -578,9 +549,6 @@
 				$('#goodsNodata').show();
 				$('#goodsKeyword').text([[${params.keyword}]]);
 				$('#dataArea').hide();
-				$('#recomArea').show();
-				// 검색어 연관 상품 추천
-				fnRecommendItemList([[${params.keyword}]]);
 			}
 			gagaInfiniteScroll.draw('not');
 		}
@@ -704,6 +672,9 @@
 	}
 
 	$(document).ready( function() {
+		// 검색어 연관 상품 추천
+		fnRecommendItemList([[${params.keyword}]]);
+
 		// 광고배너체크
 		if(!gagajf.isNull(adBannerList) && adBannerList.length>0){
 			var imgUrl = [[${@environment.getProperty('upload.image.view')}]];
@@ -1009,22 +980,19 @@
 					html += '	</div>\n';
 					html += '</div>\n';
 				});
+			}else{
+				$("#recomArea").hide();
 			}
 			$("#recommendItemArea").append(html);
 
-			if( "" == html){
-				$("#recomArea").hide();
-			}else{
-				$("#recomArea").show();
-				var swiperschProduct2 = new Swiper('.swiper-container.sch_product', {
-					slidesPerView: 2.2,
-					spaceBetween: 7,
-					autoplay: {
-						delay: 4000,
-					},
-					freeMode: true,
-				});
-			}
+			var swiperschProduct2 = new Swiper('.swiper-container.sch_product', {
+				slidesPerView: 2.2,
+				spaceBetween: 7,
+				autoplay: {
+					delay: 4000,
+				},
+				freeMode: true,
+			});
 		});
 	}
 
@@ -1053,6 +1021,7 @@
 		//listIdx = 1;
 		$('#endPage').hide();
 		$('#noFilterData').hide();
+		$("#recomArea").hide();
 	}
 
 	/*]]>*/

src/main/webapp/WEB-INF/views/mob/display/SearchGoodsListFormMob.html

@@ -58,7 +58,7 @@
 								<!-- // 전체 검색결과 없을때 -->
 							</div>
 
-							<div class="inner" id="recomArea" style="display:none;">
+							<div class="inner" id="recomArea" >
 								<!-- 이런상품은 어떤가요 -->
 								<div class="now_view">
 									<div class="store_product">
@@ -67,34 +67,7 @@
 										</div>
 										<div class="swiper-container sch_product">
 											<div class="swiper-wrapper" id="recommendItemArea">
-												<div class="swiper-slide">
-													<div class="item_prod">
-														<div class="item_state">
-															<button type="button" class="itemLike">관심상품 추가</button>
-															<a href="#none" class="itemLink">
-																<div class="itemPic">
-																	<img class="vLHTC pd_img" th:src="${@environment.getProperty('domain.uximage')} + '/images/mo/br_main03.png'" alt="">
-																</div>
-																<p class="itemBrand">BRAND NAME</p>
-																<div class=" itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
-																<p class="itemPrice">
-																	<span class="itemPrice_original">89,000</span>
-																	80,100
-																	<span class="itemPercent">10%</span>
-																</p>
-																<div class="itemcolorchip">
-																	<span class="chip_color35" value="ABM">BEIGE</span>
-																	<span class="chip_color54" value="BDS">BLACK</span>
-																	<span class="chip_color40" value="YBR">WHITE</span>
-																</div>
-																<p class="itemBadge">
-																	<span class="badge13">베스트 </span>
-																</p>
-																<div class="itemComment">#주문 폭주 상품</div>
-															</a>
-														</div>
-													</div>
-												</div>
+
 											</div>
 										</div>
 									</div>
@@ -604,7 +577,6 @@
 		$('#endPage').hide();
 		$('#noDataFilter').hide();
 		$('#goodsNodata').hide();
-		$('#recomArea').hide();
 		$('#goodsKeyword').text('');
 		totalCnt = result.paging.totalCount;
 		$("#totCntId").text(totalCnt.addComma());
@@ -666,9 +638,6 @@
 				$('#goodsNodata').show();
 				$('#goodsKeyword').text([[${params.keyword}]]);
 				$('#dataArea').hide();
-				$('#recomArea').show();
-				// 검색어 연관 상품 추천
-				fnRecommendItemList([[${params.keyword}]]);
 			}
 			gagaInfiniteScroll.draw('not');
 		}
@@ -789,6 +758,9 @@
 	}
 
 	$(document).ready( function() {
+		// 검색어 연관 상품 추천
+		fnRecommendItemList([[${params.keyword}]]);
+
 		// 광고배너체크
 		if(!gagajf.isNull(adBannerList) && adBannerList.length>0){
 			var imgUrl = [[${@environment.getProperty('upload.image.view')}]];
@@ -1085,6 +1057,8 @@
 					html += '	</div>\n';
 					html += '</div>\n';
 				});
+			}else{
+				$('#recomArea').hide();
 			}
 			$("#recommendItemArea").append(html);
 
@@ -1105,6 +1079,8 @@
 		//listIdx = 1;
 		$('#endPage').hide();
 		$('#noFilterData').hide();
+		// 추천상품 hide
+		$('#recomArea').hide();
 	}
 
 	//TabWrap, TabIndex

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreExchangeDetailFormMob.html

@@ -347,6 +347,7 @@
 	let jsonObj = {};
 	let kcpReceiptUrl = [[${kcpReceiptUrl}]];
 	let oneData = [[${oneData}]];
+	let ordNo = oneData.ordNo;
 	let isLogin = [[${isLogin}]];
 	
 	// 추가배송비 전표 데이터 설정

src/main/webapp/WEB-INF/views/mob/order/OrderFormMob.html

@@ -445,6 +445,22 @@
 				</div>
 			</div>
 			
+			<!-- 2021.09.16 정지혜 과장 요청 추가 -->
+			<div class="inner">
+				<div class="announce_txt">
+					<div class="note_txt">
+						<img src="/images/mo/ico_content_find03.png" alt="유의사항">
+						<p>유의사항</p>
+					</div>
+					<div class="announce_list">
+						<ul>
+							<li>품절시는 자동으로 취소되며 취소 알림톡을 발송드립니다. 품절취소 상품 외 나머지 상품은 발송됩니다. </li>
+							<li>업체/상품/브랜드에 따라 재고는 일부 상이할수 있으므로 고객님의 너른 양해를 부탁드립니다.</li>
+						</ul>
+					</div>
+				</div>
+			</div>
+			
 			<!-- //결제 정보 -->
 			<div class="inner wide">
 				<div class="area_paybtn">

src/main/webapp/WEB-INF/views/mob/planning/PlanningDetailFormMob.html

@@ -1230,7 +1230,7 @@ $(document).ready(function(){
 	}); */
 
 	// 210602_드롭박스 상단고정
-	var itemTopTxt=$('.dp .dp_listItems_wrap.type1 .dp_subtitle').text();
+	/*var itemTopTxt=$('.dp .dp_listItems_wrap.type1 .dp_subtitle').text();
 	var itemTop2Txt=$('.dp .dp_listItems_wrap.type2 .dp_subtitle').text();
 	var itemTop3Txt=$('.dp .other_promotion_slide .dp_subtitle').text();
 	$(window).scroll(function(){
@@ -1265,7 +1265,43 @@ $(document).ready(function(){
 			$("#gnb").show();
 		}
 	});
-
+	*/
+	
+	// 210927_드롭박스 상단고정 수정
+	$(window).scroll(function(){
+		var scrollTop= $(window).scrollTop();
+		var itemTop=$('.dp .dp_listItems_wrap.type1').offset().top;
+
+	    if (scrollTop >= itemTop){
+	        $('.dp .dp_listItems_wrap .items_option').addClass('fix');
+	    } else {
+	        $('.dp .dp_listItems_wrap .items_option').removeClass('fix');
+	    }
+	    
+	    // 해당 코너영역 선택 활성화 210812
+	    var cornerList = $("#cornerGoodsList > div.inner .dp_subtitle"); 
+		$.each(cornerList, function(idx, item){
+			var target   = $("#cornerGoodsList > div.inner .dp_subtitle").eq(idx), 
+				targetHig = $("#cornerGoodsList > div.inner").eq(idx).outerHeight(),
+				targetTop = target.offset().top - 61;
+
+			if (targetTop < scrollTop && scrollTop < (targetTop+targetHig)) {
+				if( $("#filter").html() != $(target).text()){
+					$("#filter").text($(target).text());
+					$(".button_list button").removeClass("on");
+					$(".button_list button").eq(idx).addClass("on");
+				}
+			}
+		});
+	    
+		 //210622_ 추가 : 헤더에 gnb 있을 경우. gnb 노출 제어.
+		if($(".typeSelector .items_option").hasClass("fix")){
+			$("#gnb").hide();
+		}else{
+			$("#gnb").show();
+		}
+	});
+	
 	//210510_추가 : 토스트 팝업 button 클릭 시 팝업 닫기.
 	$(document).on('click','.popup_box.odDatePop .button_list button',function(){
 		$(this).parents('.popup_box.odDatePop').hide().removeClass('active');

src/main/webapp/WEB-INF/views/web/display/BrandSearchGoodsListFormWeb.html

@@ -97,7 +97,7 @@
 						</div>
 						<!-- //통합 상품 검색결과 없을 시 노출 -->
 						<!-- 추천상품 노출 -->
-						<div class="sch_recommend" id="recomArea" style="display:none;">
+						<div class="sch_recommend" id="recomArea">
 							<h3>이런 상품은 어떤가요?</h3>
 							<div class="itemsGrp" id="recommendItemArea">
 
@@ -434,7 +434,6 @@
 				$('#noFilterData').hide();
 				$('#endPage').hide();
 				$('#goodsNodata').hide();
-				$('#recomArea').hide();
 				$('#goodsKeyword').text('');
 				$('.cont_body .lnb').show();
 				$('.cont_body .cont').show();
@@ -474,9 +473,6 @@
 					$('#goodsKeyword').text([[${params.keyword}]]);
 					$('.cont_body .lnb').hide();
 					$('.cont_body .cont').hide();
-					$('#recomArea').show();
-					// 검색어 연관 상품 추천
-					fnRecommendItemList([[${params.keyword}]]);
 				}
 				gagaInfiniteScroll.draw('not');
 			}
@@ -617,6 +613,9 @@
 		}
 
 		$(document).ready( function() {
+			// 검색어 연관 상품 추천
+			fnRecommendItemList([[${params.keyword}]]);
+
 			// 광고배너체크
 			if(!gagajf.isNull(adBannerList) && adBannerList.length>0){
 				var imgUrl = [[${@environment.getProperty('upload.image.view')}]];
@@ -935,6 +934,8 @@
 						html += '	</div>\n';
 						html += '</div>\n';
 					});
+				}else{
+					$("#recomArea").hide();
 				}
 				$("#recommendItemArea").append(html);
 			});
@@ -946,6 +947,8 @@
 			//listIdx = 1;
 			$('#endPage').hide();
 			$('#noFilterData').hide();
+			// 추천상품 hide
+			$("#recomArea").hide();
 		}
 	</script>
 

src/main/webapp/WEB-INF/views/web/display/MallMainFormWeb.html

@@ -521,6 +521,30 @@
 						</div>
 					</div>
 				</th:block>
+				<th:block th:if="${contentsLoc=='010'}">
+					<!-- 10. 당신을 위한 제안 -->
+					<div class="content main_foryou">
+						<div class="cont_head">
+							<p class="displayH" th:text="${mainLayoutData.contentsTitle}">당신을 위한 제안</p>
+							<span>스타일24에서 가장 주목받는 상품을 살펴보세요</span>
+						</div>
+						<div class="cont_body">
+							<div class="post-sug fy_nav">
+								<div class="swiper-container">
+									<div class="swiper-wrapper" id="keywordArea">
+
+									</div>
+								</div>
+								<div class="swiper-controls">
+									<div class="swiper-pagination"></div>
+								</div>
+							</div>
+							<div id="recomItemArea">
+
+							</div>
+						</div>
+					</div>
+				</th:block>
 			</th:block>
 	<!-- End Of Main Contents -->
 	</div>
@@ -592,8 +616,470 @@ $(document).ready( function() {
 
 	let randomNum = Math.floor( ( Math.random() * 4 ) );
 	$(".it_nav .btn").eq(randomNum).trigger('click');
+
+	// 당신을 위한 제안 쿠키값 확인 (로그인시 확인됨)
+	var pcId = gagajf.getCookie("RB_PCID");
+	// 추천솔루션 API 호출
+	//if(!gagajf.isNull(pcId)){
+		fnGetEigenApi(pcId);
+	//}
 });
 
+/**
+ * EigenApi
+ * size : 상품수
+ * nh : 키워드수
+ * */
+var fnGetEigenApi = function (id){
+	// console.log('[fnGetEigenApi ID]'+id);
+	$.getJSON('https://api.eigene.io/rec/p075?cuid=1252aed4-78dc-46e8-b784-94ac42e86dd4&size=10&nh=10&pcid='+id, function (result,status){
+		var keywordTag = '';
+		var itemTag = '';
+		var itemTag2 = '';
+		let dataJson = result.groupedResults;
+		let key1 = Object.keys(dataJson);
+
+		if (status === 'success') {
+			if (!gagajf.isNull(result.products) && result.products.length > 0) {
+				$("#keywordArea").html('');
+				$("#recomItemArea").html('');
+				$.each(result.products, function (idx, item) {
+					if (idx == 0 || idx == 5) {
+						keywordTag += '<div class="swiper-slide">\n';
+						keywordTag += '	<ul>\n';
+					}
+					keywordTag += '<li>\n';
+					keywordTag += '	<button class="btn btn_shape active" data-tab="fy' + (idx + 1) + '">\n';
+					keywordTag += '		<div>\n';
+					keywordTag += '			<span class="number">' + (idx + 1) + '</span>\n';
+					keywordTag += '			<span>' + item.sourceId + '</span>\n';
+					keywordTag += '		</div>\n';
+					keywordTag += '	</button>\n';
+					keywordTag += '	<a href="javascript:void(0);" onclick="cfnGoToSearchGoodsListForm(\''+ item.sourceId + '\')">자세히 보기</a>\n';
+					keywordTag += '</li>\n';
+					if (idx == 4 || idx == 9) {
+						keywordTag += '	</ul>';
+						keywordTag += '</div>';
+					}
+
+					for (var i=0; i<key1.length; i++) {
+						var key = key1[i];
+						// console.log("key : " + key + ", value : " + dataJson[key])
+						if(item.sourceId == key){
+								itemTag += '<div class="fy_item" id="fy'+(idx+1)+'">\n';
+								$.each(dataJson[key], function (keyIdx, keyItem){
+									if(idx%2 == 0) {
+										if(keyIdx==0){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==1){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==2){
+											itemTag += '	<div class="part lg">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==3){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==4){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==5){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==6){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}
+									}else{
+										if(keyIdx==0){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==1){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==2){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==3){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==4){
+											itemTag += '	<div class="part">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+										}else if(keyIdx==5){
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}else if(keyIdx==6){
+											itemTag += '	<div class="part lg">\n';
+											itemTag += '		<div class="item_prod">\n';
+											itemTag += '			<div class="item_state">\n';
+											itemTag += '				<button type="button" class="itemLike" tabindex="0" goodsCd="'+keyItem.product.itemId+'" goodsNm="'+keyItem.product.itemName+'" onclick="cfnPutWishList(this);">관심상품 추가</button>\n';
+											itemTag += '				<a href="'+keyItem.product.itemUrl+'" class="itemLink" tabindex="0">\n';
+											itemTag += '					<div class="itemPic">\n';
+											itemTag += '						<img alt="BLACK-a" class=" vLHTC pd_img" src="'+keyItem.product.itemImage+'">\n';
+											itemTag += '					</div>\n';
+											itemTag += '					<div class="itemInfo">\n';
+											itemTag += '						<p class="itemBrand">'+keyItem.product.brandName+'</p>\n';
+											itemTag += '						<div class=" itemName">'+keyItem.product.itemName+'</div>\n';
+											itemTag += '						<p class="itemPrice">'+keyItem.product.salePrice.addComma()+'</p>\n';
+											itemTag += '					</div>\n';
+											itemTag += '				</a>\n';
+											itemTag += '			</div>\n';
+											itemTag += '		</div>\n';
+											itemTag += '	</div>\n';
+										}
+									}
+
+								});
+								itemTag += '</div>\n';
+						}
+					}
+				});
+				$("#keywordArea").append(keywordTag);
+				$("#recomItemArea").append(itemTag);
+
+				// 위시 좋아요 처리
+				if (cfCheckLogin()) {
+					let targetT = $('.main_foryou').find('#recomItemArea').find('.item_state').find('button');
+					//let targetTSize = targetT.length;
+					targetT.each(function(){
+						let goodsCd = $(this).attr('goodscd');
+						var $this = $(this);
+						let url = "/mypage/wish/list/check/"+goodsCd;
+						var result = '';
+						$.ajax({
+							type: 'get'
+							, async: false
+							, url: url
+							, success: function (data) {
+								//likeit active
+								if ("Y" == data){
+									$this.addClass('likeit').addClass('active');
+								}
+							}
+						});
+					});
+				}
+
+				/* SLIDE - MAIN_RECOMM */
+				//MAIN_RECOMM_키워드 탭
+				$(".main_recomm .tag_list .btn").click(function () {
+					var recommActive = $(this).attr('data-tab');
+					$(".main_recomm .tag_list .btn").removeClass('active');
+					$(".main_recomm .tagitem").removeClass('active');
+					$(this).addClass('active');
+					$('#' + recommActive).addClass('active');
+				});
+
+				function init() {
+
+					if (main_recomm_slide != null) main_recomm_slide.destroy();
+
+					var main_recomm_slide = new Swiper('.main_recomm .post-recomm', {
+						slidesPerView: 5,
+						slidesPerGroup: 5,
+						speed: 1000,
+						spaceBetween: 20,
+						loop: true,
+						a11y: {
+							enabled: true,
+							notificationClass: 'swiper-notification',
+							prevSlideMessage: '이전 슬라이드',
+							nextSlideMessage: '다음 슬라이드',
+							paginationBulletMessage: '슬라이드 {{index}}로 이동',
+						},
+						pagination: {
+							el: '.main_recomm .swiper-pagination',
+							clickable: true,
+						},
+						navigation: {
+							nextEl: '.main_recomm .swiper-button-next',
+							prevEl: '.main_recomm .swiper-button-prev',
+						},
+						observer: true,
+						observeParents: true,
+					});
+				}
+
+				init();
+
+				/* SLIDE - MAIN_FORYOU */
+				var cntNum = 0;
+				var main_foryou_slide = new Swiper('.main_foryou .post-sug .swiper-container', {
+					allowTouchMove: false,
+					loop: false,
+					effect: 'fade',
+					autoHeight: false,
+					autoplay: {
+						delay: 25000,
+						disableOnInteraction: false,
+					},
+					a11y: {
+						enabled: true,
+						notificationClass: 'swiper-notification',
+						prevSlideMessage: '이전 슬라이드',
+						nextSlideMessage: '다음 슬라이드',
+						paginationBulletMessage: '슬라이드 {{index}}로 이동',
+					},
+					pagination: {
+						el: '.post-sug .swiper-pagination',
+						clickable: true,
+					},
+					on: {
+						slideChange: function () {
+							$(".fy_nav .swiper-slide li").children('.btn_shape').removeClass('active');
+							$(".fy_nav .swiper-slide-next li").eq(0).children('.btn_shape').addClass('active');
+							$(".fy_nav .swiper-slide-prev li").eq(0).children('.btn_shape').addClass('active');
+							foryouIndex = -1;
+							if (cntNum === 0) {
+								$('.fy_item').removeClass('active');
+								$('#fy6').addClass('active');
+								cntNum = 1;
+							} else {
+								$('.fy_item').removeClass('active');
+								$('#fy1').addClass('active');
+								cntNum = 0;
+							}
+
+							clearInterval(ti);
+							ti = startTimeInterval();
+						}
+					},
+				});
+
+				function foryouInterval(_foryouIndex) {
+					var foryouCateItems = $(".main_foryou .fy_nav .swiper-slide-active ul li .btn_shape");
+					$(foryouCateItems[(_foryouIndex + 1) % 5]).addClass("active");
+					$(foryouCateItems[_foryouIndex % 5]).removeClass("active");
+				}
+
+				function foryouFy_item(_Fy_itemIndex) {
+					var fynavItems = $('.main_foryou .fy_nav .swiper-slide-active ul li .btn_shape.active');
+					var fyActive = $(fynavItems).attr('data-tab');
+					// $(".fy_nav .btn_shape").removeClass('active');
+					$(".fy_item").removeClass('active');
+					// $(".fy_item").addClass('active');
+					$('#' + fyActive).addClass('active');
+				}
+
+				var foryouIndex = 0;
+				var ti;
+
+				function startTimeInterval() {
+					return setInterval(function () {
+						$(".fy_nav .btn_shape").removeClass('active');
+						$(".fy_item").removeClass('active');
+						foryouInterval(foryouIndex);
+						foryouFy_item();
+						if (foryouIndex >= 5) foryouIndex = 0;
+						foryouIndex++;
+					}, 5000);
+				}
+
+				$(".fy_nav .btn_shape").click(function () {
+					var fyActive = $(this).attr('data-tab');
+					$(".fy_nav .btn_shape").removeClass('active');
+					$(".fy_item").removeClass('active');
+					$(this).addClass('active');
+					$('#' + fyActive).addClass('active');
+				});
+
+				$(".fy_nav ul li").click(function () {
+					foryouIndex = $(this).index();
+					clearInterval(ti);
+					ti = startTimeInterval();
+				});
+
+				ti = startTimeInterval();
+			}
+		}
+	});
+}
+
 /* SLIDE - MAIN_VISUAL */
 var agent = navigator.userAgent.toLowerCase();
 

src/main/webapp/WEB-INF/views/web/display/SearchGoodsListFormWeb.html

@@ -113,34 +113,10 @@
 						</div>
 						<!-- //통합 상품 검색결과 없을 시 노출 -->
 						<!-- 추천상품 노출 -->
-						<div class="sch_recommend" style="display:none;">
+						<div class="sch_recommend">
 							<h3>이런 상품은 어떤가요?</h3>
 							<div class="itemsGrp" id="recommendItemArea">
-								<div class="item_prod">
-									<div class="item_state">
-										<button type="button" class="itemLike">관심상품 추가</button>
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" th:src="${@environment.getProperty('domain.uximage')} + '/images/pc/thumb/tmp_pdTogether1.jpg'">
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<p class="itemPrice">80,100
-												<span class="itemPrice_original">89,000</span>
-												<span class="itemPercent">10%</span>
-											</p>
-											<p class="itemBadge">
-												<span class="badge13">베스트 </span>
-											</p>
-											<div class="itemcolorchip">
-												<span class="chip_color35" value="ABM">BEIGE</span>
-												<span class="chip_color54" value="BDS">BLACK</span>
-												<span class="chip_color40" value="YBR">WHITE</span>
-											</div>
-											<div class="itemComment">#주문 폭주 상품</div>
-										</a>
-									</div>
-								</div>
+
 							</div>
 						</div>
 						<!-- //추천상품 노출 -->
@@ -490,6 +466,8 @@
 		var adBannerTag = '';
 		var filterPriceList = [[${filterPriceList}]];
 		var custom_values = [];
+		var recommendItemList = [[${recommendItemList}]];
+		console.log('recommendItemList::'+recommendItemList.result);
 
 		// 상품리스트 페이지 확인용
 		var listIdx = 1;
@@ -536,7 +514,7 @@
 				$('#noFilterData').hide();
 				$('#endPage').hide();
 				$('#goodsNodata').hide();
-				$('.sch_recommend').hide();
+				// $('.sch_recommend').show();
 				$('#goodsKeyword').text('');
 				$('.cont_body .lnb').show();
 				//$('.cont_body .cont').show();
@@ -551,6 +529,8 @@
 				listIdx++;
 				fnImgOnoff();
 			}else{
+				// 추천상품 hide
+				// $('.sch_recommend').hide();
 				if(listIdx > 1){ // 데이터가 1건 이상
 					if(totalCnt > Number($("#searchGoodsForm").find("input[name=pageSize]").val())){
 						if($("#searchGoodsForm input[name=pageNo]").val()==1){
@@ -577,9 +557,6 @@
 					$('.cont_body .lnb').hide();
 					//$('.cont_body .cont').hide();
 					$("#filterArea").hide();
-					$('.sch_recommend').show();
-					// 검색어 연관 상품 추천
-					fnRecommendItemList([[${params.keyword}]]);
 				}
 				gagaInfiniteScroll.draw('not');
 			}
@@ -850,6 +827,9 @@
 		}
 
 		$(document).ready( function() {
+			// 검색어 연관 상품 추천
+			fnRecommendItemList([[${params.keyword}]]);
+
 			// 광고배너체크
 			if(!gagajf.isNull(adBannerList) && adBannerList.length>0){
 				var imgUrl = [[${@environment.getProperty('upload.image.view')}]];
@@ -1170,6 +1150,8 @@
 						html += '	</div>\n';
 						html += '</div>\n';
 					});
+				}else{
+					$('.sch_recommend').hide();
 				}
 				$("#recommendItemArea").append(html);
 			});
@@ -1181,6 +1163,8 @@
 			//listIdx = 1;
 			$('#endPage').hide();
 			$('#noFilterData').hide();
+			// 추천상품 hide
+			$('.sch_recommend').hide();
 		}
 
 	</script>

src/main/webapp/WEB-INF/views/web/order/OrderFormWeb.html

@@ -395,6 +395,15 @@
 								</div>
 							</div>
 							
+							<!-- 2021.09.16 정지혜 과장 요청 추가 -->
+							<div class="com_info_txt">
+								<p class="tit">품절 관련 안내</p>
+								<ul>
+									<li>품절시는 자동으로 취소되며 취소 알림톡을 발송드립니다. 품절취소 상품 외 나머지 상품은 발송됩니다. </li>
+									<li>업체/상품/브랜드에 따라 재고는 일부 상이할수 있으므로 고객님의 너른 양해를 부탁드립니다.</li>
+								</ul>
+							</div>
+							
 							<div class="area_paybtn">
 								<div class="form_field">
 									<button type="button" class="btn btn_primary btn_block" id="btn_payment">

src/main/webapp/ux/mo/js/common_m.js

@@ -66,11 +66,13 @@ $(document).ready(function() {
         var currentCategory = "mainScrollPoint"; //이벤트 발생 후 새로 로드된 현재 페이지의 카테고리 지정
         //3.스크롤 값 가져오기
         $('a').on("click", function(){
+        	if( undefined != $(this).attr('href')){
                 if($(this).attr('href').indexOf('html') !== -1){
                     var scrollPoint = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop;
                     setCookie("category", "mainScrollPoint"); // 쿠키에서 사용할 category에 사용자 정의 카테고리명 세팅
                     setCookie("scrollPoint", scrollPoint); // 쿠키에 스크롤 위치 세팅
                }
+            }
         });
         //4. 뒤로가기 시 이전페이지 스크롤 이동
         window.onpageshow = function(event) {