본문 바로가기

2023.11.21-2024.05.31

240126 게시판만들기(관리자 페이지)

admin 패키지 만들어서 안에 jsp만들기>관리자 모드이기때문

 

admin.jsp 만들기

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>관리자 페이지</title>
<link href="../css/admin.css" rel="stylesheet"/>
<script type="text/javascript" src="../js/menu.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css">
</head>
<body>
	<!-- 2024-01-26 관리자 페이지 만들기 -->
	<!-- 틀 -->
	<div class="wrap">
		<!-- menu -->
		<div class="menu">
			<nav>
				<ul>
					<li onclick="url('./members')"><i class="xi-users"></i> 회원 관리</li>
					<li onclick="url('./board')"><i class="xi-document"></i> 게시글 관리</li>
					<li onclick="url('./comments')"><i class="xi-forum-o"></i> 댓글 관리</li>
					<li onclick="url('./info')"><i class="xi-lock-o"></i> MASK님</li>
					<li onclick="url('./index')"><i class="xi-paper-o"></i>게시판 </li>
					<li></li>
					<li></li>
				</ul>
			</nav>
		</div>
		<!-- 본문내용 -->
		<div class="main">
			<!-- 이 페이지에 오는 모든 사람은 관리자인지 검사를 합니다.
			관리자 경우 보여주고, 로그인 하지 않았거나 일반 사용자는 로그인 페이지로 이동시킵니다. -->
			<article>
			
				<div class="info">
					왼쪽 메뉴를 선택하세요.
				</div>
				
			</article>
			
			
		</div>
	</div>
</body>
</html>

 

 

 

Admin.pakage 만들기 그안에

AdminIndex.java 서블릿 만들기

package com.sukgi.admin;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


@WebServlet("/admin/index") //url의 경로 = 실제 파일과 다르게 호출할 url을 지정합니다.
public class AdminIndex extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    public AdminIndex() {
        super();
    }

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//response.getWriter().append("Served at: ").append(request.getContextPath());
		RequestDispatcher rd = request.getRequestDispatcher("/admin/admin.jsp");//파일 있는 경로
		rd.forward(request, response);
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//doGet(request, response);
	}

}

 

 

*이렇게 만들거에요~ 선생님이 그린신것*

 

 

admin.css만들기

 

서블릿에 css태그 추가 후 css파일 만들기

@charset "UTF-8";
body{
	margin: 0;
	padding: 0;	
}

.wrap{
	width: 100%;
	height: 100vh;
	display: flex;
	background-color: #E3BAB3;
}
.menu{
	width: 150px;
	height: 100vh;
	background-color: #373616;
	color : #E9E6E1;
}
.main{
	width: calc(100% - 150px);
	height: 100vh;
	background-color: #BE7D1F; 
	color : #E9E6E1;
	
}

nav{
	margin-top: 50px;
}

nav ul{
	margin:0;
	padding:0;
	list-style: none;
}
nav > ul > li{
	margin:0;
	padding:0;
	margin: 5px 10px;
	padding: 10px 0px;
	text-align: left;
	padding-left: 5px;
}
nav > ul > li:hover {
	background-color: #E5D2C3;
	color: #373616;
}

.info{
	width : 200px;
	height: 200px;
	line-height:200px;
	text-align:center;
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: #E5D2C3;
	margin-top: -100px;
	/* margin-left: -50px; */
}

 

 

수업 진도 주루룩 놓침

 

*다시 추가한 것 정리*

 

 

admin.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>관리자 페이지</title>
<link href="../css/admin.css" rel="stylesheet"/>
<script type="text/javascript" src="../js/menu.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css">
</head>
<body>
	<!-- 2024-01-26 관리자 페이지 만들기 -->
	<!-- 틀 -->
	<div class="wrap">
		<!-- menu -->
		<div class="menu">
			<nav>
				<ul>
					<li onclick="url('./members')"><i class="xi-users"></i> 회원 관리</li>
					<li onclick="url('./board')"><i class="xi-document"></i> 게시글 관리</li>
					<li onclick="url('./comments')"><i class="xi-forum-o"></i> 댓글 관리</li>
					<li onclick="url('./info')"><i class="xi-lock-o"></i> MASK님</li>
					<li onclick="url('./index')"><i class="xi-paper-o"></i>게시판 </li>
					<li></li>
					<li></li>
				</ul>
			</nav>
		</div>
		<!-- 본문내용 -->
		<div class="main">
			<!-- 이 페이지에 오는 모든 사람은 관리자인지 검사를 합니다.
			관리자 경우 보여주고, 로그인 하지 않았거나 일반 사용자는 로그인 페이지로 이동시킵니다. -->
			<article>
			
				<div class="info">
					왼쪽 메뉴를 선택하세요.
				</div>
				
			</article>
			
			
		</div>
	</div>
