검색결과 내 추천 상품

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

@@ -163,7 +163,7 @@ public class EigeneaiApi {
 	 * @since 2021. 6. 30
 	 */
 	public Collection<Result> getBrandWeeklySellBestGoodsList(int size, Integer brandGroupNo) {
-		String requestUrl = apiUrl + "/m061?cuid=" + cuid + "&size=" + size + "&bids=" + brandGroupNo;
+		String requestUrl = apiUrl + "/m061?cuid=" + cuid + "&size=" + size + "&inbids=" + brandGroupNo;
 
 		Eigeneai eigeneai = this.getEigeneaiInfo(requestUrl);
 		if (eigeneai.getResults() != null && !eigeneai.getResults().isEmpty()) {
@@ -204,7 +204,7 @@ public class EigeneaiApi {
 	 * @since 2021. 6. 30
 	 */
 	public Collection<Result> getBrandMonthlyClickBestGoodsList(int size, Integer brandGroupNo) {
-		String requestUrl = apiUrl + "/m062?cuid=" + cuid + "&size=" + size + "&bids=" + brandGroupNo;
+		String requestUrl = apiUrl + "/m062?cuid=" + cuid + "&size=" + size + "&inbids=" + brandGroupNo;
 
 		Eigeneai eigeneai = this.getEigeneaiInfo(requestUrl);
 		if (eigeneai.getResults() != null && !eigeneai.getResults().isEmpty()) {

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

@@ -25,7 +25,7 @@
 				<form id="InnerSearchForm" name="InnerSearchForm">
 					<input type="hidden" name="brandGroupNo" th:value="${params.brandGroupNo}">
 					<div class="sch_title">
-						<input type="text" class="form_control" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" maxlength="100">
+						<input type="text" class="form_control" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" maxlength="100" autocomplete="off">
 						<!-- <button class="btn_x">X</button> -->
 						<button type="button" class="btn_sch" onclick="fnSearchData();"><img src="/images/mo/ico_btn_search.png" alt=""></button>
 					</div>
@@ -43,125 +43,13 @@
 				</div>
 
 				<!-- 이런상품은 어떤가요 -->
-				<div class="now_view">
+				<div class="now_view" id="recomArea" style="display:none;">
 					<div class="store_product">
 						<div class="allresult-tit">
 							<h3>이런 상품은 어떤가요?</h3>
 						</div>
 						<div class="swiper-container sch_product">
-							<div class="swiper-wrapper">
-								<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" src="/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 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" src="/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 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" src="/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 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" src="/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 class="swiper-wrapper" id="recommendItemArea">
 								<div class="swiper-slide">
 									<div class="item_prod">
 										<div class="item_state">
@@ -631,6 +519,7 @@
 		$('#noDataFilter').hide();
 		$('#goodsNodata').hide();
 		$('#goodsKeyword').text('');
+		$('#recomArea').hide();
 		totalCnt = result.paging.totalCount;
 		$("#totCntId").text(totalCnt.addComma());
 		$("#prodListCnt").text('('+totalCnt.addComma()+')');
@@ -648,6 +537,7 @@
 			$('#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;
@@ -678,6 +568,9 @@
 				$('#goodsNodata').show();
 				$('#goodsKeyword').text([[${params.keyword}]]);
 				$('#dataArea').hide();
+				$('#recomArea').show();
+				// 검색어 연관 상품 추천
+				fnRecommendItemList([[${params.keyword}]]);
 			}
 			gagaInfiniteScroll.draw('not');
 		}
@@ -1035,6 +928,56 @@
 		return tag;
 	}
 
+	// 검색어 연관 상품 추천
+	var fnRecommendItemList = function (keyword){
+		if(gagajf.isNull(keyword)){
+			keyword = "";
+		}
+		var data = {keyword : keyword};
+		var html = '';
+
+		$.getJSON('/display/recommend/item/list', data, function (result){
+			$("#recommendItemArea").html('');
+			if(result.length > 0){
+				$.each(result, function (idx, item){
+					html += '<div class="swiper-slide">\n';
+					html += '	<div class="item_prod">\n';
+					html += '		<div class="item_state">\n';
+					html += '			<button type="button" class="itemLike">관심상품 추가</button>\n';
+					html += '			<a href="'+item.product.itemUrl+'" class="itemLink">\n';
+					html += '				<div class="itemPic">\n';
+					html += '					<img class="vLHTC pd_img" src="'+item.product.itemImage+'" alt="">\n';
+					html += '				</div>\n';
+					html += '				<p class="itemBrand">'+item.product.brandName+'</p>\n';
+					html += '				<div class=" itemName">'+item.product.itemName+'</div>\n';
+					html += '				<p class="itemPrice">\n';
+					if(item.product.salePrice < item.product.originalPrice) {
+						html += '			<span class="itemPrice_original">'+ item.product.originalPrice.addComma() +'</span>\n';
+					}
+					html += item.product.salePrice.addComma() ;
+					if(item.product.salePrice < item.product.originalPrice) {
+						html += '			<span class="itemPercent">' + Math.round((item.product.originalPrice - item.product.salePrice) / (item.product.originalPrice * 1.0) * 100) + '%</span>\n';
+					}
+					html += '				</p>\n';
+					html += '			</a>\n';
+					html += '		</div>\n';
+					html += '	</div>\n';
+					html += '</div>\n';
+				});
+			}
+			$("#recommendItemArea").append(html);
+
+			var swiperschProduct2 = new Swiper('.swiper-container.sch_product', {
+				slidesPerView: 2.2,
+				spaceBetween: 7,
+				autoplay: {
+					delay: 4000,
+				},
+				freeMode: true,
+			});
+		});
+	}
+
 	//TabWrap, TabIndex
 	$(document).on('click', '.tabIndex li a', function() {
 		var $this = $(this),

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

@@ -24,7 +24,7 @@
 			<div class="inner">
 				<div class="sch_title">
 					<form id="InnerSearchForm" name="InnerSearchForm">
-					<input type="text" class="form_control" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" maxlength="100">
+					<input type="text" class="form_control" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" maxlength="100" autocomplete="off">
 					<!-- <button class="btn_x">X</button> -->
 					<button type="button" class="btn_sch" onclick="fnSearchData();"><img src="/images/mo/ico_btn_search.png" alt=""></button>
 					</form>
@@ -58,7 +58,7 @@
 								<!-- // 전체 검색결과 없을때 -->
 							</div>
 
-							<div class="inner" style="display:none;">
+							<div class="inner" id="recomArea" style="display:none;">
 								<!-- 이런상품은 어떤가요 -->
 								<div class="now_view">
 									<div class="store_product">
@@ -66,119 +66,7 @@
 											<h3>이런 상품은 어떤가요?</h3>
 										</div>
 										<div class="swiper-container sch_product">
-											<div class="swiper-wrapper">
-												<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" src="/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 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" src="/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 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" src="/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 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" src="/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 class="swiper-wrapper" id="recommendItemArea">
 												<div class="swiper-slide">
 													<div class="item_prod">
 														<div class="item_state">
@@ -724,6 +612,7 @@
 		$('#endPage').hide();
 		$('#noDataFilter').hide();
 		$('#goodsNodata').hide();
+		$('#recomArea').hide();
 		$('#goodsKeyword').text('');
 		totalCnt = result.paging.totalCount;
 		$("#totCntId").text(totalCnt.addComma());
@@ -774,14 +663,15 @@
 				$('#goodsNodata').show();
 				$('#goodsKeyword').text([[${params.keyword}]]);
 				$('#dataArea').hide();
+				$('#recomArea').show();
+				// 검색어 연관 상품 추천
+				fnRecommendItemList([[${params.keyword}]]);
 			}
 			gagaInfiniteScroll.draw('not');
 		}
 
 	}
 
-
-
 	// 이벤트 리스트
 	let fnGetSearchEventList = function (){
 		gagajf.ajaxFormSubmit("/display/search/event/list", document.searchGoodsForm, fnReturnEventList);
@@ -1131,6 +1021,56 @@
 		return tag;
 	}
 
+	// 검색어 연관 상품 추천
+	var fnRecommendItemList = function (keyword){
+		if(gagajf.isNull(keyword)){
+			keyword = "";
+		}
+		var data = {keyword : keyword};
+		var html = '';
+
+		$.getJSON('/display/recommend/item/list', data, function (result){
+			$("#recommendItemArea").html('');
+			if(result.length > 0){
+				$.each(result, function (idx, item){
+					html += '<div class="swiper-slide">\n';
+					html += '	<div class="item_prod">\n';
+					html += '		<div class="item_state">\n';
+					html += '			<button type="button" class="itemLike">관심상품 추가</button>\n';
+					html += '			<a href="'+item.product.itemUrl+'" class="itemLink">\n';
+					html += '				<div class="itemPic">\n';
+					html += '					<img class="vLHTC pd_img" src="'+item.product.itemImage+'" alt="">\n';
+					html += '				</div>\n';
+					html += '				<p class="itemBrand">'+item.product.brandName+'</p>\n';
+					html += '				<div class=" itemName">'+item.product.itemName+'</div>\n';
+					html += '				<p class="itemPrice">\n';
+					if(item.product.salePrice < item.product.originalPrice) {
+						html += '			<span class="itemPrice_original">'+ item.product.originalPrice.addComma() +'</span>\n';
+					}
+					html += item.product.salePrice.addComma() ;
+					if(item.product.salePrice < item.product.originalPrice) {
+						html += '			<span class="itemPercent">' + Math.round((item.product.originalPrice - item.product.salePrice) / (item.product.originalPrice * 1.0) * 100) + '%</span>\n';
+					}
+					html += '				</p>\n';
+					html += '			</a>\n';
+					html += '		</div>\n';
+					html += '	</div>\n';
+					html += '</div>\n';
+				});
+			}
+			$("#recommendItemArea").append(html);
+
+			var swiperschProduct2 = new Swiper('.swiper-container.sch_product', {
+				slidesPerView: 2.2,
+				spaceBetween: 7,
+				autoplay: {
+					delay: 4000,
+				},
+				freeMode: true,
+			});
+		});
+	}
+
 	//TabWrap, TabIndex
 	$(document).on('click', '.tabIndex li a', function() {
 		var $this = $(this),

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

@@ -36,7 +36,7 @@
 								<input type="hidden" name="brandGroupNo" th:value="${params.brandGroupNo}">
 								<fieldset>
 									<legend>결과 내 재검색</legend>
-									<input type="text" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" class="search_input" title="검색어 입력" maxlength="100" >
+									<input type="text" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" class="search_input" title="검색어 입력" maxlength="100" autocomplete="off">
 									<button type="button" class="sch_btn" onclick="fnSearchData();"><span>검색</span></button>
 								</fieldset>
 							</form>
@@ -111,134 +111,10 @@
 						</div>
 						<!-- //통합 상품 검색결과 없을 시 노출 -->
 						<!-- 추천상품 노출 -->
-						<div class="sch_recommend" style="display:none;">
+						<div class="sch_recommend" id="recomArea" style="display:none;">
 							<h3>이런 상품은 어떤가요?</h3>
-							<div class="itemsGrp">
-								<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" src="/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 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" src="/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 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" src="/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 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" src="/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 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" src="/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 class="itemsGrp" id="recommendItemArea">
+
 							</div>
 						</div>
 						<!-- //추천상품 노출 -->
@@ -558,6 +434,7 @@
 				$('#noFilterData').hide();
 				$('#endPage').hide();
 				$('#goodsNodata').hide();
+				$('#recomArea').hide();
 				$('#goodsKeyword').text('');
 				$('.cont_body .lnb').show();
 				$('.cont_body .cont').show();
@@ -597,6 +474,9 @@
 					$('#goodsKeyword').text([[${params.keyword}]]);
 					$('.cont_body .lnb').hide();
 					$('.cont_body .cont').hide();
+					$('#recomArea').show();
+					// 검색어 연관 상품 추천
+					fnRecommendItemList([[${params.keyword}]]);
 				}
 				gagaInfiniteScroll.draw('not');
 			}
@@ -1071,6 +951,43 @@
 			});
 		}
 
