mindol1004/Blog_Project
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Spring][쇼핑몰 프로젝트][46] 댓글 등록 - 2

Browse Source 
https://kimvampa.tistory.com/289
This commit is contained in:
SeoJin Kim
2022-01-05 04:27:51 +09:00
parent 9f3f678682
commit f0325a019e
18 changed files with 821 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
VamPa/src/main/java/com/vam/controller/BookController.java
View File

@@ -129,6 +129,16 @@ public class BookController {
return "/goodsDetail";
}
/* 리뷰 쓰기 */
@GetMapping("/replyEnroll/{memberId}")
public String replyEnrollWindowGET(@PathVariable("memberId")String memberId, int bookId, Model model) {
BookVO book = bookService.getBookIdName(bookId);
model.addAttribute("bookInfo", book);
model.addAttribute("memberId", memberId);
return "/replyEnroll";
}
}

3
VamPa/src/main/java/com/vam/mapper/BookMapper.java
View File

@@ -33,4 +33,7 @@ public interface BookMapper {
/* 상품 정보 */
public BookVO getGoodsInfo(int bookId);
/* 상품 id 이름 */
public BookVO getBookIdName(int bookId);
}

5
VamPa/src/main/java/com/vam/service/BookService.java
View File

@@ -25,6 +25,9 @@ public interface BookService {
public List<CateFilterDTO> getCateInfoList(Criteria cri);
/* 상품 정보 */
public BookVO getGoodsInfo(int bookId);
public BookVO getGoodsInfo(int bookId);
/* 상품 id 이름 */
public BookVO getBookIdName(int bookId);
}

7
VamPa/src/main/java/com/vam/service/BookServiceImpl.java
View File

@@ -142,4 +142,11 @@ public class BookServiceImpl implements BookService{
return goodsInfo;
}
@Override
public BookVO getBookIdName(int bookId) {
return bookMapper.getBookIdName(bookId);
}
}

8
VamPa/src/main/resources/com/vam/mapper/BookMapper.xml
View File

@@ -166,6 +166,14 @@
</select>
<select id="getBookIdName" resultType="com.vam.model.BookVO">
select bookId, bookName from vam_book
where bookId = #{bookId}
</select>
</mapper>

29
VamPa/src/main/webapp/WEB-INF/views/goodsDetail.jsp
View File

@@ -160,7 +160,16 @@
<div class="line">
</div>
<div class="content_bottom">
리뷰
<div class="reply_subject">
<h2>리뷰</h2>
</div>
<c:if test="${member != null}">
<div class="reply_button_wrap">
<button>리뷰 쓰기</button>
</div>
</c:if>
</div>
<!-- 주문 form -->
<form action="/order/${member.memberId}" method="get" class="order_form">
@@ -296,6 +305,24 @@ const form = {
$(".order_form").submit();
});
/* 리뷰쓰기 */
$(".reply_button_wrap").on("click", function(e){
e.preventDefault();
const memberId = '${member.memberId}';
const bookId = '${goodsInfo.bookId}';
let popUrl = "/replyEnroll/" + memberId + "?bookId=" + bookId;
console.log(popUrl);
let popOption = "width = 490px, height=490px, top=300px, left=300px, scrollbars=yes";
window.open(popUrl,"리뷰 쓰기",popOption);
});
</script>
</body>

13
VamPa/src/main/webapp/WEB-INF/views/replyEnroll.jsp Normal file
View File

@@ -0,0 +1,13 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>${bookInfo}</h1>
<h1>${memberId}</h1>
</body>
</html>

127
VamPa/src/main/webapp/resources/css/goodsDetail.css
View File