</body>
</html>

 

 

members.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<!-- 2024.01.26 -->
<html>
<head>
<meta charset="UTF-8">
<title>관리자 페이지</title>
<link href="../css/admin.css" rel="stylesheet"/>
<link href="../css/member.css" rel="stylesheet"/>
<script type="text/javascript" src="../js/menu.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css">
<script>
//$(document).ready(function (){
$(function (){
	//alert("!");
	$('select[name=grade]').on("change", function(){
		let val = $(this).val();//변경시킬 등급
		let mno = $(this).closest("tr").children().first().text();
		//두 값을 잡았으면 가상 form에 담아서 전송합니다.
		let form = $('<form></form>');
		form.attr('method', 'post');
		form.attr('action', './members');
		form.append($('<input/>', {type : 'hidden', name : 'mno', value : mno}));
		form.append($('<input/>', {type : 'hidden', name : 'grade', value : val}));
		<c:if test="${param.grade ne null}">
		form.append($('<input/>', {type : 'hidden', name : 'currentgrade', value : ${param.grade}}));
		</c:if>
		form.appendTo('body');
		form.submit();
	});
	
});
</script>
</head>
<body>
	<div class="wrap">
		<div class="menu">
			<nav>
				<ul>
					<li onclick="url('./members')"><i class="xi-users"></i> 회원 관리</li>
					<li onclick="url('./board')"><i class="xi-document"></i> 게시글 관리</li>
					<li onclick="url('./comments')"><i class="xi-forum-o"></i> 댓글 관리</li>
					<li onclick="url('./info')"><i class="xi-lock-o"></i> mask님</li>
					<li onclick="url('./index')"><i class="xi-lock-o"></i> 게시판</li>
					
				</ul>
			</nav>
		</div>
		<div class="main">
			<article>
				<h2>회원관리</h2>
				<div class="member-lists">
               <ul>
						<li onclick="url('./members?grade=0')"><i class="xi-close-circle-o"></i> 탈퇴</li>
						<li onclick="url('./members?grade=1')"><i class="xi-minus-circle-o"></i> 강퇴</li>
						<li onclick="url('./members?grade=2')"><i class="xi-check-circle-o"></i> 정지</li>
						<li onclick="url('./members?grade=5')"><i class="xi-label-o"></i> 정상</li>
						<li onclick="url('./members?grade=9')"><i class="xi-plus-square-o"></i> 관리자</li>	               
               </ul>
            </div>
				
				<table>
					<thead>
					<tr>
						<th>번호</th>
						<th>아이디</th>
						<th>이름</th>
						<th>가입일</th>
						<th>등급</th>
					</tr>
					</thead>
					<tbody>
						<c:forEach items="${list }" var="row">
						<tr class="row${row.mgrade }">
							<td class="d1">${row.mno }</td>
							<td class="title">${row.mid }</td>
							<td class="d1">${row.mname }</td>
							<td class="d2">${row.mdate }</td>
							<td class="d1">
								<select name="grade">
									<optgroup label="정지">
										<option <c:if test="${row.mgrade eq 0}">selected="selected"</c:if> value="0">0 강퇴</option>
										<option <c:if test="${row.mgrade eq 1}">selected="selected"</c:if> value="1">1 탈퇴</option>
										<option <c:if test="${row.mgrade eq 2}">selected="selected"</c:if> value="2">2 정지</option>
									</optgroup>
									<optgroup label="정상">
										<option <c:if test="${row.mgrade eq 5}">selected="selected"</c:if> value="5">5 회원</option>
									</optgroup>
									<optgroup label="관리자">								
										<option <c:if test="${row.mgrade eq 9}">selected="selected"</c:if> value="9">9 관리자</option>
									</optgroup>
								</select>				
							</td>
						</tr>
						</c:forEach>
					</tbody>
				</table>
				페이징 필요
				<button onclick="url('./members')" class=adminB>members</button>
				<button onclick="url('./')" class=adminB>admin</button>
			</article>
		</div>
	</div>
