왼쪽처럼 비슷하게 구매내역 페이지를 구성해보았다.
cart.js
ajax에서 통신에 성공하게 되면 buys/buysPage 컨트롤러로 이동하게 된다.
먼저, 구매한 상품에 대해 전체 조회하는 데이터를 DB에서 만들어보자.
buy-mapper.xml
BUT_CNT과 DETAIL_BUY_PRICE를 위해 collection으로 buyDetailList를 끌어와 줄 수 있다.
쿼리문에 있는 아래 4개 데이터는 어떻게 가져올 수 있을까
ATTACHED_FILE_NAME
, ITEM_NAME
, ITEM_PRICE
(SELECT COUNT(BUY_DETAIL_CODE)
FROM BUY_DETAIL
WHERE BUY_CODE = BUY.BUY_CODE) AS ETC
buyDetailVO에는 상품 하나를 샀을때 조회 될 수 있다.
buyDetailVO
상세구매 조회는 구매한 상품아이템을 가지고 있다. 라고해서 넣어주었다.
buy-mapper.xml
따라서 이런식으로 association으로 itemVO를 가져오면,
위에서 못가져왔던 쿼리 4개를 모두 가져갈 수 있게된다.
itemName을 찾으러 가면, buyDetailList안에 없다. 하지만 itemVO가 있어서 itemVO안에 itemName이 있는지 본다.
itemVO 안에는 itemName이 있다.
( ITEM_NAME 을 찾으러 가면 buyVO : buyDetailList -> itemVO (itemName) ) 이렇게 복잡하게 찾아들어간다.
ATTATCHED_FILE_NAME은 buyVO : buyDetailList -> itemVO -> imgList -> imgVO (attatchedFileName) 이렇게 들어감.
BuyVO와 buy-mapper.xml
그 외 몇건을 나타내는 ETC는 연결데이터가 없다. 그래서 resultMap에 그냥 하나 추가해줬다.
마찬가지로 BuyVO에 etc 변수도 함께 추가해준다.
service
BuyController 컨트롤러
MemberVO에 있는 loginInfo 데이터를 만들어준 쿼리문에 넣어서 해당 사용자의 구매목록을 모두 뽑아보았다.
이런식으로
BuyVO(buyCode=BUY_013, memId=null, buyPrice=888000, buyDate=2023-04-11 12:12, buyDetailList=[BuyDetailVO(buyDetailCode=null, itemCode=null, buyCnt=1, DetailBuyPrice=888000, buyCode=BUY_013, itemVO=ItemVO(itemCode=null, cateCode=null, itemName=영상편집, itemPrice=888000, itemStock=0, itemIntro=null, itemStatus=0, itemStatusStr=null, imgList=[ImgVO(imgCode=null, originFileName=null, attachedFileName=06c8d9f3-8ebf-484e-aab2-785a4e5de5d0.jpg, isMain=null, itemCode=null)], categoryVO=null, searchItemVO=null))], etc=1)
뿌려야할 필요한 데이터가 이렇게 쫙 떠있다.
이제 데이터를 뿌려보자.
여러개를 열고 닫을 수 있는 Alwas open을 사용해서 구매페이지를 만들어보았다.
컨트롤러에서 return "/content/cart/cart_buy"; 에 의해 해당 페이지가 있는 html로 오게 된다.
BuyController 컨트롤러
컨트롤러에서 model 객체를 사용해 buyList 데이터들을 buyList로 html에 뿌려주자.
cart_buy.html
[[${#numbers.formatInteger(1,2)}]] 은 타임리프에서 숫자를 지정하는 형식이다.
( ) 안의 1은 나타날 숫자, 2는 00 과 같이 자릿 수이다.
구매금액을 들어가기 위해선 buyDetailList를에 접근해야하는데,
자료형이 List이므로, buyDetailList에는 [ 0 ] 배열을 붙여 접근하자.
이런식으로 원하는 대로 데이터들이 잘 정렬되어있다.
cart_buy.html
그리고 각 선택구매 정보에 대해서는 buyList로 buy를 써서 한번 반복해주었는데,
buy.buyDetailList로 반복을 돌려줘야한다.
펼치면 이런식으로 구매 상품한 buy 안에 buyDetailList로 상세 구매목록까지 확인할 수 있다.
이렇게 완성된 구매 내역 페이지를 볼 수 있다.
다음 포스팅에서는 전체 펼치기와 전체 접기를 구현해보자.
'✨ Back-end > Spring-Boot' 카테고리의 다른 글
| [Spring] 쇼핑몰 - 41 검색기능 추가하기 (0) | 2023.04.12 |
|---|---|
| [Spring] 쇼핑몰 - 40 Bootstrap에서 가져온 태그 활용하기 (0) | 2023.04.12 |
| [Spring] 쇼핑몰 - 38 장바구니 선택 구매 (0) | 2023.04.07 |
| [Spring] 쇼핑몰 - 37 장바구니 선택 삭제 (0) | 2023.04.06 |
| [Spring] 쇼핑몰 - 36 장바구니 체크박스 해제시 변경 데이터 (0) | 2023.04.06 |
댓글