본문 바로가기
웹 개발/다이어리 프로젝트(개인)

jsp로 crud를 사용한 다이어리 만들기(11)-점심 선택,통계 페이지 추가

osy9907 2024. 4. 1. 11:15
728x90
 

jsp로 crud를 사용한 다이어리 만들기(9)-일기DB 테이블 추가

일기의 내용이 좀 부족한거 같아 추가를 했다 일기에 기분을 추가하기로 했다! radio버튼을 통해 5가지의 기분 중 선택을 할 수 있다. 기존의 addDiaryForm에 input태그와 기분이미지에 해당하는 value값

broad-backend.tistory.com

다이어리에 또 다른 기능을 추가하기로 했다.

그날 먹었던 점심을 고를 수 있는 기능이다!

[DB]diary.lunch 테이블

 

 

좌 : 투표 불가능 날짜 / 우 : 투표 가능 날짜

점심은 하루에 한번 선택 할 수 있으며, 해당 일을 선택해 선택 가능확인 버튼을 눌러 선택가 가능한지 불가능한지 확인하고 선택를 할 수 있다.

해당일에 선택가 돼있으면 선택 할 수 없다는 메시지도 같이 보여주고 선택이 가능하면 가능하다는 메시지를 보여준다.

점심을 선택하면  아래의 두번째 이미지처럼 어떤 음식을 선택했는지 나타나고, 달력모양 다이어리의 해당일에 이모지와 함께 점심을 선택한 것을 알 수 있다.

해당 이모지와 점심 글자를 클릭하면 두번째 이미지가 다시 나타나게 된다.

그리고 두번째 이미지에서 해당 점심 선택한 것을 삭제버튼으로 삭제 할 수도 있게 했다.

 

1. 선택 전 / 2. 선택 후 해당 일의 페이지, 달력모양의 다이어리에 점심이모지 클릭했을 떄 / 3. 점심 선택 후 달력모양 다이어리에 점심 표시

 

그리고 모든 페이지의 좌측 상단에 점심 선택(투표)와 통계 페이지로 갈 수 있는 버튼을 만들었다. 아래 처럼 지금까지 선택한 점심 통계를 알 수 있다.

점심 통계

 

달력모양 다이어리에서 점심 이모지를 클릭했을 경우 그날의 점심 선택 결과를 볼 수 있다.

해당 년, 월, 일을 각각 따로 요청값으로 두고

lunchOne.jsp에서 lunchDate로 조합한다.

그 후 [DB]diary.lunch 테이블에서 lunchDate를 SELECT 쿼리로 찾아 보여준다.

lunchOne.jsp

<%@page import="javax.print.attribute.standard.Media"%>
<%@page import="java.net.URLEncoder"%>
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}
	
	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");

	// lunch_date값 가져오기
	String year = request.getParameter("year");
	String month = request.getParameter("month");
	String day = request.getParameter("day");
	String lunchDate = request.getParameter("lunchDate");
	
	System.out.println("lunchOne - year = " + year);
	System.out.println("lunchOne - month = " + month);
	System.out.println("lunchOne - day = " + day);
	System.out.println("lunchOne - lunchDate = " + lunchDate);
	
	// lunchDate 요청값이 없을 경우 lunchDate 값 조합
	
	
	// lunchOne.jsp에서 바로 실행했을경우 달력모양 다이어리 페이지로 이동
	if((year == null || month == null || day == null) && lunchDate == null) {
		response.sendRedirect("/diary/diaryListOfMonth.jsp");
		return;
	} else if(lunchDate == null){
		lunchDate = year + "-" + month + "-" + day;
	}
	
	// lunchDate 값 체크
	System.out.println("lunchOne - lunchDate = " + lunchDate);
	
	// lunch_date 있는지 확인하는 sql
	/*
		SELECT lunch_date lunchDate, menu FROM lunch
		WHERE lunch_date = ?;
	*/
	
	String checkLunchSql = "SELECT lunch_date lunchDate, menu FROM lunch WHERE lunch_date = ?";
	PreparedStatement checkLunchStmt = null;
	ResultSet checkLunchRs = null;
	
	checkLunchStmt = conn.prepareStatement(checkLunchSql);
	checkLunchStmt.setString(1, lunchDate);
	checkLunchRs = checkLunchStmt.executeQuery();
	
	