</body>
</html>

 

 

 

com.admin. 패키지 만들어서 서블릿 파일 만들어주기

 

AdminIndex.java

package com.sukgi.admin;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


@WebServlet("/admin/index") //url의 경로 = 실제 파일과 다르게 호출할 url을 지정합니다.
public class AdminIndex extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    public AdminIndex() {
        super();
    }

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//response.getWriter().append("Served at: ").append(request.getContextPath());
		RequestDispatcher rd = request.getRequestDispatcher("/admin/admin.jsp");//파일 있는 경로
		rd.forward(request, response);
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//doGet(request, response);
	}

}

 

 

Members.java

package com.sukgi.admin;

import java.io.IOException;
import java.util.List;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.sukgi.dao.AdminDAO;
import com.sukgi.dto.MemberDTO;
import com.sukgi.util.Util;
//2024.01.26
@WebServlet("/admin/members")
public class Members extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
	 public Members() {
	        super();
	    }

	 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
			//System.out.println(request.getParameter("grade"));
			
			AdminDAO dao = new AdminDAO();
			List<MemberDTO> list = null;
			if(request.getParameter("grade") == null || request.getParameter("grade").equals("")) {
				list = dao.memberList();

			} else {
				list = dao.memberList(Util.str2Int(request.getParameter("grade")));

			}
			
			request.setAttribute("list", list);
			RequestDispatcher rd = request.getRequestDispatcher("/admin/members.jsp");
			rd.forward(request, response);
		}

	 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
			//System.out.println(request.getParameter("mno"));
			//System.out.println(request.getParameter("grade"));
			
		 	//db에 변경
			AdminDAO dao = new AdminDAO();
			int result = dao.memberUpdate(Util.str2Int(request.getParameter("grade")), Util.str2Int(request.getParameter("mno")));
			//System.out.println(result);
			//페이지 이동
			if(request.getParameter("currentgrade") == null) {
				response.sendRedirect("./members");
				
			}else {
				response.sendRedirect("./members?grade=" + request.getParameter("currentgrade"));
			}

			
			
		}

	}

 

 

AdminDAO파일 만들어주기

 

package com.sukgi.dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

import com.sukgi.dto.MemberDTO;


//2024.01.26
	public class AdminDAO extends AbstractDAO {
		public List<MemberDTO> memberList() {
			List<MemberDTO> list = new ArrayList<MemberDTO>();
			Connection con = db.getConnection();
			PreparedStatement pstmt = null;
			ResultSet rs = null;
			String sql = "SELECT mno, mid, mname, mdate, mgrade FROM member";

			try {
				pstmt = con.prepareStatement(sql);
				rs = pstmt.executeQuery();
				while (rs.next()) {
					MemberDTO e = new MemberDTO();
					e.setMno(rs.getInt("mno"));
					e.setMid(rs.getString("mid"));
					e.setMname(rs.getString("mname"));
					e.setMdate(rs.getString("mdate"));
					e.setMgrade(rs.getInt("mgrade"));
					list.add(e);
				}
			} catch (SQLException e) {
				e.printStackTrace();
			} finally {
				close(rs, pstmt, con);
			}
			return list;
		}
		

		public List<MemberDTO> memberList(int grade) {
			List<MemberDTO> list = new ArrayList<MemberDTO>();
			Connection con = db.getConnection();
			PreparedStatement pstmt = null;
			ResultSet rs = null;
			String sql = "SELECT mno, mid, mname, mdate, mgrade FROM member WHERE mgrade=?";

			try {
				pstmt = con.prepareStatement(sql);
				pstmt.setInt(1, grade);
				rs = pstmt.executeQuery();
				while (rs.next()) {
					MemberDTO e = new MemberDTO();
					e.setMno(rs.getInt("mno"));
					e.setMid(rs.getString("mid"));
					e.setMname(rs.getString("mname"));
					e.setMdate(rs.getString("mdate"));
					e.setMgrade(rs.getInt("mgrade"));
					list.add(e);
				}
			} catch (SQLException e) {
				e.printStackTrace();
			} finally {
				close(rs, pstmt, con);
			}
			return list;
		}

		
		public int memberUpdate(int grade, int mno) {
			Connection con = db.getConnection();
			PreparedStatement pstmt = null;
			String sql = "UPDATE member SET mgrade=? WHERE mno=?";
			int result = 0;

			try {
				pstmt = con.prepareStatement(sql);
				pstmt.setInt(1, grade);
				pstmt.setInt(2, mno);
				result = pstmt.executeUpdate();
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				close(null, pstmt, con);
			}
			return result;
		}
	

	}

 

 