@@ -257,12 +257,129 @@ a{
margin-bottom: 40px;
}
/* 리뷰쓰기 버튼 */
.reply_button_wrap{
padding : 10px;
}
.reply_button_wrap button{
background-color: #365fdd;
color: white;
font-weight: bold;
font-size: 15px;
padding: 5px 12px;
cursor: pointer;
}
.reply_button_wrap button:hover{
background-color: #1347e7;
}
/* 리뷰 영역 */
.content_bottom{
width: 100%;
min-height: 400px;
background-color: #e7dbdb;
}
width: 80%;
margin : auto;
}
.reply_content_ul{
list-style: none;
}
.comment_wrap{
position: relative;
border-bottom: 1px dotted #d4d4d4;
padding: 14px 0 10px 0;
font-size: 12px;
}
/* 리뷰 머리 부분 */
.reply_top{
padding-bottom: 10px;
}
.id_span{
padding: 0 15px 0 3px;
font-weight: bold;
}
.date_span{
padding: 0 15px 0;
}
/* 리뷰 컨텐트 부분 */
.reply_bottom{
padding-bottom: 10px;
}
/* 리뷰 선 */
.reply_line{
width : 80%;
margin : auto;
border-top:1px solid #c6c6cf;
}
/* 리뷰 제목 */
.reply_subject h2{
padding: 15px 0 5px 5px;
}
/* pageMaker */
.repy_pageInfo_div{
text-align: center;
margin-top: 30px;
margin-bottom: 40px;
}
.pageMaker{
list-style: none;
display: inline-block;
}
.pageMaker_btn{
float: left;
width: 25px;
height: 25px;
line-height: 25px;
margin-left: 20px;
font-size: 10px;
cursor: pointer;
}
.active{
border : 2px solid black;
font-weight:400;
}
.next, .prev {
border: 1px solid #ccc;
padding: 0 10px;
}
/* 리뷰 없는 경우 div */
.reply_not_div{
text-align: center;
}
.reply_not_div span{
display: block;
margin-top: 30px;
margin-bottom: 20px;
}
/* 리뷰 수정 삭제 버튼 */
.update_reply_btn{
font-weight: bold;
background-color: #b7b399;
display: inline-block;
width: 40px;
text-align: center;
height: 20px;
line-height: 20px;
margin: 0 5px 0 30px;
border-radius: 6px;
color: white;
cursor: pointer;
}
.delete_reply_btn{
font-weight: bold;
background-color: #e7578f;
display: inline-block;
width: 40px;
text-align: center;
height: 20px;
line-height: 20px;
border-radius: 6px;
color: white;
cursor: pointer;
}

8
VamPa/target/classes/com/vam/mapper/BookMapper.xml
View File

@@ -166,6 +166,14 @@
</select>
<select id="getBookIdName" resultType="com.vam.model.BookVO">
select bookId, bookName from vam_book
where bookId = #{bookId}
</select>
</mapper>

10
VamPa_MySQL/src/main/java/com/vam/controller/BookController.java
View File

@@ -127,6 +127,16 @@ public class BookController {
model.addAttribute("goodsInfo", bookService.getGoodsInfo(bookId));
return "/goodsDetail";
}
/* 리뷰 쓰기 */
@GetMapping("/replyEnroll/{memberId}")
public String replyEnrollWindowGET(@PathVariable("memberId")String memberId, int bookId, Model model) {
BookVO book = bookService.getBookIdName(bookId);
model.addAttribute("bookInfo", book);
model.addAttribute("memberId", memberId);
return "/replyEnroll";
}

3
VamPa_MySQL/src/main/java/com/vam/mapper/BookMapper.java
View File

@@ -33,4 +33,7 @@ public interface BookMapper {
/* 상품 정보 */
public BookVO getGoodsInfo(int bookId);
/* 상품 id 이름 */
public BookVO getBookIdName(int bookId);
}

3
VamPa_MySQL/src/main/java/com/vam/service/BookService.java
View File

@@ -26,5 +26,8 @@ public interface BookService {
/* 상품 정보 */
public BookVO getGoodsInfo(int bookId);
/* 상품 id 이름 */
public BookVO getBookIdName(int bookId);
}

6
VamPa_MySQL/src/main/java/com/vam/service/BookServiceImpl.java
View File