%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>title</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Orbit&display=swap" rel="stylesheet">
	<style>	
		body {
			background-image: url('/diary/img/img5.jpg');
			background-size: 100%;
			background-repeat: no-repeat; 
			background-position: center;
			font-family: "Orbit", sans-serif;
			font-weight: 300;
			font-style: normal;
			min-height: 100vh;
		}
		
		.button {
			color: black;
		}
	</style>
</head>
<body>
<%
	if(checkLunchRs.next()) {
%>
		<div class="row" style="min-height: 100vh;">
			<div class="col"></div>
			
			<div class="col-6 mt-5 border border-light-subtle shadow p-2 rounded-2" style="background-color: rgba(248, 249, 250, 0.7); height: 450px; width: 800px;">
	
	
				<div class="row">
					
					<div class="col-4">
						<div style="display: flex;">
							<form action="/diary/diaryListOfMonth.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px; padding: 5 10px; width: 115px;">
									&#128214;다이어리
								</button>
							</form>
							
							<form action="/diary/diaryList.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#128214;일기 목록
								</button>
							</form>
						</div>
						<div style="display: flex;">
							
							<form action="/diary/lunch/statsLunch.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px;">
									&#127835;점심 통계
								</button>
							</form>
							<form action="/diary/lunch/lunchAddForm.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#127835;점심 투표
								</button>
							</form>
						</div>
					</div>
					
					<div class="col-4">
						<h1 style="text-align: center; font-size: 55px;">점심 메뉴</h1>
					</div>
	
					<div class="col-4" style="text-align: right;">
						<form action="/diary/diaryListOfMonth.jsp" method="post">
							<button type="submit" class="btn-close" aria-label="Close" style="margin: 15px;"></button>
						</form>
					</div>
					
				</div>
	
				<hr>
				
				<div>
				
					<div style="text-align: center;">
						<div style="margin-top: 50px;">
							<%=checkLunchRs.getString("lunchDate") %>일 투표한 점심은
						</div>
						
						<div style="font-size: 40px; margin-top: 20px;">
							<%=checkLunchRs.getString("menu") %>
						</div>
						
						<div style="margin-top: 20px;">
							입니다!
						</div>
						 	
					</div>
					
					<div style="text-align: center;">
			
						<form action="/diary/lunch/deleteLunchForm.jsp" method="post">
							<input type="hidden" name ="lunchDate" value="<%=lunchDate%>">
							<input type="hidden" name="menu" value="<%=checkLunchRs.getString("menu")%>">
							<button class="btn btn-outline-secondary" type="submit" style="margin-top: 30px;">삭제하기</button>
						</form>

					</div>
					
				</div>
					
			</div>
			<div class="col"></div>
		</div>
<%
	} 
%>
</body>
</html>

 

 

점심 통계 페이지에서는 한식,중식, 일식 등 음식 종류에 따라 투표한 것들을 종합해서 보여줘야 하기 때문에 GROUP BY 문과 함께 쿼리를 실행했다.

 

그리고 투표된 갯수들만큼 막대 그래프 처럼 표시하기 위해 최대 높이(maxHeight)를 500으로 정해 두고,  비율별로 각각 표시할 수 있게 했다.

statsLunch.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.sql.*" %>
<%@ page import="java.net.*" %>
<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}
	
	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "java1234");
	/*
		SELECT menu,COUNT(*)
		FROM lunch
		GROUP BY menu

	*/
	String getMenuStatSql = "select menu, count(*) cnt from lunch group by menu";
	PreparedStatement getMenuStatStmt = null;
	ResultSet getMenuStatRs = null;
	getMenuStatStmt = conn.prepareStatement(getMenuStatSql);
	getMenuStatRs = getMenuStatStmt.executeQuery();