admin, board css 만들어주기.

 

board.css

@charset "UTF-8";



table {
	width: 100%;
	height: 30%;
	border-collapse: collapse;
	margin-bottom: 1rem;
	color: #F4EBE7;
}


tr:hover {
	background-color: #F4EBE7;
	color: #4F7358;
}


th {
	background-color: #9cb395;
	border-bottom: 1px solid black;
	color: #5c6e56;
}

td {
	text-align: center;
	line-height: 30px;
	border-bottom: 1px dotted #5c6e56;
	color: #9cb395;
	height: 50px;
	margin-bottom: 1rem;
}

.title {
	text-align: left;
	width: 50%;
}

.w1 {
	width: 10%;
}

.w2 {
	width: 20%
}


.title a {
	text-decoration: none;
}

.title a:visited {
	color: pink;
}

.title a:hover {
	color: #9cb395;
}

.board_button {
	width: 10%;
	padding: 7px;
	border: none;
	border-radius: 5px;
	color: #F2C2CB;
	background-color: #5c6e56;
	cursor: pointer;
	outline: none;
	margin-bottom: 1rem;

}

.paging {
	margin: 0 auto;
	width: fit-content;
	height: 30px;
	background-color: #F4EBE7;
	margin-top: 20px;
	line-height: 30px;
	text-align: center;
}

.currentBtn {
	background-color: #9cb395;
	color: #F4EBE7;
	border: none;
	height: 25px;
}

span {
	color: #5c6e56;
	font-size: small;
}

footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 30px;
	background-color: #4f7358;
	color: #F2C2CB;
}

 

 

member.css

@charset "UTF-8";
/*2024.01.26*/
article {
	margin: 10px;
	padding: 10px;
	width: calc(100% - 40px);
	height: calc(100vh - 40px);
	overflow: scroll;
}

table {
	width: 100%;
	height: auto;
	border-collapse: collapse;
}

th {
	background-color: #26434B;
	height: 30px;
	line-height: 30px;
}

tr {
	height: 40px;
	line-height: 30px;
}

tr:hover {
	background-color: #E5D2C3;
	color: #26434B;
}

td{
	text-align: center;
}

.d1{
	width: 10%;
}
.d2{
	width: 20%;
}
.title{
	width: 20%;
	text-align: left;
}
.row0{ /* 강퇴 : 빨간색 */ 
   background-color: #7E5251;
}
.row1{ /* 탈퇴 : 회색 */
   background-color: #26434B;
}
.row2{ /* 정지 : 주황색 */
   background-color: #A8795B;
}
.row9{ /* 관리자 : 녹색 */
   background-color: #617167;
}

.member-lists{
	height: 30px;
	width: 100%;
	background-color: #E5D2C3;
	margin-bottom: 5px;
}

.member-lists ul{
	margin:0;
	padding: 0;
	list-style-type: none;
	height: 30px;
	line-height: 30px;
}
.member-lists ul li{
	width: 100px;
	display: inline-block;
	text-align: center;
	color: #26434B;
}
.member-lists ul li:hover {
	background-color: GRAY;
		color: black;
	font-weight: bold;
}


.adminB{
		width: 10%;
	padding: 7px;
	border: none;
	border-radius: 5px;
	color: #E5D2C3;
	background-color: #8c5a12;
	cursor: pointer;
	outline: none;
}