검색엔진관련 로직 수정

pom.xml

@@ -175,13 +175,41 @@
 		<!-- \\\ USAFE 보증보험 -->
 		
 		<!-- /// 검색엔진(DIQUEST) -->
-<!-- 		<dependency> -->
-<!-- 			<groupId>com.diquest</groupId> -->
-<!-- 			<artifactId>diquest</artifactId> -->
-<!-- 			<version>0.1</version> -->
-<!-- 			<scope>system</scope> -->
-<!-- 			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/diquest.jar</systemPath> -->
-<!-- 		</dependency> -->
+		<dependency>
+			<groupId>com.diquest</groupId>
+			<artifactId>istyle</artifactId>
+			<version>0.1</version>
+			<scope>system</scope>
+			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/Istyle.jar</systemPath>
+		</dependency>
+		<dependency>
+			<groupId>com.diquest.ir</groupId>
+			<artifactId>client</artifactId>
+			<version>0.1</version>
+			<scope>system</scope>
+			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/m4_client.jar</systemPath>
+		</dependency>
+		<dependency>
+			<groupId>com.diquest.ir</groupId>
+			<artifactId>common</artifactId>
+			<version>0.1</version>
+			<scope>system</scope>
+			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/m4_common.jar</systemPath>
+		</dependency>
+		<dependency>
+			<groupId>com.diquest.ir</groupId>
+			<artifactId>util</artifactId>
+			<version>0.1</version>
+			<scope>system</scope>
+			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/m4_util.jar</systemPath>
+		</dependency>
+		<dependency>
+			<groupId>org.json</groupId>
+			<artifactId>simple</artifactId>
+			<version>1.1</version>
+			<scope>system</scope>
+			<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/json_simple-1.1.jar</systemPath>
+		</dependency>
 		<!-- \\\ 검색엔진(DIQUEST) -->
 		
 	</dependencies>

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

@@ -1,18 +1,24 @@
 package com.style24.front.biz.thirdparty;
 
-import javax.annotation.PostConstruct;
+import java.util.HashMap;
+import java.util.Map;
 
+import javax.annotation.PostConstruct;
 
+import org.json.simple.JSONObject;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.core.env.Environment;
 import org.springframework.stereotype.Component;
 
+import com.diquest.ir.common.exception.IRException;
+import com.fasterxml.jackson.databind.ObjectMapper;
+import com.google.gson.Gson;
 import com.style24.persistence.domain.searchengine.SearchEngine;
 
-import lombok.extern.slf4j.Slf4j;
+import istyle.AutoSearch;
+import istyle.SearchService;
 
-import java.util.HashMap;
-import java.util.Map;
+import lombok.extern.slf4j.Slf4j;
 
 /**
  * 검색엔진 - NHN다이퀘스트
@@ -50,22 +56,61 @@ public class SearchEngineDiquest {
 	public SearchEngine getTrendKeywordList() {
 		SearchEngine result = new SearchEngine();
 
-//		// 인기검색어
-//		Map<String, Object> map = new HashMap<String, Object>();
-//		map.put("adminIp", ipAddr);
-//		map.put("adminPort", port);
-//
-//		try {
-//			JSONObject jsonObj = AutoSearch.trendKeyword(map);
-//			log.info("jsonObj.toJSONString(): {}", jsonObj.toJSONString());
-//
-//			Gson gson = new Gson();
-//			result = gson.fromJson(jsonObj.toJSONString(), SearchEngine.class);
-//		} catch (IRException e) {
-//			e.printStackTrace();
-//		}
+		// 인기검색어
+		Map<String, Object> map = new HashMap<String, Object>();
+		map.put("adminIp", ipAddr);
+		map.put("adminPort", port);
+
+		try {
+			JSONObject jsonObj = AutoSearch.trendKeyword(map);
+			log.info("jsonObj.toJSONString(): {}", jsonObj.toJSONString());
+
+			Gson gson = new Gson();
+			result = gson.fromJson(jsonObj.toJSONString(), SearchEngine.class);
+		} catch (IRException e) {
+			e.printStackTrace();
+		}
 
 		return result;
 	}
 
-}
+	/**
+	 * 상품리스트
+	 * @param params - 파라미터
+	 * @return
+	 * @author gagamel
+	 * @since 2021. 5. 31
+	 */
+	public SearchEngine getGoodsList(SearchEngine params) {
+		SearchEngine result = new SearchEngine();
+
+		Map<String, Object> paramMap = this.convertObjectToMap(params);
+		paramMap.put("adminIp", ipAddr);
+		paramMap.put("adminPort", port);
+		log.info("{}", paramMap);
+
+		try {
+			JSONObject jsonObj = SearchService.getGoodsList(paramMap);
+			log.info("jsonObj.toJSONString(): {}", jsonObj.toJSONString());
+
+			Gson gson = new Gson();
+			result = gson.fromJson(jsonObj.toJSONString(), SearchEngine.class);
+		} catch (Exception e) {
+			e.printStackTrace();
+		}
+
+		return result;
+	}
+
+	/**
+	 * Object를 Map으로 변환
+	 * @param obj - Object
+	 * @return
+	 */
+	@SuppressWarnings("unchecked")
+	private Map<String, Object> convertObjectToMap(Object obj) {
+		ObjectMapper objectMapper = new ObjectMapper();
+		return objectMapper.convertValue(obj, Map.class);
+	}
+
+}