%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>statsLunch</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Orbit&display=swap" rel="stylesheet">
	<style>
		a:link {
			color: black;
			text-decoration: none;
		}
		
		a:visited {
			color: #003541;
			text-decoration: none;
		}
		
		a:hover {
			color: #3162C7;
			text-decoration: none;
		}
		
		a:active {
			text-decoration: none;
		}
		
		table {
			border-collapse: collapse;
			width: 500px;
			height: 400px;
			margin: 0rem auto;
			box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.1);
			background-color: white;
		}
		
		th, td {
		  padding: 10px;
		  text-align: left;
		  border-bottom: 1px solid #ddd;
		  text-align: center;
		  color: #000000;
		}
		
		th {
		  background-color: rgba(92, 138, 153, 0.5);
		  height: 20px;
		  color: #000000;
		}
				
		body {
			background-image: url('/diary/img/img5.jpg');
			background-size: 100%;
			background-repeat: no-repeat; 
			background-position: center;
			font-family: "Orbit", sans-serif;
			font-weight: 300;
			font-style: normal;
			min-height: 100vh;
		}
	</style>
</head>
<body>
		
	<div class="row" style="min-height: 100vh;">
			<div class="col"></div>
			
			<div class="col-6 mt-5 border border-light-subtle shadow p-2 rounded-2" style="background-color: rgba(248, 249, 250, 0.7); height: 600px; width: 800px;">

				<div class="row">
					
					<div class="col-4">
						<div style="display: flex;">
							<form action="/diary/diaryListOfMonth.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px; padding: 5 10px; width: 115px;">
									&#128214;다이어리
								</button>
							</form>
							
							<form action="/diary/diaryList.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#128214;일기 목록
								</button>
							</form>
						</div>
						<div style="display: flex;">
							
							<form action="/diary/lunch/statsLunch.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px;">
									&#127835;점심 통계
								</button>
							</form>
							<form action="/diary/lunch/lunchAddForm.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#127835;점심 투표
								</button>
							</form>
						</div>
					</div>
					
					<div class="col-4" style="text-align: center;">
						<h1 style=" font-size: 55px;">점심 투표</h1>
					</div>
	
					<div class="col-4" style="text-align: right;">

					</div>
					
				</div>
	
				<hr>
				
				<div>
				
					<div style="text-align: center;">
					
						<%
							double maxHeight = 500;
							double totalCnt = 0; //
							while(getMenuStatRs.next()) {
								totalCnt = totalCnt + getMenuStatRs.getInt("cnt");
							}
						%>
						
						<div>
							전체 투표수 : <%=(int)totalCnt%>
						</div>
						
						<table style="background-color: rgba(255, 255, 255, 0); margin-top: 20px;">
							<tr>
								<th colspan="5">투표결과</th>
							</tr>
														
							<tr>
								<%	
									String[] color = {"#8697B3", "#B9C0D0", "#E3DFC2", "#CFC1C0", "#7A7A7A"};
									int colorIndex = 0;
									
									getMenuStatRs.beforeFirst();
									while(getMenuStatRs.next()) {
										int height = (int)(maxHeight * (getMenuStatRs.getInt("cnt")/totalCnt));
								%>
										<td style="vertical-align: bottom;">
											<div style="height: <%=height%>px; 
														background-color:<%=color[colorIndex]%>;
														text-align: center">
												<%=getMenuStatRs.getInt("cnt")%>
											</div>
										</td>
								<%		
										colorIndex++;
									}
								%>
							</tr>
							<tr>
								<%
									// 커서의 위치를 처음 행으로
									getMenuStatRs.beforeFirst();
												
									while(getMenuStatRs.next()) {
								%>
										<th>
											<%=getMenuStatRs.getString("menu")%>
										</th>
								<%		
									}
								%>
							</tr>
						</table>
					</div>
					
				</div>
					
			</div>
			
			<div class="col"></div>
			
		</div>
	
</body>
</html>

 

어떤날의 점심을 투표할지 lunchDate를 선언해 getParameter로 받아 올 수 있도록 했다.