@@ -141,4 +141,10 @@ public class BookServiceImpl implements BookService{
return goodsInfo;
}
@Override
public BookVO getBookIdName(int bookId) {
return bookMapper.getBookIdName(bookId);
}
}

9
VamPa_MySQL/src/main/resources/com/vam/mapper/BookMapper.xml
View File

@@ -151,6 +151,13 @@
where bookid = ${bookId}
</select>
<select id="getBookIdName" resultType="com.vam.model.BookVO">
select bookId, bookName from vam_book
where bookId = #{bookId}
</select>
</mapper>

29
VamPa_MySQL/src/main/webapp/WEB-INF/views/goodsDetail.jsp
View File

@@ -160,7 +160,16 @@
<div class="line">
</div>
<div class="content_bottom">
리뷰
<div class="reply_subject">
<h2>리뷰</h2>
</div>
<c:if test="${member != null}">
<div class="reply_button_wrap">
<button>리뷰 쓰기</button>
</div>
</c:if>
</div>
<!-- 주문 form -->
<form action="/order/${member.memberId}" method="get" class="order_form">
@@ -296,6 +305,24 @@ const form = {
$(".order_form").submit();
});
/* 리뷰쓰기 */
$(".reply_button_wrap").on("click", function(e){
e.preventDefault();
const memberId = '${member.memberId}';
const bookId = '${goodsInfo.bookId}';
let popUrl = "/replyEnroll/" + memberId + "?bookId=" + bookId;
console.log(popUrl);
let popOption = "width = 490px, height=490px, top=300px, left=300px, scrollbars=yes";
window.open(popUrl,"리뷰 쓰기",popOption);
});
</script>
</body>

12
VamPa_MySQL/src/main/webapp/WEB-INF/views/replyEnroll.jsp Normal file
View File

@@ -0,0 +1,12 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
</body>
</html>

540
VamPa_MySQL/src/main/webapp/resources/goodsDetail.css Normal file
View File