src/main/java/com/style24/front/biz/web/TsfDisplayController.java

@@ -571,9 +571,9 @@ public class TsfDisplayController extends TsfBaseController {
 	@GetMapping("/popup/list")
 	@ResponseBody
 	public GagaMap getPopupList(@RequestParam HashMap<String, String> paramMap) {
-		
+
 		GagaMap result = new GagaMap();
-		 
+
 		Popup popup = new Popup();
 		popup.setFrontGb(TsfSession.getFrontGb());
 		popup.setViewPage(paramMap.get("viewPage"));
@@ -584,9 +584,9 @@ public class TsfDisplayController extends TsfBaseController {
 		popup.setPlanSq((StringUtils.isBlank(paramMap.get("planSq").toString()) ? 0 : Integer.parseInt(paramMap.get("planSq"))));
 		popup.setPreview(paramMap.get("preview"));
 		popup.setViewDt(paramMap.get("viewDt"));
-		
+
 		//result.set("dataList", displayService.getPopupList(popup));
-	
+
 		return displayService.getPopupList(popup);
 	}
 
@@ -1007,9 +1007,8 @@ public class TsfDisplayController extends TsfBaseController {
 		}
 		mav.addObject("recentlyKeywordList", recentlyKeywordList);
 
-		// 인기검색어: TODO 아래 주석된 것으로 적용해야 함
-//		mav.addObject("trendKeywordList", diquest.getTrendKeywordList());
-		mav.addObject("trendKeywordList", null);
+		// 인기검색어
+		mav.addObject("trendKeywordList", diquest.getTrendKeywordList());
 
 		mav.setViewName(super.getDeviceViewName("display/SearchLayer"));
 		return mav;

src/main/webapp/WEB-INF/views/web/common/fragments/GnbWeb.html

@@ -114,7 +114,7 @@
 				</div>
 				<!-- //프로모션 문구 노출 검색용-->
 				<!-- 통합검색 -->
-				<button type="button" class="btn_open_search"><i class="ico ico_search"><em>통합검색</em></i></button>
+				<button type="button" class="btn_open_search" onclick="cfnSearchLayer();"><i class="ico ico_search"><em>통합검색</em></i></button>
 				<a href="#" class="btn_ico btn_cart" title="장바구니 바로가기"><i class="ico ico_bag"></i><span class="circle_count">99+</span></a>
 				<!-- //통합검색 -->
 			</div>
@@ -124,432 +124,7 @@
 	</div>
 	
 	<!-- 검색 레이어 -->
-	<div class="common_search">
-		<h2 class="sr-only">통합검색</h2>
-		<div class="cont_search">
-			<div class="area_input">
-				<form id="searchMainForm" name="searchMainForm">
-					<fieldset>  
-						<legend>통합검색</legend>
-						<input type="text" id="search" name="search" value="" placeholder="검색어를 입력하세요." class="search_input" title="검색어 입력" maxlength="100"/>
-						<button type="button" class="sch_btn"><i class="ico ico_search"><em>검색</em></i></button>
-					</fieldset>
-				</form>
-			</div>
-			<div class="area_result">
-				<!-- 검색결과 입력 전 -->
-				<div class="default_box">
-					<div class="recent_blk">
-						<h3>최근 검색어</h3>
-						<!-- 최근검색어 있을 시 노출 -->
-						<div class="list_recent_keword">
-							<ul>
-								<li>
-									<a href="">슬랙스</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">다운점퍼</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">특가세일</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">모이몰른 티셔츠</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">TBJ 패딩</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">트레이닝 팬츠</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">슬랙스</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">다운점퍼</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">특가세일</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-								<li>
-									<a href="">모이몰른 티셔츠</a>
-									<button type="button" class="btn_delete"><span>삭제</span></button>
-								</li>
-							</ul>
-						</div>
-						<button type="button" class="btn_underline"><span>전체삭제</span></button>
-						<!-- //최근검색어 있을 시 노출 -->
-						<!-- 최근검색어 없을 시 노출 -->
-						<div class="empty_txt">
-							최근 검색어가 없습니다.
-						</div>
-						<!-- //최근검색어 없을 시 노출 -->
-					</div>
-					<div class="popular_blk">
-						<h3>STYLE24에서 검색되고 있어요</h3>
-						<div class="list_popular_keword">
-							<ul>
-								<li>
-									<a href="">BUCKAROO</a>
-								</li>
-								<li>
-									<a href="">기모청바지</a>
-								</li>
-								<li>
-									<a href="">컨버스 주니어</a>
-								</li>
-								<li>
-									<a href="">겨울 팬츠</a>
-								</li>
-								<li>
-									<a href="">모이몰른</a>
-								</li>
-								<li>
-									<a href="">BUCKAROO</a>
-								</li>
-								<li>
-									<a href="">기모청바지</a>
-								</li>
-								<li>
-									<a href="">컨버스 주니어</a>
-								</li>
-								<li>
-									<a href="">겨울 팬츠</a>
-								</li>
-								<li>
-									<a href="">모이몰른</a>
-								</li>
-							</ul>
-						</div>
-					</div>
-					<div class="realtime_blk">
-						<h3>지금 고객님들이 많이 보고 있어요</h3>
-						<div class="modify_timer">
-							<button type="button"><span><em class="time">17:30</em> 기준</span></button>
-						</div>
-						<div class="realtime_wrap">
-							<div class="itemsGrp">
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
-											</div>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
-											<div class="viewCount"><span>508</span>명 보는중</div>
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
-											</div>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
-											<div class="viewCount"><span>508</span>명 보는중</div>
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg">
-											</div>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
-											<div class="viewCount"><span>508</span>명 보는중</div>
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg">
-											</div>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
-											<div class="viewCount"><span>508</span>명 보는중</div>
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
-											</div>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
-											<div class="viewCount"><span>508</span>명 보는중</div>
-										</a>
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-				<!-- //검색결과 입력 전 -->
-				<!-- 검색결과 입력 후 -->
-				<div class="searching_box" style="display:none;">
-					<div class="autokeyword_blk">
-						<ul> 
-							<li><a href=""><em>가</em>을컬리수</a></li>
-							<li><a href=""><em>가</em>드상하</a></li>
-							<li><a href=""><em>가</em>죽자켓</a></li>
-							<li><a href=""><em>가</em>죽밸트</a></li>
-							<li><a href=""><em>가</em>운</a></li>
-							<li><a href=""><em>가</em>을</a></li>
-							<li><a href=""><em>가</em>디건</a></li>
-							<li><a href=""><em>가</em>디건형니트</a></li>
-							<li><a href=""><em>가</em>드밴드레깅스</a></li>
-							<li><a href=""><em>가</em>을잠옷</a></li>
-						</ul>
-					</div>
-					<div class="exfind_blk">
-						<!-- 검색어 매칭 브랜드 있을 시 노출  -->
-						<div class="find_brand">
-							<h3><a href="">나이키 주니어 샵 바로가기</a></h3>
-						</div>
-						<!-- //검색어 매칭 브랜드 있을 시 노출  -->
-						<!-- 검색어 매칭 카테고리 있을 시 노출  -->
-						<div class="find_category">
-							<ul>
-								<li>
-									<span class="category_txt">카테고리</span>
-									<a href="">
-										<span>여성</span>
-										<span>니트<em>가</em>디건/베스트</span>
-									</a>
-								</li>
-								<li>
-									<span class="category_txt">카테고리</span>
-									<a href="">
-										<span>남성</span>
-										<span>니트/<em>가</em>디건/베스트</span>
-										<span>가디건</span>
-										<span>롱가디건</span>
-									</a>
-								</li>
-							</ul>
-						</div>
-						<!-- //검색어 매칭 카테고리 있을 시 노출  -->
-					</div>
-					<div class="pd_list relate">
-						<h3>관련상품</h3>
-						<div class="realtime_wrap">
-							<div class="itemsGrp">
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-											<p class="itemPrice cols">
-												<span class="itemPrice_original">89,000</span>
-												80,100
-												<span class="itemPercent">10%</span>
-											</p>
-											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-											<p class="itemPrice cols">
-												<span class="itemPrice_original">89,000</span>
-												80,100
-												<span class="itemPercent">10%</span>
-											</p>
-											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-											<p class="itemPrice cols">
-												<span class="itemPrice_original">89,000</span>
-												80,100
-												<span class="itemPercent">10%</span>
-											</p>
-											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-											<p class="itemPrice cols">
-												<span class="itemPrice_original">89,000</span>
-												80,100
-												<span class="itemPercent">10%</span>
-											</p>
-											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										</a>
-									</div>
-								</div>
-								<div class="item_prod">
-									<div class="item_state">
-										<a href="#none" class="itemLink">
-											<div class="itemPic">
-												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-											</div>
-											<p class="itemBrand">BRAND NAME1</p>
-											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-											<p class="itemPrice cols">
-												<span class="itemPrice_original">89,000</span>
-												80,100
-												<span class="itemPercent">10%</span>
-											</p>
-											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										</a>
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-				<!-- //검색결과 입력 후 -->
-				<!-- 검색결과 없을때 노출 -->
-				<div class="empty_box" style="display:none;">
-					<div class="nodata">
-						<p>
-							<span class="keyword">'티비제이 제기장 스웨터'</span>에 맞는 상품을 찾지 못했습니다.<br>
-							검색어를 변경해 보세요.
-						</p>
-					</div>
-					<div class="pd_list recommend">
-						<h3>이런 상품은 어떤가요?</h3>
-						<div class="itemsGrp">
-							<div class="item_prod">
-								<div class="item_state">
-									<a href="#none" class="itemLink">
-										<div class="itemPic">
-											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-										</div>
-										<p class="itemBrand">BRAND NAME1</p>
-										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										<p class="itemPrice cols">
-											<span class="itemPrice_original">89,000</span>
-											80,100
-											<span class="itemPercent">10%</span>
-										</p>
-										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-									</a>
-								</div>
-							</div>
-							<div class="item_prod">
-								<div class="item_state">
-									<a href="#none" class="itemLink">
-										<div class="itemPic">
-											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-										</div>
-										<p class="itemBrand">BRAND NAME1</p>
-										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										<p class="itemPrice cols">
-											<span class="itemPrice_original">89,000</span>
-											80,100
-											<span class="itemPercent">10%</span>
-										</p>
-										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-									</a>
-								</div>
-							</div>
-							<div class="item_prod">
-								<div class="item_state">
-									<a href="#none" class="itemLink">
-										<div class="itemPic">
-											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-										</div>
-										<p class="itemBrand">BRAND NAME1</p>
-										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										<p class="itemPrice cols">
-											<span class="itemPrice_original">89,000</span>
-											80,100
-											<span class="itemPercent">10%</span>
-										</p>
-										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-									</a>
-								</div>
-							</div>
-							<div class="item_prod">
-								<div class="item_state">
-									<a href="#none" class="itemLink">
-										<div class="itemPic">
-											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-										</div>
-										<p class="itemBrand">BRAND NAME1</p>
-										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										<p class="itemPrice cols">
-											<span class="itemPrice_original">89,000</span>
-											80,100
-											<span class="itemPercent">10%</span>
-										</p>
-										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-									</a>
-								</div>
-							</div>	
-							<div class="item_prod">
-								<div class="item_state">
-									<a href="#none" class="itemLink">
-										<div class="itemPic">
-											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
-										</div>
-										<p class="itemBrand">BRAND NAME1</p>
-										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
-										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-										<p class="itemPrice cols">
-											<span class="itemPrice_original">89,000</span>
-											80,100
-											<span class="itemPercent">10%</span>
-										</p>
-										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
-									</a>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-				<!-- //검색결과 없을때 노출 -->
-			</div>
-		</div>
-		<button type="button" class="btn_close_search"><span>닫기</span></button>
+	<div class="common_search" id="layer_search">
 	</div>
 	<!-- //검색 레이어 -->
 

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

@@ -20,7 +20,7 @@
 		<form id="searchMainForm" name="searchMainForm">
 			<fieldset>
 				<legend>통합검색</legend>
-				<input type="text" id="search" name="search" value="" placeholder="검색어를 입력하세요sss." class="search_input" title="검색어 입력" maxlength="100">
+				<input type="text" id="search" name="search" value="" placeholder="검색어를 입력하세요." class="search_input" title="검색어 입력" maxlength="100">
 				<button type="button" class="sch_btn"><i class="ico ico_search"><em>검색</em></i></button>
 			</fieldset>
 		</form>
@@ -31,18 +31,18 @@
 			<div class="recent_blk">
 				<h3>최근 검색어</h3>
 				<!-- 최근검색어 있을 시 노출 -->
-				<div class="list_recent_keword" style="display: none;">
+				<div class="list_recent_keword" th:if="${not #lists.isEmpty(recentlyKeywordList)}">
 					<ul>
-						<li>
-							<a href="">슬랙스</a>
-							<button type="button" class="btn_delete"><span>삭제</span></button>
+						<li th:if="${recentlyKeywordList}" th:each="oneData, status : ${recentlyKeywordList}">
+							<a href="javascript:void(0);" th:text="${oneData}" onclick="fnSearchKeyword([[@{oneData}]]);">슬랙스</a>
+							<button type="button" class="btn_delete" onclick="gagajf.setCookie('st24ck_today_keyword', \'[[${oneData}]]\', -1);"><span>삭제</span></button>
 						</li>
 					</ul>
 				</div>
-				<button type="button" class="btn_underline"  style="display: none;"><span>전체삭제</span></button>
+				<button type="button" class="btn_underline" th:if="${not #lists.isEmpty(recentlyKeywordList)}"><span>전체삭제</span></button>
 				<!-- //최근검색어 있을 시 노출 -->
 				<!-- 최근검색어 없을 시 노출 -->
-				<div class="empty_txt" style="display: block;">
+				<div class="empty_txt" th:if="${#lists.isEmpty(recentlyKeywordList)}">
 					최근 검색어가 없습니다.
 				</div>
 				<!-- //최근검색어 없을 시 노출 -->
@@ -51,12 +51,6 @@
 				<h3>STYLE24에서 검색되고 있어요</h3>
 				<div class="list_popular_keword">
 					<ul id="popularKeyArea">
-<!--						<li>-->
-<!--							<a href="">BUCKAROO</a>-->
-<!--						</li>-->
-<!--						<li>-->
-<!--							<a href="">기모청바지</a>-->
-<!--						</li>-->
 					</ul>
 				</div>
 			</div>
@@ -381,23 +375,25 @@
 	</div>
 </div>
 <button type="button" class="btn_close_search" onclick="fnClose();"><span>닫기</span></button>
+
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
 <script th:inline="javascript">
 	/*<![CDATA[*/
 	var trendKeywordList = [[${trendKeywordList.trendList}]];
 
-	var fnClose = function (){
+	var fnClose = function() {
 		$("#layer_search").removeClass('active');
 	}
 
 	$(document).ready( function() {
 		$("#layer_search").addClass('active');
 
-		if(trendKeywordList.length > 0){
+		if (trendKeywordList.length > 0) {
 			$("#popularKeyArea").html('');
-			trendKeywordList.forEach(function (item, index){
+			
+			trendKeywordList.forEach(function (item, idx) {
 				var tag = '';
-				if(index<10){
+				if (idx < 10) {
 					tag += '<li>';
 					tag += '	<a href="">'+ item.keyword +'</a>';
 					tag += '</li>';
@@ -405,7 +401,6 @@
 				$("#popularKeyArea").append(tag);
 			});
 		}
-
 	});
 	/*]]>*/
 </script>