write 변수를 선언해 해당 일에 점심을 선택할 수 있는지 아닌지 구별하고자 했다.

write메시지 변수를 선언해 투표가 가능한지 불가능한지 페이지에 출력이 가능하도록했다.

 

일단 날짜를 선택하고 투표가능확인 버튼을 누르면 

checkLunchAction페이지로 넘어가 해당 일에 점심 투표가 가능한지 체크를 하도록 했다.

가능하다면 해당 일자와 write가 y가 넘어오고

불가능하면 write가 n이 넘어오도록 했다.

또한 해당일자가 넘어오면 input태그의 value와 readonly를 이용해 날짜를 따로 표시하고, lunchAddAction으로 넘어 갈 수 있도록 했다.

lunchAddForm.jsp

<%@page import="java.net.URLEncoder"%>
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}
	
	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");
	
	// 요청 값 확인
	String lunchDate = request.getParameter("lunchDate");
	String write = request.getParameter("write");
	
	// 요청 값 확인
	System.out.println("lunchAddForm - lunchDate = " + lunchDate);	
	System.out.println("lunchAddForm - write = " + write);
	
	if(lunchDate == null) {
		lunchDate = "";
	}
	// 선택된 날짜에 점심 투표 가능한지
	if(write == null) {
		write = "";
	}
	
	// 점심 투표가 가능한지 불가능한 날짜인지 알려주는 메시지를 출력
	String writeMsg = "";
	if(write.equals("Y")) {
		writeMsg = "투표 가능한 날짜 입니다.";
	} else if(write.equals("N")){
		writeMsg = "투표 불가능한 날짜 입니다.";
	}
	
	String errMsg = request.getParameter("errMsg");
%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>title</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Orbit&display=swap" rel="stylesheet">
	<style>	
		body {
			background-image: url('/diary/img/img5.jpg');
			background-size: 100%;
			background-repeat: no-repeat; 
			background-position: center;
			font-family: "Orbit", sans-serif;
			font-weight: 300;
			font-style: normal;
			min-height: 100vh;
		}
		
		.button {
			color: black;
		}
	</style>
</head>
<body>
	<div class="row" style="min-height: 100vh;">
			<div class="col"></div>
			
			<div class="col-6 mt-5 border border-light-subtle shadow p-2 rounded-2" style="background-color: rgba(248, 249, 250, 0.7); height: 450px; width: 800px;">
			
				<div>
					<%
						if(errMsg != null) {
					%>
							<%=errMsg%>
					<%
						}
					%>
				</div>
				
				<div class="row">
					
					<div class="col-4">
						<div style="display: flex;">
							<form action="/diary/diaryListOfMonth.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px; padding: 5 10px; width: 115px;">
									&#128214;다이어리
								</button>
							</form>
							
							<form action="/diary/diaryList.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#128214;일기 목록
								</button>
							</form>
						</div>
						<div style="display: flex;">
							
							<form action="/diary/lunch/statsLunch.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px;">
									&#127835;점심 통계
								</button>
							</form>
							<form action="/diary/lunch/lunchAddForm.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#127835;점심 투표
								</button>
							</form>
						</div>
					</div>
					
					<div class="col-4">
						<h1 style="text-align: center; font-size: 55px;">점심 메뉴</h1>
					</div>
	
					<div class="col-4" style="text-align: right;">
						<form action="/diary/diaryListOfMonth.jsp">
							<button type="submit" class="btn-close" aria-label="Close" style="margin: 15px;"></button>
						</form>
					</div>
					
				</div>
	
				<hr>
				
				<div>
				
					<div style="text-align: center;">
						
						<form action="/diary/lunch/checkLunchAction.jsp">
							<input type="date" name="lunchDate">
							<button class="btn btn-outline-secondary" type="submit">투표 가능 확인</button>
						</form>
						
			
						<form action="/diary/lunch/lunchAddAction.jsp" method="post">
							<%
								if(write.equals("Y")) {
							%>
									<input type="date" name="lunchDate" value="<%=lunchDate%>" readonly="readonly" style="width: 150px; background-color: rgba(0,0,0,0);">
									<div><%=writeMsg%></div>

							<%
								} else {
							%>
									<input type="text" name="lunchDate" readonly="readonly" style="width: 150px; background-color: rgba(0,0,0,0);">
									<div><%=writeMsg%></div>
							<%
								}
							%>
							<div style="margin-top: 30px;">
								메뉴를 투표해주세요
							</div>
							
							<div style="margin-top: 30px;">
								<input type="radio" name="menu" value="한식">한식
								<input type="radio" name="menu" value="중식">중식
								<input type="radio" name="menu" value="일식">일식
								<input type="radio" name="menu" value="양식">양식
								<input type="radio" name="menu" value="기타">기타
							</div>
							
							<div>
								<button class="btn btn-outline-secondary" type="submit" style="margin-top: 30px;">투표 하기</button>
							</div>
						</form>

					</div>
					
				</div>
					
			</div>
			<div class="col"></div>
		</div>