+		// 검색어 연관 상품 추천
+		var fnRecommendItemList = function (keyword){
+			if(gagajf.isNull(keyword)){
+				keyword = "";
+			}
+			var data = {keyword : keyword};
+			var html = '';
+
+			$.getJSON('/display/recommend/item/list', data, function (result){
+				$("#recommendItemArea").html('');
+				if(result.length > 0){
+					$.each(result, function (idx, item){
+						html += '<div class="item_prod">\n';
+						html += '	<div class="item_state">\n';
+						html += '		<button type="button" class="itemLike">관심상품 추가</button>\n';
+						html += '		<a href="'+item.product.itemUrl+'" class="itemLink">\n';
+						html += '			<div class="itemPic">\n';
+						html += '				<img alt="" class="vLHTC pd_img" src="'+item.product.itemImage+'">\n';
+						html += '			</div>\n';
+						html += '			<p class="itemBrand">'+item.product.brandName+'</p>\n';
+						html += '			<div class="itemName">'+item.product.itemName+'</div>\n';
+						html += '			<p class="itemPrice">\n';
+						html += item.product.salePrice.addComma() ;
+						if(item.product.salePrice < item.product.originalPrice) {
+							html += '			<span class="itemPrice_original">'+ item.product.originalPrice.addComma() +'</span>\n';
+							html += '			<span class="itemPercent">' + Math.round((item.product.originalPrice - item.product.salePrice) / (item.product.originalPrice * 1.0) * 100) + '%</span>\n';
+						}
+						html += '			</p>\n';
+						html += '		</a>\n';
+						html += '	</div>\n';
+						html += '</div>\n';
+					});
+				}
+				$("#recommendItemArea").append(html);
+			});
+		}
+
 
 	</script>
 

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