@@ -0,0 +1,540 @@
@charset "UTF-8";
*{
margin: 0;
padding:0;
}
a{
text-decoration: none;
}
/* 화면 전체 렙 */
.wrapper{
width: 100%;
}
/* content 랩 */
.wrap{
width : 1080px;
margin: auto;
}
/* 홈페이지 기능 네비 */
.top_gnb_area{
width: 100%;
height: 50px;
background-color: #f0f0f1;
position:relative;
}
.top_gnb_area .list{
position: absolute;
top: 0px;
right: 0;
}
.top_gnb_area .list li{
list-style: none;
float : left;
padding: 13px 15px 0 10px;
font-weight: 900;
cursor: pointer;
}
/* 로고, 검색, 로그인 */
.top_area{
width: 100%;
height: 150px;
/* background-color: #f7f0b9; */
}
/* 로고 영역 */
.logo_area{
width: 25%;
height: 100%;
float:left;
}
.logo_area img{
width: 100%;
height: 100%;
}
/* 검색 박스 영역 */
.search_area{
width: 50%;
height: 100%;
float:left;
}
.search_wrap{
width: 100%;
height: 100%;
}
#searchForm{
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.search_input{
display: flex;
height: 30%;
width: 80%;
}
.search_input select{
width: 20%;
text-align: center;
font-size: 15px;
}
.search_input input{
margin-left: 10px;
width: 57%;
font-size: 18px;
padding-left: 2%;
}
.search_btn{
margin-left: 10px;
width: 17%;
border-radius: 14px;
font-size: 17px;
font-weight: 600;
}
/* 로그인 버튼 영역 */
.login_area{
width: 25%;
height: 100%;
display: inline-block;
text-align: center;
}
.login_button{
height: 50%;
background-color: #D4DFE6;
margin-top: 30px;
line-height: 77px;
font-size: 40px;
font-weight: 900;
border-radius: 10px;
cursor: pointer;
}
.login_area>span{
margin-top: 10px;
font-weight: 900;
display: inline-block;
}
.login_button{
height : 50%;
background-color: #D4DFE6;
margin-top:30px;
}
/* 제품 목록 네비 */
.navi_bar_area{
width: 100%;
height: 70px;
background-color: #7696fd;
}
/* 홈페이지 메인 제품 목록 */
.content_area{
width: 100%;
min-height: 1000px;
}
.content_top{
width: 100%;
height: 400px;
}
.content_top:after {
content: "";
clear: both;
display: table;
}
.ct_left_area{
float: left;
width: 30%;
height: 100%;
}
.image_wrap{
height: 80%;
width: 80%;
margin: auto;
top: 10%;
position: relative;
}
.image_wrap img{
max-width: 100%;
height: auto;
display: block;
}
.line{
width: 100%;
border-top:1px solid #c6c6cf;
}
.ct_right_area{
float: left;
width: 70%;
height: 100%;
}
.title{
height: 28%;
font-size: 17px;
line-height: 110px;
color: #3a60df;
padding-left: 3%;
}
.author{
font-size: 16px;
line-height: 50px;
padding-left: 3%;
}
.price{
line-height: 30px;
padding: 2% 0 2% 3%;
}
.discount_price_number{
line-height: 30px;
font-size: 22px;
color: #f84450;
font-weight: bold;
}
.button{
padding: 2% 0 2% 3%;
}
.button_quantity{
margin-bottom: 2%;
}
.button_quantity input{
height: 26px;
width: 40px;
text-align: center;
font-weight: bold;
}
.button_quantity button{
border: 1px solid #aaa;
color: #3a60df;
width: 20px;
height: 20px;
padding: 3px;
background-color: #fff;
font-weight: bold;
font-size: 15px;
line-height: 15px;
}
.btn_cart{
display: inline-block;
width: 140px;
text-align: center;
height: 50px;
line-height: 50px;
background-color: #5e6b9f;
border: 1px solid #5e6b9f;
color: #fff;
margin-right: 2px;
}
.btn_buy{
display: inline-block;
width: 140px;
text-align: center;
height: 50px;
line-height: 50px;
background-color: #7b8ed1;
border: 1px solid #7b8ed1;
color: #fff;
}
.content_middle{
width: 100%;
min-height: 600px;
}
.book_intro{
width: 80%;
margin: auto;
margin-top: 40px;
}
.book_content{
width: 80%;
margin: auto;
margin-top: 40px;
margin-bottom: 40px;
}
/* 리뷰쓰기 버튼 */
.reply_button_wrap{
padding : 10px;
}
.reply_button_wrap button{
background-color: #365fdd;
color: white;
font-weight: bold;
font-size: 15px;
padding: 5px 12px;
cursor: pointer;
}
.reply_button_wrap button:hover{
background-color: #1347e7;
}
/* 리뷰 영역 */
.content_bottom{
width: 80%;
margin : auto;
}
.reply_content_ul{
list-style: none;
}
.comment_wrap{
position: relative;
border-bottom: 1px dotted #d4d4d4;
padding: 14px 0 10px 0;
font-size: 12px;
}
/* 리뷰 머리 부분 */
.reply_top{
padding-bottom: 10px;
}
.id_span{
padding: 0 15px 0 3px;
font-weight: bold;
}
.date_span{
padding: 0 15px 0;
}
/* 리뷰 컨텐트 부분 */
.reply_bottom{
padding-bottom: 10px;
}
/* 리뷰 선 */
.reply_line{
width : 80%;
margin : auto;
border-top:1px solid #c6c6cf;
}
/* 리뷰 제목 */
.reply_subject h2{
padding: 15px 0 5px 5px;
}
/* pageMaker */
.repy_pageInfo_div{
text-align: center;
margin-top: 30px;
margin-bottom: 40px;
}
.pageMaker{
list-style: none;
display: inline-block;
}
.pageMaker_btn{
float: left;
width: 25px;
height: 25px;
line-height: 25px;
margin-left: 20px;
font-size: 10px;
cursor: pointer;
}
.active{
border : 2px solid black;
font-weight:400;
}
.next, .prev {
border: 1px solid #ccc;
padding: 0 10px;
}
/* 리뷰 없는 경우 div */
.reply_not_div{
text-align: center;
}
.reply_not_div span{
display: block;
margin-top: 30px;
margin-bottom: 20px;
}
/* 리뷰 수정 삭제 버튼 */
.update_reply_btn{
font-weight: bold;
background-color: #b7b399;
display: inline-block;
width: 40px;
text-align: center;
height: 20px;
line-height: 20px;
margin: 0 5px 0 30px;
border-radius: 6px;
color: white;
cursor: pointer;
}
.delete_reply_btn{
font-weight: bold;
background-color: #e7578f;
display: inline-block;
width: 40px;
text-align: center;
height: 20px;
line-height: 20px;
border-radius: 6px;
color: white;
cursor: pointer;
}
/* 로그인 성공 영역 */
.login_success_area{
height: 62%;
width: 80%;
border: 2px solid #7474ad;
border-radius: 15px;
margin: 5% auto;
padding-top: 5%;
}
.login_success_area>a{
font-size: 15px;
font-weight: 900;
display: inline-block;
margin-top: 5px;
background: #e1e5e8;
width: 82px;
height: 22px;
line-height: 22px;
border-radius: 25px;
color: #606267;
}
.login_success_area>span{
display : block;
text-align: left;
margin-left: 10%;
}
/* 검색결과 없음 */
.table_empty{
height: 50px;
text-align: center;
margin: 200px 0 215px 0px;
font-size: 25px;
}
/* 필터정보 */
.search_filter {
width: 85%;
margin: auto;
margin-top: 30px;
margin-bottom: 50px;
}
.filter_button_wrap {
width: 100%;
}
.filter_button_wrap button {
width: 50%;
}
.filter_button{
background-color: #04AA6D;
border: 1px solid green;
color: white;
padding: 10px 24px;
cursor: pointer;
float: left;
}
.filter_button_wrap:after {
content: "";
clear: both;
display: table;
}
.filter_button_wrap button:not(:last-child) {
border-right: none;
}
.filter_button:hover {
background-color: #3e8e41;
}
.filter_active{
background-color: #045d3c;
}
.filter_content{
padding:20px 50px 20px 50px;
border: 1px solid gray;
}
.filter_content a:not(:first-child){
margin-left: 10px;
}
.filter_a{
display: block;
}
.filter_b{
display: none;
}
/* footer navai 영역 */
.footer_nav{
width:100%;
height:50px;
}
.footer_nav_container{
width: 100%;
height: 100%;
background-color:#8EC0E4;
}
.footer_nav_container>ul{
font-weight : bold;
float:left;
list-style:none;
position:relative;
padding-top:10px;
line-height: 27px;
font-family: dotum;
margin-left: 10px;
}
.footer_nav_container>ul>li{
display:inline;
width: 45px;
height: 19px;
padding: 10px 9px 0 10px;
}
.footer_nav_container>ul>span{
margin: 0 4px;
}
/* footer 영역 */
.footer{
width:100%;
height:130px;
background-color:#D4DFE6;
padding-bottom : 50px;
}
.footer_container{
width: 100%;
height: 100%;
margin: auto;
}
.footer_left>img {
width: 150%;
height: 130px;
margin-left: -20px;
margin-top: -12px;
}
.footer_left{
float :left;
width: 170px;
margin-left: 20px;
margin-top : 30px;
}
.footer_right{
float :left;
width: 680px;
margin-left: 70px;
margin-top : 30px;
}
/* float 속성 해제 */
.clearfix{
clear: both;
}

9
VamPa_MySQL/target/classes/com/vam/mapper/BookMapper.xml
View File

@@ -151,6 +151,13 @@
where bookid = ${bookId}
</select>
<select id="getBookIdName" resultType="com.vam.model.BookVO">
select bookId, bookName from vam_book
where bookId = #{bookId}
</select>
</mapper>