</body>
</html>

 

lunchDate 요청값을 받아 [DB]diary.lunch테이블에 Select쿼리를 날려 해당 날짜가 존재하는지 확인하고, 존재하면 투표가 불가능하므로 lunchDate값과 write를 n으로 lunchAddAction으로 보내고

존재하지 않으면 lunchDate값과 write를 y로 lunchAddAction으로 보냈다.

checkLunchAction.jsp

<%@page import="java.sql.*"%>
<%@page import="java.net.URLEncoder"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%

	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}
	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");

	// lunch 테이블에 날짜가 이미 존재하는지 확인하기 -> 존재하지 않아야 투표 가능
	// 요청 값 분석
	String checkLunchDate = request.getParameter("lunchDate");
	if(checkLunchDate == null) {
		checkLunchDate = "";
	}
	
	System.out.println("checkDateAction - checkLunchDate = " + checkLunchDate);	// checkLunchDate 값 확인
	
	String checkLunchSql = "SELECT lunch_date lunchDate from lunch where lunch_date = ?";
	PreparedStatement checkLunchStmt = conn.prepareStatement(checkLunchSql);
	checkLunchStmt.setString(1, checkLunchDate);
	ResultSet checkLunchRs = checkLunchStmt.executeQuery();
		
	if(checkLunchRs.next()) {
		// 해당 날짜는 투표 불가능(이미 해당 날짜의 점심 투표 존재함)
		response.sendRedirect("/diary/lunch/lunchAddForm.jsp?lunchDate=" + checkLunchDate + "&write=N");
	} else {
		// 아무 날짜도 선택하지 않고 투표 가능 확인 버튼을 눌렀을 때 투표 불가능
		if(checkLunchDate.equals("")) {
			response.sendRedirect("/diary/lunch/lunchAddForm.jsp?lunchDate=" + checkLunchDate + "&write=N");
		} else {
			// 해당 날짜는 점심 투표 가능
			response.sendRedirect("/diary/lunch/lunchAddForm.jsp?lunchDate=" + checkLunchDate + "&write=Y");
		}
	}
%>

 

lunchAddForm에서 선택한 menu 요청값을 getParameter로 받았다.

넘어온 lunchDate, menu값을 이용해 DB에 INSERT 쿼리문을 사용했다.

lunchAddAction.jsp