@@ -36,7 +36,7 @@
 								<input type="hidden" name="brandGroupNo" th:value="${params.brandGroupNo}">
 								<fieldset>
 									<legend>결과 내 재검색</legend>
-									<input type="text" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" class="search_input" title="검색어 입력" maxlength="100" >
+									<input type="text" id="keyword" name="keyword" th:value="${params.keyword}" placeholder="" class="search_input" title="검색어 입력" maxlength="100" autocomplete="off">
 									<button type="button" class="sch_btn" onclick="fnSearchData();"><span>검색</span></button>
 								</fieldset>
 							</form>
@@ -115,107 +115,7 @@
 						<!-- 추천상품 노출 -->
 						<div class="sch_recommend" style="display:none;">
 							<h3>이런 상품은 어떤가요?</h3>
-							<div class="itemsGrp">
-								<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" src="/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 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" src="/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 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" src="/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 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" src="/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 class="itemsGrp" id="recommendItemArea">
 								<div class="item_prod">
 									<div class="item_state">
 										<button type="button" class="itemLike">관심상품 추가</button>
@@ -622,6 +522,7 @@
 				$('#noFilterData').hide();
 				$('#endPage').hide();
 				$('#goodsNodata').hide();
+				$('.sch_recommend').hide();
 				$('#goodsKeyword').text('');
 				$('.cont_body .lnb').show();
 				$('.cont_body .cont').show();
