스프링부트+jsp로 배달사이트 만들기-23 찜한 가게 목록

StoreController에 찜한 가게 목록을 불러올 메서드를 추가합니다

// 찜한 가게 목록
@GetMapping("/likes/store")
public String likes(Model model, @AuthenticationPrincipal LoginService user) {
    long userId = 0;
    List<Store> likesList = new ArrayList<>();
    if (user == null) {
        
    } else {
        userId = user.getUser().getId();
        likesList = storeService.likesList(userId);
    }
    System.out.println("찜한 가게 : " );
    for(int i=0;i<likesList.size();i++) {
        System.out.println(likesList.get(i));
    }
    
    model.addAttribute("likesList", likesList);

    return "/store/likes";
}

 

StoreService

// 찜한 가게들
List<Store> likesList(long userId);

 

StoreServiceImp

@Override
public List<Store> likesList(long userId) {
	return storeDAO.likesList(userId);
}

 

StoreDAO

List<Store> likesList(long userId);

 

StoreDAOImp

@Override
public List<Store> likesList(long userId) {
	return sql.selectList("store.likesList", userId);
}

 

StoreMapper

<select id="likesList" resultType="Store">
    WITH R_COUNT AS (
       SELECT  R.STORE_ID 
               ,ROUND(R.SCORE, 1) SCORE
               ,R.REVIEW_COUNT
               ,R.BOSS_COMMENT_COUNT 
       FROM 
               (SELECT STORE_ID
                       ,AVG(SCORE) SCORE
                       ,COUNT(REVIEW_CONTENT) REVIEW_COUNT
                       ,COUNT(BOSS_COMMENT) BOSS_COMMENT_COUNT 
               FROM    BM_REVIEW GROUP BY STORE_ID ) R  
   ),
   STORE AS (
       SELECT  	S.*
                   ,T.*
                   ,L.USER_ID
                   ,L.LIKES_DATE
                   ,CASE WHEN MOD(24 - S.OPENING_TIME + S.CLOSING_TIME, 24) != 0 THEN MOD(24 - S.OPENING_TIME + S.CLOSING_TIME, 24) ELSE 24 END BS_TIME
       FROM		BM_STORE S
       LEFT JOIN 	R_COUNT T
       ON	 		S.ID = T.STORE_ID
       LEFT JOIN 	BM_LIKES L
       ON 			S.ID = L.STORE_ID 
       WHERE 		USER_ID = #{userId }
   )
   
   SELECT * FROM
       (SELECT 	C.*
                   ,'true' IS_OPEN
       FROM    	STORE C 
       WHERE    	(TO_CHAR(SYSTIMESTAMP, 'HH24') 
       BETWEEN 	OPENING_TIME 
       AND     	OPENING_TIME + BS_TIME)
   UNION ALL
       SELECT  	C.*
                   ,'false' IS_OPEN 
       FROM    	STORE C 
       WHERE 	  	(TO_CHAR(SYSTIMESTAMP, 'HH24') 
       NOT BETWEEN OPENING_TIME 
       AND     	OPENING_TIME + BS_TIME )
       ) 
   ORDER BY LIKES_DATE DESC
   
   </select>

가게목록을 가져오는 쿼리에서 likes테이블만 조인했습니다

 

클릭

 

 

store폴더 아래에 jsp와 css를 추가합니다

likes.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/view/include/link.jsp" %>
<link rel="stylesheet" href="/css/layout/nav.css" >
<link rel="stylesheet" href="/css/store/likes.css" >
<link rel="stylesheet" href="/css/store/store-li.css">
<%@ include file="/WEB-INF/view/include/header.jsp" %>

	<div class="wrap">
    	<c:if test="${!empty likesList }">
	    	<style>body {background: #fff; }</style>
		    <section class="title">
		        <h1>찜</h1>
		    </section>
		</c:if>	    

	    <main>
	    	<div class="box">
	    	<c:if test="${empty likesList }">
		    	<div class="temp"><img alt="이미지" src="/img/jjim.png"> </div>
		    </c:if>
		    
			    <ul class="store">
	               	<c:set var="store_admin" value="/store" />
                	<c:forEach items="${likesList }" var="storeList">
                    	<%@ include file="/WEB-INF/view/store/store-li.jsp" %>
                    </c:forEach>
				</ul>
			</div>
		</main>
	</div>

    <!-- 하단 메뉴 -->
   	<%@ include file="/WEB-INF/view/include/nav.jsp" %>
    <!-- 하단 메뉴 -->
	
	<!-- 푸터 -->
	<%@ include file="/WEB-INF/view/include/footer.jsp" %>
	<!-- 푸터 -->
	
</body>
</html>

 

likes.css

body {
	background: #F6F6F6;
}

.wrap {
	margin: 0px auto;
	min-height: calc(100vh - 210px);
}

section.title {
	box-shadow: 0px 2px 3px 0px rgb(0 0 0/ 25%);
}

section.title h1 {
	text-align: center;
	margin: 30px 0 0 0;
	padding-bottom: 5%;
}

/* main */
main {
	width: 100%;
}

main .temp img {
	margin: 20px auto;
	display: block;
	width: 90%;
	max-width: 500px;
}

@media ( max-width :1024px) {
	.container {
		width: 100%;
	}
}