<%@page import="java.net.URLEncoder"%>
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}
	
	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");

	// 요청 값 분석
	String lunchDate = request.getParameter("lunchDate");

	if(lunchDate == null) {
		response.sendRedirect("/diary/diaryListOfMonth.jsp");
		return;
	}

	String menu = request.getParameter("menu");
	if(menu == null) {
		response.sendRedirect("/diary/lunch/lunchOne.jsp?lunchDate=" + lunchDate);
		return;
	}
	//[DB]diary.lunch에 입력하는 sql
	
	String setLunchSql = "INSERT INTO lunch(lunch_date,menu,create_date,update_date) VALUES(?, ?, NOW(), NOW())";
	PreparedStatement setLunchStmt = null;
	ResultSet setLunchRs = null;
	
	setLunchStmt = conn.prepareStatement(setLunchSql);
	setLunchStmt.setString(1, lunchDate);
	setLunchStmt.setString(2, menu);
	
	int row = setLunchStmt.executeUpdate();
	System.out.println("lunchAddAction - lunchDate = " + lunchDate);
	System.out.println("lunchAddAction - row = " + row);
	
	if(row == 1) {
		response.sendRedirect("/diary/lunch/lunchOne.jsp?lunchDate=" + lunchDate);
		return;
	} else {
		response.sendRedirect("/diary/lunch/lunchOne.jsp?lunchDate=" + lunchDate);
		return;
	}

%>

 

삭제 전 페이지에 해당일자와 어떤 메뉴를 선택했는지 보여주기 위해

menu, lunchDate를 getParameter로 받아올 수 있도록 했다.

그리고 pw를 입력해 삭제하기 전 검증 할 수 있도록 했다.

deleteLunchForm.jsp

<%@page import="java.net.URLEncoder"%>
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}

	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");

	// 요청 값 
	String lunchDate = request.getParameter("lunchDate");
	String menu = request.getParameter("menu");

	if(lunchDate == null) {
		response.sendRedirect("/diary/diaryListOfMonth.jsp");
	}
	
	// lunchDate 요청 값 확인
	System.out.println("deleteLunchForm - lunchDate = " + lunchDate);
		
%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>title</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Orbit&display=swap" rel="stylesheet">
	<style>
	
		body {
			background-image: url('/diary/img/img5.jpg');
			background-size: 100%;
			background-repeat: no-repeat; 
			background-position: center;
			font-family: "Orbit", sans-serif;
			font-weight: 300;
			font-style: normal;
			min-height: 100vh;
		}
		
		.button {
			color: black;
		}
	</style>
</head>
<body>
	<div>
		
	</div>
	
	<div class="row" style="min-height: 100vh;">
			<div class="col"></div>
			
			<div class="col-6 mt-5 border border-light-subtle shadow p-2 rounded-2" style="background-color: rgba(248, 249, 250, 0.7); height: 450px; width: 800px;">
	
	
				<div class="row">
					

					<div class="col-4">
						<div style="display: flex;">
							<form action="/diary/diaryListOfMonth.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px; padding: 5 10px; width: 115px;">
									&#128214;다이어리
								</button>
							</form>
							
							<form action="/diary/diaryList.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#128214;일기 목록
								</button>
							</form>
						</div>
						<div style="display: flex;">
							
							<form action="/diary/lunch/statsLunch.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black; margin-right: 10px;">
									&#127835;점심 통계
								</button>
							</form>
							<form action="/diary/lunch/lunchAddForm.jsp">
								<button type="submit" class="btn btn-outline-secondary" style="color: black;">
									&#127835;점심 투표
								</button>
							</form>
						</div>
					</div>

					
					<div class="col-4">
						<h1 style="text-align: center; font-size: 55px;">점심 메뉴</h1>
					</div>
	
					<div class="col-4" style="text-align: right;">
						<form action="/diary/lunch/lunchOne.jsp?lunchDate=<%=lunchDate%>" method="post">
							<button type="submit" class="btn-close" aria-label="Close" style="margin: 15px;"></button>
						</form>
					</div>
					
				</div>
	
				<hr>
				
				<div>
				
					<div style="text-align: center;">
					 	<form action="/diary/lunch/deleteLunchAction.jsp" method="post" style="margin-top: 50px;">
					 		<div>
					 			<%=lunchDate %>일 투표한 음식은 <%=menu %>입니다.
					 		</div>
					 		
							<div style="margin-top: 30px;">
								삭제하시려면 비밀번호를 입력해주세요.
							</div>
							
							<div style="margin-top: 30px;">
								<input type="hidden" name="lunchDate" value="<%=lunchDate%>">
								<input type="hidden" name="menu" value="<%=menu%>">
								pw : 
								<input type="password" name="pw">
							</div>
							
							<div>
								<button class="btn btn-outline-secondary" type="submit" style="margin-top: 30px;">입력 완료</button>
							</div>
							
						</form>
					</div>
					
					<div style="text-align: center;">


					</div>
					
				</div>
					
			</div>
			<div class="col"></div>
		</div>
	