@@ -661,6 +562,9 @@
 					$('#goodsKeyword').text([[${params.keyword}]]);
 					$('.cont_body .lnb').hide();
 					$('.cont_body .cont').hide();
+					$('.sch_recommend').show();
+					// 검색어 연관 상품 추천
+					fnRecommendItemList([[${params.keyword}]]);
 				}
 				gagaInfiniteScroll.draw('not');
 			}
@@ -1264,8 +1168,41 @@
 			});
 		}
 
+		var fnRecommendItemList = function (keyword){
+			if(gagajf.isNull(keyword)){
+				keyword = "";
+			}
+			var data = {keyword : keyword};
+			var html = '';
 
-
+			$.getJSON('/display/recommend/item/list', data, function (result){
+				$("#recommendItemArea").html('');
+				if(result.length > 0){
+					$.each(result, function (idx, item){
+						html += '<div class="item_prod">\n';
+						html += '	<div class="item_state">\n';
+						html += '		<button type="button" class="itemLike">관심상품 추가</button>\n';
+						html += '		<a href="'+item.product.itemUrl+'" class="itemLink">\n';
+						html += '			<div class="itemPic">\n';
+						html += '				<img alt="" class="vLHTC pd_img" src="'+item.product.itemImage+'">\n';
+						html += '			</div>\n';
+						html += '			<p class="itemBrand">'+item.product.brandName+'</p>\n';
+						html += '			<div class="itemName">'+item.product.itemName+'</div>\n';
+						html += '			<p class="itemPrice">\n';
+						html += item.product.salePrice.addComma() ;
+						if(item.product.salePrice < item.product.originalPrice) {
+							html += '				<span class="itemPrice_original">'+ item.product.originalPrice.addComma() +'</span>\n';
+							html += '				<span class="itemPercent">' + Math.round((item.product.originalPrice - item.product.salePrice) / (item.product.originalPrice * 1.0) * 100) + '%</span>\n';
+						}
+						html += '			</p>\n';
+						html += '		</a>\n';
+						html += '	</div>\n';
+						html += '</div>\n';
+					});
+				}
+				$("#recommendItemArea").append(html);
+			});
+		}
 
 	</script>