</body>
</html>

 

deleteLunchForm 페이지에서 lunchDate, menu, pw값을 받아오고

[DB]diary.member에서 pw를 select쿼리로 확인을 한다.

pw가 일치할 경우에만 

[DB]diary.lunch 테이블에 DELETE문을 실행할 수 있도록 했다.

pw가 일치하지 않을경우에는 errMsg와 함께 달력모양다이어리로 이동하도록 했다.

deleteLunchAction.jsp

<%@page import="java.net.URLEncoder"%>
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	//0. 로그인(인증) 분기
	String loginMember = (String)(session.getAttribute("loginMember"));
	if(loginMember == null) {
		String errMsg = URLEncoder.encode("잘못된 접근 입니다. 로그인 먼저 해주세요", "utf-8");
		response.sendRedirect("/diary/login/loginForm.jsp?errMsg="+errMsg);
		return;
	}

	//DB 연결 및 초기화
	Class.forName("org.mariadb.jdbc.Driver");
	Connection conn = null;
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/diary", "root", "****");
	// 요청 값
	String lunchDate = request.getParameter("lunchDate");
	String menu = request.getParameter("menu");
	String pw = request.getParameter("pw");
	
	// 요청 값 확인
	System.out.println("deleteLunchAction - lunchDate = " + lunchDate);
	System.out.println("deleteLunchAction - menu = " + menu);
	System.out.println("deleteLunchAction - pw = " + pw);
	
	// [DB]diary.member에서 pw 체크
	// pw확인하는 쿼리
	String checkPwSql = "SELECT member_id memberId FROM MEMBER WHERE member_pw = ?";
	PreparedStatement checkPwStmt = null;
	ResultSet checkPwRs = null;
	
	checkPwStmt = conn.prepareStatement(checkPwSql);
	checkPwStmt.setString(1, pw);
	checkPwRs = checkPwStmt.executeQuery();
	// pw 체크
	if(checkPwRs.next()) {
		// pw가 일치한다면
		
		// 점심 메뉴 삭제하는 sql 실행
		String deleteMenuSql = "DELETE FROM lunch WHERE lunch_date = ? AND menu = ?";
		
		PreparedStatement deleteMenuStmt = null;
		
		deleteMenuStmt = conn.prepareStatement(deleteMenuSql);
		deleteMenuStmt.setString(1, lunchDate);
		deleteMenuStmt.setString(2, menu);
		
		int row = deleteMenuStmt.executeUpdate();
		System.out.println("deleteLunchAction - row = " + row);
		
		response.sendRedirect("/diary/diaryListOfMonth.jsp");
		
	} else {
		String errMsg = URLEncoder.encode(lunchDate + "일의 점심 메뉴 삭제 실패했습니다. 다시 삭제해주세요", "UTF-8");
		response.sendRedirect("/diary/diaryListOfMonth.jsp?errMsg=" + errMsg);
	}
	
%>

 

 

728x90

'웹 개발 > 다이어리 프로젝트(개인)' 카테고리의 다른 글

jsp로 crud를 사용한 다이어리 만들기(10)-로그인 session으로 변경  (0) 2024.04.01
jsp로 crud를 사용한 다이어리 만들기(9)-일기DB 테이블 추가  (1) 2024.04.01
jsp로 crud를 사용한 다이어리 만들기(8)-목록형 다이어리 구현  (0) 2024.04.01
jsp로 crud를 사용한 다이어리 만들기(7)-일기 수정  (0) 2024.03.27
jsp로 crud를 사용한 다이어리 만들기(6)-일기 삭제  (0) 2024.03.27

'웹 개발/다이어리 프로젝트(개인)' Related Articles

티스토리툴바