본문 바로가기

Java 웹 개발

21.11.05 - 웹 개발 입문 60일차

기존에 만든 홈페이지에 디자인하기 

css파일 보기

[ commons.css ]

더보기
/*
    CSS 파일
    = 디자인 코드만 모아두는 파일
    = 매 페이지마다 새롭게 디자인을 하지 않도록 자주 사용하는 디자인을 보관
*/


/*
    모든 디자인은 크기(폭, 높이) 기준을 "테두리"까지로 한다.
    모든 디자인에는 고딕(sans-serif)체를 적용한다.
*/
* {
    box-sizing : border-box;
}

/*
    모든 영역은 컨테이너를 만들면서 시작한다.
    자주 사용할 컨테이너를 크기별로 준비해둔다.(100px ~ 1000px)
*/

.container-100 {
    width: 100px;
}

.container-200 {
    width: 200px;
}

.container-300 {
    width: 300px;
}

.container-400 {
    width: 400px;
}

.container-500 {
    width: 500px;
}

.container-600 {
    width: 600px;
}

.container-700 {
    width: 700px;
}

.container-800 {
    width: 800px;
}

.container-900 {
    width: 900px;
}

.container-1000 {
    width: 1000px;
}

/*
    컨테이너 내부에는 행(row)을 배치하여 자리를 확보한다.
*/
.row {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top:5px;
    padding-bottom:5px;
}

/*
    form 입력요소 스타일링
    
    = .form-input은 입력창
    = .form-btn은 버튼
    = 기본적으로 100%의 폭을 가지도록 설정
*/
.form-input, .form-btn {
    width:100%;
    font-size: 20px;
    padding:10px;
}
.form-input {
    border:1px solid rgb(43, 48, 90);
}
.form-btn {
    color:white;
    background-color: rgb(43, 48, 90);
    font-weight: bold;
}
.form-block {
    display: block;
}
.form-inline {
    width:auto;
}

/*
    내용 정렬 스타일링
    .left = 왼쪽 정렬(기본값)
    .center = 가운데 정렬
    .right = 오른쪽 정렬
    
    다른 어떠한 스타일보다 우선순위가 높아야 하므로 하므로 important 처리를 수행한다.
*/
.left {
    text-align: left !important;
}
.center {
    text-align: center !important;
}
.right {
    text-align: right !important;
}

	
/*
    영역 배치
    .container-left = 영역 왼쪽 배치
    .container-center = 영역 가운데 배치
    .container-right = 영역 오른쪽 배치
*/
.container-left {
    margin-left: 0;
    margin-right: auto;
}
.container-center {
    margin-left: auto;
    margin-right:auto;
}
.container-right {
    margin-left: auto;
    margin-right:0; 
}

/*
    textarea 스타일링
    = 우리가 만드는 페이지에서 textarea의 가로 변경은 허용하지 않는다.
    = textarea는 기본적으로 크기 변경이 불가능하게 만들고, 세로 변경은 class="vertical"을 추가
*/
textarea {
    resize:none;
}
textarea.vertical {
    resize: vertical;
    min-height:200px; 
}

/*
    페이징 스타일링

    연계 선택자(자손 선택자)
    = .pagination 안에 있는 a태그만 선택하고 싶은 경우
    = .pagination > a
    = 모든 a태그를 수정하면 위험하므로 원하는 영역으로 제한하여 수정

    REM
    = 글자 크기에 비례하여 설정하는 비율형 크기
    = 2.5rem은 기본 글자 높이의 2.5배라는 의미
    = 글자 크기가 변할 수 있는 경우 유용하게 사용 가능
*/
.pagination {
    text-align: center;
}
.pagination > a, 
.pagination > a:link, 
.pagination > a:visited {
    color:black;
    text-decoration: none;
    border:1px solid gray;
    min-width:2.5rem;
    display: inline-block;
    text-align: center;
    padding:0.5rem;
}
.pagination > a:hover,
.pagination > a.active{
    color:red;
    border:1px solid red;
}

/*
    이미지 스타일
    - 공용 스타일 : .image
    - 확장 스타일
        .image-round : 둥근 이미지
        .image-border : 테두리가 있는 이미지
        .image-hover : 마우스가 올라가면 테두리가 생기는 이미지
        .image-blur : 마우스가 올라가면 선명해지는 이미지
        .image-shadow : 그림자가 생기는 이미지
        .image-leaf : 나뭇잎 모양의 이미지
*/
.image {
    border: 2px solid transparent;
}

.image.image-round {
    border-radius: 50%;
}

.image.image-border,
.image.image-hover:hover {
    border: 2px solid gray;
}

.image.image-blur {
    /* 
        opacity를 이용하여 불투명 정도를 0(0%) 부터 1(100%) 사이에서 설정 
        background에 부여하는 alpha는 배경만 투명해지지만, opacity는 태그 전체가 투명(내용물 포함)
    */
    opacity: 0.4;
}

.image.image-blur:hover {
    opacity: 1;
}

.image.image-shadow {
    /*
        box-shadow : x축위치 y축위치 번짐정도 확장크기 색상
        box-shadow: 5px 5px 0px 0px black;
    */
    box-shadow: 0px 0px 10px 2px yellow;
}

.image.image-leaf {
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
}

/*
    테이블 스타일링
    = table은 태그가 한 개가 아니다.
    - 공용 스타일 : .table
    - 확장 스타일
            .table-border - 테두리 추가
            .table-hover - 마우스가 올라간 줄에 배경색이 표시되는 효과 부여(내용만)
            .table-stripe - 줄무늬 테이블
*/

.table {
    width:100%;
}
.table > thead > tr > th, 
.table > thead > tr > td,
.table > tbody > tr > th,
.table > tbody > tr > td,
.table > tfoot > tr > th,
.table > tfoot > tr > td {
    padding:0.5rem;
    text-align: center;
}

.table.table-border {
    border:1px solid black;
    border-collapse : collapse;
}
.table.table-border > thead > tr > th, 
.table.table-border > thead > tr > td,
.table.table-border > tbody > tr > th,
.table.table-border > tbody > tr > td,
.table.table-border > tfoot > tr > th,
.table.table-border > tfoot > tr > td {
    border:1px solid black;
}

.table.table-hover > tbody > tr:hover {
    background-color:#EEEEEE;
}

/*
    :nth-child(2n) 일 경우 n=1부터 증가하면서 패턴으로 적용
*/
.table.table-stripe > thead > tr,
.table.table-stripe > tbody > tr:nth-child(2n) {
    background-color:#EEEEEE;
}
/*
    float 스타일링
    1. float는 반드시 필요한 상황이 있다.
    2. 기존 화면과 충돌이 나는 상황은 싫다.
    3. float 전용 영역을 만들어서 모든 상황을 그 안에서 해결하도록 처리한다.
    가상 선택자
    = 존재하지 않는 영역을 가상으로 선택하여 디자인을 부여할 수 있다.
    = 원래 없는 영역이기 때문에 내용을 뭐라도 적어야 한다(빈칸이라도)
*/
.float-container::after {
    content:"";
    display: block;
    clear: both;
}
.float-container > .float-item-left {
    float:left;
}
.float-container > .float-item-right {
    float:right;
}

/*
    flex layout
    = display:flex; 를 통해 영역 내부의 요소를 float처럼 처리할 수 있다.
    = clear 처리가 필요하지 않다.
    = 높이를 자동으로 맞춰준다.
    = 비율 설정을 지원(flex-grow)
    = 배치 순서 변경을 지원(flex-direction)
*/
.flex-container {
    display: flex;
    flex-direction: row;
}

        /*
            list 스타일링
            (1) list에는 항목을 표시하는 기호가 있는데 이를 제거한다(list-style)
            (2) ul, li에는 기본 여백이 존재하는데 이를 제거한다(padding, margin).
            (3) .slide-menu에 배치된 1차 메뉴(li)는 flex 형태로 배치한다.
            (4) .slide-menu에 배치된 1차 메뉴(li)에 간격(폭)을 설정한다.
            (5) .slide-menu에 배치된 숨겨진 메뉴(ul)는 position을 absolute로 설정한다.
            (6) 모든 메뉴항목(a)의 배치와 디자인을 변경하고 여백을 설정
            (7) 색상이나 hover 설정등을 구현
            (8) 2차 항목부터는 우측에 표시되도록 설정
        */
        .slide-menu, .slide-menu ul {/*(1)*/
            list-style: none;
        }
        .slide-menu, .slide-menu ul, .slide-menu li {/*(2)*/
            padding:0;
            margin:0;
        }
        .slide-menu {/*(3)*/
            display: flex;
        }
        .slide-menu > li {/*(4)*/
            width:120px;
        }
        .slide-menu li {/*(5)*/
            /*absolute의 기준점 설정을 위하여 position 설정*/
            position:relative;
        }
        .slide-menu ul {/*(5)*/
            position: absolute;
            top:100%;
            left:0;
        }
        .slide-menu li > a {/*(6) */
            display: block;
            width:120px;
            text-align: center;
            text-decoration: none;
            color:black;
            padding:0.75rem;
        }
        /*(7)*/
        .slide-menu , .slide-menu ul{
            background-color: #EEEEEE;
        }
        .slide-menu li:hover > a {
            background-color:#CCCCCC;
            color:black;
        }

        /*(8)*/
        .slide-menu > li > ul ul {
            top:0;
            left:100%;
        }

        .slide-menu > li.flex-right {
            margin-left: auto;
            margin-right:0;
        }

        /* 모든 서브메뉴를 숨겼다가 마우스 올라가면 표시되도록 설정 */
        .slide-menu ul {
            display:none;
        }
        .slide-menu li:hover > ul {
            display:block;
        }
       
/* 오류 메세지는 빨간 글씨로 */        
       .error{
       color:red
       } 
       
/* 링크를 버튼으로 만드는 스타일 */
.link-btn, 
.link-btn-block,
 .form-link-btn
 {
	padding:0.5rem;
	border:1px solid gray;
	text-decoration: none;
	color:gray;
}
.link-btn:hover,
.link-btn-block:hover,
.form-link-btn:hover {
	border-color:black;
	color:black;
}
.link-btn-block{
	display:block;
	width:100%;
}    
.form-link-btn {
	padding:0.85rem 0.75rem;
	font-size:20px;
	font-weight: bold;	
}
.a-link-btn{
	border:1px solid gray;
	text-decoration: none;
	color:gray;
}

 

[ rayout.css ]

더보기
        /*
            웹폰트 설정
            = 사용자의 PC에 설치된 글꼴이 아니라 내가 문서에 글꼴을 첨부시키는 방법
            = 장점 : 모든 사용자의 PC에서 동일한 글꼴이 표시된다.
            = 단점 : 용량 증가로인한 깜빡임, 로딩 증가 현상이 발생
        */
        @font-face{
            font-family: nanumgothic;
            src: url("../font/NanumGothic.ttf");
        }
        
        /* 레이아웃 배치 */
        *{
		font-family: nanumgothic;
		}
        html{
            font-size:16px;
        }
        main{
            width:1000px;
            margin: 2rem auto;
        }
        main > header{
            padding:1rem;
            overflow: hidden;
        }
        main > section{
            padding:1rem;
            min-height: 300px;
            overflow: hidden;
        }
        main > footer{
            padding:1rem;
            overflow: hidden;
        }

 

[ test.css ]

더보기
        /* 테스트용 테두리 */
        div, main, header, nav, section, footer, article, aside, p, span, label{
            border: 1px dotted gray;
        }

 


메인 화면 

상단 화면 고정 페이지

[ header.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%
	String ses = (String) session.getAttribute("ses");	
	boolean login = ses !=null;
	
	String grade = (String)session.getAttribute("grade");
	boolean admin = grade != null && grade.equals("관리자");	
%>
<%
	String root = request.getContextPath();
%>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/css/reset.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/css/commons.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/css/layout.css">
<%--     <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/css/test.css"> --%>
    <style>
        .logo-wrapper {
            width:130px;
            height:40px;
        }
        .logo-wrapper > img {
            width:100%;
            height:100%;
        }
        .title-wrapper {
            flex-grow: 1;
        }
    </style>
</head>
<body>
    <!-- 홈페이지 전체 폭을 설정하는 테두리 영역 -->
    <main>
        <!-- 헤더 영역 -->
        <header>
            <div class="flex-container">
                <div class="logo-wrapper">
                    <img src="<%=request.getContextPath()%>/resource/image/apple.png">
                </div>
                <div class="title-wrapper center">
                    <h1>Apple 공식사이트</h1>
                </div>
            </div>
        </header>

        <!-- 메뉴 영역 -->
        <nav>
            <ul class="slide-menu">
            	<%if(login){ %>
            	<li><a href="<%=request.getContextPath()%>/index.jsp">홈으로</a></li>
            	<li><a href="<%=request.getContextPath()%>/board/list.jsp">게시판</a></li>
            	<li class="flex-right">
            		<a href="#">회원메뉴</a>
            		<ul>
            			<li><a href="<%=request.getContextPath()%>/point/charge.jsp">포인트 충전</a></li>
		            	<li><a href="<%=request.getContextPath()%>/member/mypage.jsp">내정보</a></li>
		            	<li><a href="<%=request.getContextPath()%>/member/logout.txt">로그아웃</a></li>
            		</ul>
            	</li>
            	<%}else{ %>
            	<li><a href="<%=request.getContextPath()%>/index.jsp">홈으로</a></li>
            	<li><a href="<%=request.getContextPath()%>/board/list.jsp">게시판</a></li>
            	<li class="flex-right">
            		<a href="<%=request.getContextPath()%>/member/login.jsp">로그인</a>
            		<ul>
            			<li><a href="<%=request.getContextPath()%>/member/join.jsp">회원가입</a></li>
            		</ul>
            	</li>
            	<%} %>

            	<%if(admin){ %>
            	<li><a href="<%=request.getContextPath()%>/admin/home.jsp">관리메뉴</a></li>
            	<%} %>
            </ul>
        </nav>
        
        <section>

 

하단 화면 고정 페이지

[ footer.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>

</section>
        <!-- 푸터(하단) 영역 -->
        <footer>
            <pre>사업자등록번호 :               | 통신판매업신고번호 :               | 대표이사 :             | 주소 :             | 대표전화 :               | 팩스 :             </pre>
        </footer>

    </main>
</body>
</html>

 

메인화면 보기

[ index.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>
    
<div class="container-600 container-center">
	<div class="row center">
		<h1>내가 만든 홈페이지</h1>
	</div>
	<div class="row">
		<img src="<%=request.getContextPath()%>/resource/image/iphone.jfif" width="100%">
	</div>
</div>   
        
<jsp:include page="/template/footer.jsp"></jsp:include>

 

[ index.jsp ]

 


회원 화면

회원 가입 하기

[ join.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<form action="join.txt" method="post" enctype="multipart/form-data">
	
<div class="container-400 container-center">
	<div class="row center">
		<h1>회원가입</h1>
	</div>
	<div class="row">
		<label>아이디</label>
		<input type="text" name="memberId" required class="form-input">
	</div>
	<div class="row">
		<label>비밀번호</label>
		<input type="password" name="memberPw" required class="form-input">
	</div>
	<div class="row">
		<label>닉네임</label>
		<input type="text" name="memberNick" required class="form-input">
	</div>
	<div class="row">
		<label class="form-block">생년월일</label>
		<input type="date" name="memberBirth" required class="form-input form-inline">
	</div>
	<div class="row">
		<label>이메일</label>
		<input type="email" name="memberEmail" class="form-input">
	</div>
	<div class="row">
		<label>전화번호</label>
		<input type="tel" name="memberPhone" class="form-input">
	</div>
	<div class="row">
		<label>프로필 이미지</label>
		<input type="file" name="attach" accept="image/*" class="form-input">
	</div>
	<div class="row">
		<input type="submit" value="가입" class="form-btn">
	</div>
</div>
</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ join.jsp ]

회원 가입 완료

[ join_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-300 container-center">
	<div class="row center">
		<h2>회원 가입 완료</h2>
	</div>
	<hr>
	<div class="row center">
		<a href="login.jsp" class="link-btn-block">로그인하기</a>	
	</div>
	<div class="row center"> 
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인페이지 보기</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ join_success.jsp ]

 

회원 로그인 하기

[ login.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>


<form action="login.txt" method="post">

<div class="container-400 container-center">
	<div class="row center">
		<h1>회원 로그인</h1>
	</div>
	<div class="row">
		<label>아이디</label>
		<input type="text" name="memberId" required class="form-input" autocomplete="off">	
	</div>
	<div class="row">
		<label>비밀번호</label>
		<input type="password" name="memberPw" required class="form-input">	
	</div>
	<div class="row right">
		<input type="submit" value="로그인" class="form-btn form-inline">	
	</div>
	
	<%if(request.getParameter("error") != null){ %>
	<div class="row center error">
		<h4 class="error">로그인 정보가 일치하지 않습니다</h4>
	</div>
	<%} %>		
</div>

</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ login.jsp ]

회원 내정보 보기

[ mypage.jsp ]

더보기
<%@page import="home.beans.MemberProfileDto"%>
<%@page import="home.beans.MemberProfileDao"%>
<%@page import="home.beans.BoardDto"%>
<%@page import="home.beans.BoardDao"%>
<%@page import="home.beans.TotalHistoryDto"%>
<%@page import="home.beans.TotalHistoryDao"%>
<%@page import="java.text.DecimalFormat"%>
<%@page import="java.text.Format"%>
<%@page import="home.beans.HistoryDto"%>
<%@page import="home.beans.HistoryDao"%>
<%@page import="java.util.List"%>

<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 : 현재 로그인한 회원ID - String memberId --%>
<%
	String memberId = (String) session.getAttribute("ses");
%>

<%-- 처리 : 회원정보(MemberDto) --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);

// 아래와 같이 조회하면 취소 여부를 알 수 없다.
//	HistoryDao historyDao = new HistoryDao();
//	List<HistoryDto> historyList = historyDao.findByMemberId(memberId);

// 새롭게 만든 뷰(total_history)를 이용하여 포인트 이력을 조회
	TotalHistoryDao historyDao = new TotalHistoryDao();
	List<TotalHistoryDto> historyList = historyDao.findByMemberId(memberId);
%>

<%
	//내가 작성한 글 보여주기
	BoardDao boardDao = new BoardDao();
	List<BoardDto> myBoardList = boardDao.searchEquals("board_writer", memberId);
%> 
	
<%
	//프로필 이미지 조회 : 아이디로 해도됨(1-1관계)
	MemberProfileDao memberProfileDao = new MemberProfileDao();
	MemberProfileDto memberProfileDto = memberProfileDao.get(memberId);
%>

<%-- 출력 --%>   
<jsp:include page="/template/header.jsp"></jsp:include>

<style>
	.float-container > .float-item-left:nth-child(1) {
		width:25%;	
		padding:0.5rem;
	}
	.float-container > .float-item-left:nth-child(2) {
		width:75%;
		padding:0.5rem;
	}
	
	.link-btn {
		width:100%;
	}
</style>

<!-- 이 페이지를 2단으로 구현 -->
<div class="container-900 container-center">
	<div class="row">
		<h2>내 정보 보기</h2>
	</div>
	<div class="row float-container">

		<!-- 1단 -->
		<div class="float-item-left">
			<!-- 회원 프로필 이미지 -->
			<div class="row">
				<%if(memberProfileDto == null){ %>
				<img src="https://via.placeholder.com/300x300?text=User" width="100%" class="image image-round image-border">
				<%}else{ %>
				<img src="profile.txt?memberProfileNo=<%=memberProfileDto.getMemberProfileNo()%>" width="100%" class="image image-round image-border">
				<%} %>
			</div>

			<!-- 회원 아이디 -->
			<div class="row center">
				<h2><%=memberDto.getMemberId()%></h2>
			</div>

			<!-- 각종 메뉴들 -->
			<div class="row center">
				<a href="password.jsp" class="link-btn-block">비밀번호 변경</a>
			</div>
			<div class="row center">
				<a href="edit.jsp" class="link-btn-block">개인정보 변경</a>
			</div>
			<div class="row center">
				<a href="check.jsp" class="link-btn-block">회원 탈퇴</a>
			</div>

		</div>

		<!-- 2단 -->
		<div class="float-item-left">

			<!-- 회원 정보 출력 -->
			<div class="row">
				<h2>회원 상세 정보</h2>
			</div>
			<div class="row">
				<table class="table table-stripe">
					<tbody>
						<tr>
							<th width="25%">아이디</th>
							<td><%=memberDto.getMemberId()%></td>
						</tr>
						<tr>
							<th>닉네임</th>
							<td><%=memberDto.getMemberNick()%></td>
						</tr>
						<tr>
							<th>생년월일</th>
							<td><%=memberDto.getMemberBirth()%></td>
						</tr>
						<tr>
							<th>이메일</th>
							<td><%=memberDto.getMemberEmailString()%></td>
						</tr>
						<tr>
							<th>전화번호</th>
							<td><%=memberDto.getMemberPhoneString()%></td>
						</tr>
						<tr>
							<th>가입일시</th>
							<td><%=memberDto.getMemberJoin()%></td>
						</tr>
						<tr>
							<th>포인트</th>
							<td><%=memberDto.getMemberPoint()%></td>
						</tr>
						<tr>
							<th>등급</th>
							<td><%=memberDto.getMemberGrade()%></td>
						</tr>
					</tbody>
				</table>
			</div>

			<!-- 포인트 내역 출력 -->
			<div class="row">
				<h2>포인트 상세 내역</h2>
			</div>

			<div class="row">
				<table class="table table-border table-hover">
					<thead>
						<tr>
							<th>일시</th>
							<th>금액</th>
							<th>메모</th>
							<th>cancel</th>
							<th>취소</th>
						</tr>
					</thead>
					<tbody>
						<%Format f = new DecimalFormat("#,##0"); %>
						<%for(TotalHistoryDto historyDto : historyList) { %>
						<tr>
							<td><%=historyDto.getHistoryTime()%></td>
							<td class="right"><%=f.format(historyDto.getHistoryAmount())%></td>
							<td class="left"><%=historyDto.getHistoryMemo()%></td>
							<td><%=historyDto.getCancel()%></td>
							<td>
								<%if(historyDto.available()){ %>
								<a href="<%=request.getContextPath()%>/point/cancel.txt?historyNo=<%=historyDto.getHistoryNo()%>">취소</a>
								<%} %>
							</td>
						</tr>
						<%} %>
					</tbody>
				</table>
			</div>

			<!-- 내가 작성한 게시글 출력 -->
			<div class="row">
				<h2>내가 작성한 게시글</h2>
			</div>
			<div class="row">
				<table class="table table-border table-hover">
					<thead>
						<tr>
							<th>번호</th>
							<th width="50%">제목</th>
							<th>작성일</th>
							<th>조회수</th>
						</tr>
					</thead>
					<tbody>
						<%for(BoardDto boardDto : myBoardList){ %>
						<tr>
							<td><%=boardDto.getBoardNo()%></td>
							<td class="left">

								<%-- 
									게시글의 제목을 출력하기 전에 차수에 따라 띄어쓰기를 진행한다
									띄어쓰기는 HTML 특수문자인 &nbsp; 을 사용한다.
									답변글에는 reply icon을 추가로 출력한다. 
								--%>
								<%
									//if(boardDto.getBoardDepth() > 0){
									if(boardDto.hasDepth()){ 
								%>
									<%for(int i=0; i < boardDto.getBoardDepth(); i++){ %>
									&nbsp;&nbsp;&nbsp;&nbsp;
									<%} %>

									<img src="<%=request.getContextPath()%>/resource/image/reply.png" width="15" height="15">
								<%} %>

								<a href="<%=request.getContextPath()%>/board/detail.jsp?boardNo=<%=boardDto.getBoardNo()%>">
									<%=boardDto.getBoardTitle()%>
								</a>

								<!-- 제목 뒤에 댓글 개수를 출력한다 -->
								<%
								//if(boardDto.getBoardReply() > 0){
								if(boardDto.isReplyExist()){
								%>
									[<%=boardDto.getBoardReply()%>]
								<%} %>
							</td>
							<td><%=boardDto.getBoardTime()%></td>
							<td><%=boardDto.getBoardRead()%></td>
						</tr>
						<%} %>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

회원 개인정보 변경

[ edit.jsp ]

더보기
<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%-- 입력 : memberId (session) --%>
<%
	String memberId= (String) session.getAttribute("ses");
%>

<%-- 처리 --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>


<form action="edit.txt" method="post">

<div class="container-400 container-center">
	<div class="row center">
		<h2>개인정보 변경</h2>	
	</div>

	<div class="row">
		<label>비밀번호</label>
		<input type="password" name="memberPw" required class="form-input">	
	</div>

	<div class="row">
		<label>닉네임</label>
		<input type="text" name="memberNick" value="<%=memberDto.getMemberNick()%>" required class="form-input">
	</div>
	
	<div class="row">
	<label>생년월일</label>
	<input type="date" name="memberBirth" value="<%=memberDto.getMemberBirthDay()%>" required class="form-input">
	</div>
	
	<div class="row">
	<label>이메일</label>
	<input type="email" name="memberEmail" value="<%=memberDto.getMemberEmailString()%>" class="form-input">
	</div>
	
	<div class="row">
	<label>전화번호</label>
	<input type="tel" name="memberPhone" value="<%=memberDto.getMemberPhoneString()%>" class="form-input">
	</div>		

	<div class="row right">
		<input type="submit" value="변경" class="form-btn form-inline">
	</div>
</div>

</form>

<%if(request.getParameter("error") != null){ %>
	<h4><font color="red">입력하신 정보가 일치하지 않습니다</font></h4>
<%} %>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ edit.jsp ]

회원 개인정보 변경 완료

[ edit_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-300 container-center">
	<div class="row center">
		<h2>개인정보 변경 완료</h2>	
	</div>
	<hr>
	<div class="row center">
		<a href="mypage.jsp" class="link-btn-block">내 정보 보기</a>
	</div>
	<div class="row center">
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인 페이지로</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ edit_success.jsp ]

회원 비밀번호 변경

[ password.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<form action="password.txt" method="post">

<div class="container-400 container-center">
	<div class="row center">
		<h2>비밀번호 변경</h2>
	</div>
	<div class="row">
		<label>현재 비밀번호</label>
		<input type="password" name="memberPw" required class="form-input">	
	</div>
		<div class="row">
		<label>바꿀 비밀번호</label>
		<input type="password" name="changePw" required class="form-input">	
	</div>
	<div class="row right">
		<input type="submit" value="변경" class="form-btn">	
	</div>
	
	<%if(request.getParameter("error") != null){ %>
	<div class="row">
	<h4 class="error">입력하신 정보가 일치하지 않습니다</h4>
	</div>
	<%} %>
</div>

</form>


<jsp:include page="/template/footer.jsp"></jsp:include>

[ password.jsp ]

 

회원 비밀번호 변경 완료

[ password_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-300 container-center">
	<div class="row center">
		<h2>비밀번호 변경 완료</h2>	
	</div>
	<hr>
	<div class="row center">
		<a href="mypage.jsp" class="link-btn-block">내 정보 보기</a>
	</div>
	<div class="row center">
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인 페이지로</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ password_success.jsp ]

회원 탈퇴 비밀번호 확인

[ check.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>
<style>
	.flex-container > .form-input {
		width:75%;
	}
	.flex-container > .form-btn {
		width:25%;
	}
</style>


<form action="quit.txt" method="post">

<div class="container-400 container-center">
	<div class="row center">
		<h2>비밀번호 확인</h2>
	</div>
	<div class="row flex-container">
		<input type="password" name="memberPw" placeholder="비밀번호 입력" required class="form-input">
		<input type="submit" value="회원탈퇴" class="form-btn">
	</div>

	<%if(request.getParameter("error") != null){ %>
	<div class="row center">
		<h4 class="error">입력하신 정보가 일치하지 않습니다</h4>
	</div>
	<%} %>
</div>

</form>


<jsp:include page="/template/footer.jsp"></jsp:include>

[ check.jsp ]

회원 탈퇴 완료

[ quit_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-300 container-center">
	<div class="row center">
		<h2>회원 탈퇴 완료</h2>
	</div>
	<hr>
	<div class="row center">
		그동안 이용해주셔서 감사합니다
	</div>
	<hr>
	<div class="row center">
		<a href="https://www.google.com" class="link-btn-block">구글로 이동</a>
	</div>
	<div class="row center">
		<a href="https://www.naver.com" class="link-btn-block">네이버로 이동</a>
	</div>
	<div class="row center">
		<a href="https://www.github.com" class="link-btn-block">깃허브로 이동</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ quit_success.jsp ]


게시판 화면

회원 게시글 목록 보기

[ list.jsp ]

더보기
<%@page import="home.beans.Pagination"%>
<%@page import="home.beans.BoardDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.BoardDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%
	Pagination pagination = new Pagination(request);
	pagination.calculate(); 	
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<style>
	/* 링크를 버튼으로 만드는 스타일 */
	.link-btn {
		display: inline-block;
		padding:0.5rem;
		border:1px solid gray;
		text-decoration: none;
		color:gray;
	}
	.link-btn:hover {
		border-color:black;
		color:black;
	}
</style>

<div class="container-800 container-center">
	<div class="row center">
		<h2>회원 게시판</h2>
	</div>
	<div class="row center">
		<h6>타인에 대한 무분별한 비판은 제재 대상입니다</h6>
	</div>
	<div class="row right">
		<a href="write.jsp" class="link-btn">글쓰기</a>
	</div>
	<div class="row">
		<table class="table table-border table-hover">
			<thead>
				<tr>
					<th>번호</th>
					<th width="40%">제목</th>
					<th>작성자</th>
					<th>작성일</th>
					<th>조회수</th>
				</tr>
			</thead>
			<tbody>
				<%for(BoardDto boardDto : pagination.getList()){ %>
				<tr>
					<td><%=boardDto.getBoardNo()%></td>
					<td class="left">

						<%
							//if(boardDto.getBoardDepth() > 0){
							if(boardDto.hasDepth()){ 
						%>
							<%for(int i=0; i < boardDto.getBoardDepth(); i++){ %>
							&nbsp;&nbsp;&nbsp;&nbsp;
							<%} %>

							<img src="<%=request.getContextPath()%>/resource/image/reply.png" width="15" height="15">
						<%} %>

						<a href="detail.jsp?boardNo=<%=boardDto.getBoardNo()%>">
							<%=boardDto.getBoardTitle()%>
						</a>

						<!-- 제목 뒤에 댓글 개수를 출력한다 -->
						<%
						//if(boardDto.getBoardReply() > 0){
						if(boardDto.isReplyExist()){
						%>
							[<%=boardDto.getBoardReply()%>]
						<%} %>
					</td>
					<td><%=boardDto.getBoardWriter()%></td>
					<td><%=boardDto.getBoardTime()%></td>
					<td><%=boardDto.getBoardRead()%></td>
				</tr>
				<%} %>
			</tbody>
		</table>
	</div>
	
	<div class="row right">
		<a href="write.jsp" class="link-btn">글쓰기</a>
	</div>
	<div class="row pagination">
		<!-- 이전 버튼 -->
		<%if(pagination.isPreviousAvailable()){ %>
			<%if(pagination.isSearch()){ %>
				<!-- 검색용 링크 -->
				<a href="list.jsp?column=<%=pagination.getColumn()%>&keyword=<%=pagination.getKeyword()%>&p=<%=pagination.getPreviousBlock()%>">&lt;</a>
			<%} else { %>
				<!-- 목록용 링크 -->
				<a href="list.jsp?p=<%=pagination.getPreviousBlock()%>">&lt;</a>
			<%} %>
		<%} else { %>
			 <a>&lt;</a>
		<%} %> 

		<!-- 페이지 네비게이터 -->
		<%for(int i = pagination.getStartBlock(); i <= pagination.getRealLastBlock(); i++){ %>
			<%if(pagination.isSearch()){ %>
			<!-- 검색용 링크 -->
			<a href="list.jsp?column=<%=pagination.getColumn()%>&keyword=<%=pagination.getKeyword()%>&p=<%=i%>"><%=i%></a>
			<%}else{ %>
			<!-- 목록용 링크 -->
			<a href="list.jsp?p=<%=i%>"><%=i%></a>
			<%} %>
		<%} %>

		<!-- 다음 -->
		<%if(pagination.isNextAvailable()){ %>
			<%if(pagination.isSearch()){ %>
				<!-- 검색용 링크 -->
				<a href="list.jsp?column=<%=pagination.getColumn()%>&keyword=<%=pagination.getKeyword()%>&p=<%=pagination.getNextBlock()%>">&gt;</a>
			<%} else { %>
				<!-- 목록용 링크 -->
				<a href="list.jsp?p=<%=pagination.getNextBlock()%>">&gt;</a>
			<%} %> 
		<%} else {%>
			<a>&gt;</a>
		<%} %>
	</div>

	<!-- 검색창 -->
	<div class="row center">
		<form action="list.jsp" method="get">

			<select name="column" class="form-input form-inline">
				<%if(pagination.columnIs("board_title")){ %>
				<option value="board_title" selected>제목</option>
				<%}else{ %>
				<option value="board_title">제목</option>
				<%} %>

				<%if(pagination.columnIs("board_content")){ %>
				<option value="board_content" selected>내용</option>
				<%}else{ %>
				<option value="board_content">내용</option>
				<%} %>

				<%if(pagination.columnIs("board_writer")){ %>
				<option value="board_writer" selected>작성자</option>
				<%}else{ %>
				<option value="board_writer">작성자</option>
				<%} %>

			</select>

			<input type="search" name="keyword" placeholder="검색어 입력" required 
					value="<%=pagination.getKeywordString()%>" class="form-input form-inline" autocomplete="off">

			<input type="submit" value="검색" class="form-btn form-inline">

		</form>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ list.jsp ]

회원 게시글 상세보기

[ detail.jsp ]

더보기
<%@page import="home.beans.BoardFileDto"%>
<%@page import="home.beans.BoardFileDao"%>
<%@page import="home.beans.ReplyDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.ReplyDao"%>
<%@page import="java.util.HashSet"%>
<%@page import="java.util.Set"%>
<%@page import="home.beans.BoardDto"%>
<%@page import="home.beans.BoardDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%-- 번외 : 수정 버튼을 눌렀을 때 처리되도록 구현하는 스크립트(나중에 배움) --%>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
	$(function(){
		$(".view-row").find(".edit-btn").click(function(){
			$(this).parents("tr.view-row").hide();
			$(this).parents("tr.view-row").next("tr.edit-row").show();
		});
		
		$(".edit-row").find(".edit-cancel-btn").click(function(){
			$(this).parents("tr.edit-row").hide();
			$(this).parents("tr.edit-row").prev("tr.view-row").show();
		});
		
		$(".edit-row").hide();
	});
</script>     
    
<%-- 입력 : 게시글번호(boardNo) --%>
<%
	int boardNo = Integer.parseInt(request.getParameter("boardNo"));
%>

<%-- 처리 --%>
<%
String memberId = (String)session.getAttribute("ses"); 
BoardDao boardDao = new BoardDao();

/**
조회수 중복 방지에 대한 시나리오
1. 본인 글에 대한 조회 수 증가를 방지한다.
2. 한 번 읽은 글에 대한 추가 조회 수 증가를 방지한다.
	= 세션에 사용자가 읽은 글 번호를 추가하여 관리하도록 구현
3. IP를 이용한 조회 수 증가를 방지한다.
	= 접속자 IP 확인 명령을 통한 IP 비교
	= 사용자에게 반드시 이용 고지를 해야함(IP는 개인정보)
	= 전체 사용자에게 영항을 줄 수 있는 저장소가 필요
*/

//1. boardViewedNo 라는 이름의 저장소를 세션에서 꺼내어 본다.
Set<Integer> boardViewedNo = (Set<Integer>)session.getAttribute("boardViewedNo");

//2. boardViewedNo 가 null 이면 "처음 글을 읽는 상태"임을 말하므로 저장소를 신규로 생성
if(boardViewedNo == null){
boardViewedNo = new HashSet<>();
//System.out.println("처음으로 글을 읽기 시작했습니다(저장소 생성)");
}

//3. 현재 글 번호를 저장소에 추가해본다
//3-1. 추가가 된다면 이 글은 처음 읽는 글
//3-2. 추가가 안된다면 이 글은 두 번 이상 읽은 글
if (boardViewedNo.add(boardNo)) {//처음 읽은 글인 경우
boardDao.readUp(boardNo, memberId);//조회수 증가(남에 글일때만)
//System.out.println("이 글은 처음 읽는 글입니다");
} else {
//System.out.println("이 글은 읽은 적이 있습니다");
}

//System.out.println("저장소 : " + boardViewedNo);

//4. 저장소 갱신
session.setAttribute("boardViewedNo", boardViewedNo);

BoardDto boardDto = boardDao.get(boardNo);//단일조회

//본인 글인지 아닌지를 판정하는 변수
//boolean owner = 세션의ses 값과 게시글 작성자가 같은가?;

boolean owner = boardDto.getBoardWriter().equals(memberId);
%>

<%
	//현재 게시글에 대한 댓글을 조회
	ReplyDao replyDao = new ReplyDao();
	List<ReplyDto> replyList = replyDao.list(boardNo);
%>

<%
	//현재 게시글에 대한 파일정보를 조회
	BoardFileDao boardFileDao = new BoardFileDao();
	List<BoardFileDto> boardFileList = boardFileDao.find(boardNo);//파일이 여러 개일 경우
	//BoardFileDto boardFileDto = boardFileDao.find2(boardNo);//파일이 한 개일 경우
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include> 
<style>
	.flex-container > .reply-write-wrapper {
		width:80%;
	}
	.flex-container > .reply-send-wrapper {
		flex-grow:1;
	}
	.flex-container > .reply-send-wrapper > .form-btn,
	.flex-container > .reply-send-wrapper > .form-link-btn {
		width:100%;
		height:100%;
		display: flex;
		align-items:center;
		justify-content:center;
	}
</style>

<div class="container-800 container-center">

	<div class="row center">
		<h2><%=boardDto.getBoardNo()%>번 게시글</h2>		
	</div>

	<div class="row">
		<hr>
		<h3><%=boardDto.getBoardTitle()%></h3>
		<hr>
	</div>

	<div class="row">
		등록일 : <%=boardDto.getBoardTime()%>
		|
		작성자 : <%=boardDto.getBoardWriter()%>
		|
		조회수 : <%=boardDto.getBoardRead()%>
	</div>

	<div class="row" style="min-height:250px;">
		<pre><%=boardDto.getBoardContent()%></pre>
	</div>

	<div class="row right">
		<a href="write.jsp" class="link-btn">글쓰기</a>
		<a href="write.jsp?boardSuperno=<%=boardDto.getBoardNo()%>" class="link-btn">답글쓰기</a>
		<a href="list.jsp" class="link-btn">목록보기</a>

		<%if(owner){ %>
		<a href="edit.jsp?boardNo=<%=boardDto.getBoardNo()%>" class="link-btn">수정하기</a>
		<a href="delete.txt?boardNo=<%=boardDto.getBoardNo()%>" class="link-btn">삭제하기</a>
		<%} %>
	</div>

	<hr>

	<!-- 댓글 작성 영역 -->
	<form action="./reply/insert.txt" method="post">
	<input type="hidden" name="boardNo" value="<%=boardDto.getBoardNo()%>">

	<div class="row flex-container">
		<div class="reply-write-wrapper">
			<textarea name="replyContent" required rows="4" class="form-input"></textarea>
		</div>
		<div class="reply-send-wrapper">
			<input type="submit" value="댓글작성" class="form-btn">
		</div>
	</div>

	</form>

	<!-- 댓글 목록 -->
	<%if(replyList.isEmpty()){ %>	
	<div class="row center">
		<h3>작성된 댓글이 없습니다</h3>
	</div>
	<%} else { %>
	<div class="row center">
		<table class="table table-stripe">
			<tbody>
				<%for(ReplyDto replyDto : replyList){ %>
				<%
					//본인 댓글인지 판정 : 세션의 회원아이디와 댓글의 작성자를 비교
					//작성자 댓글인지 판정 : 게시글 작성자와 댓글의 작성자를 비교
					boolean myReply = memberId.equals(replyDto.getReplyWriter());
					boolean ownerReply = boardDto.getBoardWriter().equals(replyDto.getReplyWriter());
				%>
				<tr class="view-row">
					<td width="20%">
						<%=replyDto.getReplyWriter()%>
						<%-- 게시글 작성자의 댓글에는 표시 --%>
						<%if(ownerReply){ %>
							<span class="error">(작성자)</span>
						<%} %>

						<br>
						(<%=replyDto.getReplyFullTime()%>)
					</td>
					<td class="left">
						<pre><%=replyDto.getReplyContent()%></pre>
					</td>
					<td width="20%">
					<%-- 현재 사용자가 작성한 글에만 수정, 삭제를 표시 --%>
					<%if(myReply){ %>
					<a class="edit-btn link-btn">수정</a>
					<a href="reply/delete.txt?boardNo=<%=replyDto.getBoardNo()%>&replyNo=<%=replyDto.getReplyNo()%>" class="link-btn">삭제</a>
					<%} %>
					</td>
				</tr>

				<%-- 본인 글일 경우 수정을 위한 공간을 추가적으로 생성 --%>
				<%if(myReply){ %>
				<tr class="edit-row">
					<td colspan="3">
						<form action="reply/edit.txt" method="post">
						<input type="hidden" name="replyNo" value="<%=replyDto.getReplyNo()%>">
							<input type="hidden" name="boardNo" value="<%=replyDto.getBoardNo()%>">

						<div class="flex-container">
							<div class="reply-write-wrapper">
								<textarea name="replyContent" required rows="4" cols="80" class='form-input'><%=replyDto.getReplyContent()%></textarea>
							</div>
							<div class="reply-send-wrapper">
								<input type="submit" value="수정" class="form-btn">
							</div>
							<div class="reply-send-wrapper">
								<a class="edit-cancel-btn form-link-btn">취소</a>
							</div>
						</div>

						</form>
					</td>
				</tr>
				<%} %>

				<%} %>
			</tbody>
		</table>
	</div>	
	<%} %>

	<%-- 첨부파일이 있다면 첨부파일을 다운받을 수 있는 링크를 제공 --%>
	<%if(!boardFileList.isEmpty()){ %>
	<%for(BoardFileDto boardFileDto : boardFileList){ %>
		<div class="row">
			<h3>
				<%=boardFileDto.getBoardFileUploadname() %>
				(<%=boardFileDto.getBoardFileSize()%> bytes)
				<a href="file/download.txt?boardFileNo=<%=boardFileDto.getBoardFileNo()%>">
					다운로드
				</a>
			</h3>
		</div>
		<%} %>
	<%} %>	

</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ detail.jsp ]

회원 게시글 수정

[ edit.jsp ]

더보기
<%@page import="home.beans.BoardDto"%>
<%@page import="home.beans.BoardDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 --%>
<%
	int boardNo = Integer.parseInt(request.getParameter("boardNo"));
%>

<%-- 처리 --%>
<%
	BoardDao boardDao = new BoardDao();
	BoardDto boardDto = boardDao.get(boardNo);
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<form action="edit.txt" method="post">
<input type="hidden" name="boardNo" value="<%=boardDto.getBoardNo()%>">

<div class="container-800 container-center">
	<div class="row center">
		<h2>게시글 수정</h2>	
	</div>

	<div class="row">
		<label>제목</label>
		<input type="text" name="boardTitle" required value="<%=boardDto.getBoardTitle()%>" class="form-input">
	</div>

	<div class="row">
		<label>내용</label>
		<textarea name="boardContent" required 
					rows="10" class="form-input"><%=boardDto.getBoardContent()%></textarea>
	</div>

	<div class="row right">
		<a href="list.jsp" class="form-link-btn">목록</a>
		<input type="submit" value="수정" class="form-btn form-inline">
	</div>
</div>

</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ edit.jsp ]

회원 게시글 작성

[ write.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 : 답글일 경우에는 boardSuperno라는 값이 전달된다. --%>
<%
	String boardSuperno = request.getParameter("boardSuperno");
%>

<%-- 처리 --%>
<%
	boolean answer = boardSuperno != null;
	String title = answer ? "답글 작성" : "새글 작성";
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<form action="write.txt" method="post" enctype="multipart/form-data">

<%-- 답글일 경우에는 반드시 "상위글번호(boardSuperno)" 를 처리페이지로 전송해야 한다 --%>
<%if(answer){ %>
<input type="hidden" name="boardSuperno" value="<%=boardSuperno%>">
<%} %>

<div class="container-800 container-center">

	<!-- 제목 -->
	<div class="row">
		<h2><%=title%></h2>		
	</div>

	<div class="row">
		<label>제목</label>
		<input type="text" name="boardTitle" required class="form-input">
	</div>

	<div class="row">
		<label>내용</label>
		<textarea name="boardContent" required rows="10" class="form-input"></textarea>
	</div>

	<div class="row">
		<label class="form-block">첨부파일</label>
		<input type="file" name="attach" class="form-input form-inline">
	</div>

	<div class="row right">
		<a href="list.jsp" class="form-link-btn">목록</a> 
		<input type="submit" value="등록" class="form-btn form-inline">
	</div>

</div>

</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ write.jsp ]


회원 포인트 충전

[ charge.jsp ]

더보기
<%@page import="home.beans.CoinDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.CoinDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%-- 입력 : 없음 --%>

<%-- 처리 : 포인트상품 목록 --%>    
<%
	CoinDao coinDao = new CoinDao();
	List<CoinDto> list = coinDao.list();
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-400 container-center">

	<div class="row center">
		<h2>포인트 충전</h2>
	</div>

	<div class="row">
		<hr>
		<h3>원하시는 상품을 선택하세요</h3>
		<hr>
	</div>

	<form action="charge.txt" method="post">
	<table class="table table-stripe">
		<thead>
			<tr>
				<th>선택</th>
				<th>상품명</th>
				<th>Point</th>
			</tr>
		</thead>
		<tbody>
			<%for(CoinDto coinDto : list){ %>
			<tr>
				<td><input type="radio" name="coinNo" value="<%=coinDto.getCoinNo()%>"></td>
				<td class="left"><%=coinDto.getCoinName()%></td>
				<td>(<%=coinDto.getCoinAmount()%> point)</td>
			</tr>
			<%} %>
		</tbody>
	</table>

	<div class="row">
		<input type="submit" value="충전" class="form-btn">
	</div>
	</form>		

</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ charge.jsp ]

 

회원 포인트 충전 완료

[ charge_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-500 container-center">
	<div class="row center">
		<h2>포인트 충전 완료</h2>	
	</div>
	<hr>
	<div class="row center">
		<a href="../member/mypage.jsp" class="link-btn-block">내 정보 보기</a>
	</div>
	<div class="row center">
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인 페이지로</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ charge_success.jsp ]

 

회원 포인트 취소 완료

[ cancel_success.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-500 container-center">
	<div class="row center">
		<h2>결제 취소가 완료되었습니다</h2>	
	</div>
	<hr>
	<div class="row center">
		<a href="../member/mypage.jsp" class="link-btn-block">내 정보 보기</a>
	</div>
	<div class="row center">
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인 페이지로</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ cancel_success.jsp ]

회원 포인트 취소 실패

[ cancel_fail.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-500 container-center">
	<div class="row center">
		<h2>결제 취소 실패</h2>	
	</div>

	<div class="row center">
		<h5>이미 취소된 내역입니다</h5>
	</div>
	<hr>
	<div class="row center">
		<a href="../member/mypage.jsp" class="link-btn-block">내 정보 보기</a>
	</div>
	<div class="row center">
		<a href="<%=request.getContextPath()%>" class="link-btn-block">메인 페이지로</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ cancel_fail.jsp ]

 


관리자 화면

관리자 메인 화면 보기

[ home.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-400 container-center">
	<div class="row center">
		<h2>관리자 메인 페이지</h2>	
	</div>
	<hr>
	<div class="row center">
		<a href="./member/list.jsp" class="link-btn-block">회원 관리</a>
	</div>
	<div class="row center">
		<a href="./point/list.jsp" class="link-btn-block">포인트상품 관리</a>
	</div>
	<div class="row center">
		<a href="statistics.jsp" class="link-btn-block">사이트 통계</a>
	</div>
</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ home.jsp ]

관리자 포인트 통계 보기

[ statistics.jsp ]

더보기
<%@page import="java.text.DecimalFormat"%>
<%@page import="java.text.Format"%>
<%@page import="home.beans.GroupPointVO"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>


<%
	MemberDao memberDao = new MemberDao();
	List<GroupPointVO> list = memberDao.pointByGrade();
	
	Format f = new DecimalFormat("#,##0");
%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-300 container-center">
	<div class="row center">
		<h2>사이트 통계</h2>		
	</div>
	<hr>
	<div class="row center">
		<h3>회원계층별 포인트 보유량</h3>		
	</div>
	<div class="row">
		<table class="table table-stripe table-border">
			<thead>
				<tr>
					<th>회원그룹</th>
					<th>포인트 보유량</th>
				</tr>
			</thead>
			<tbody>
				<%for(GroupPointVO vo : list){ %>
				<tr>
					<td><%=vo.getMemberGrade()%></td>
					<td class="right"><%=f.format(vo.getTotal())%></td>
				</tr>
				<%} %>
			</tbody>
		</table>
	</div>
</div>


<jsp:include page="/template/footer.jsp"></jsp:include>

[ statistics.jsp ]


관리자 회원 리스트 보기

[ list.jsp ]

더보기
<%@page import="home.beans.MemberDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 : 검색분류, 검색어 --%>
<%
	String column = request.getParameter("column");
	String keyword = request.getParameter("keyword");
%>

<%-- 처리 : 목록 조회 or 검색 --%>
<%
	boolean search = column != null && !column.equals("") && keyword != null && !keyword.equals("");
	MemberDao memberDao = new MemberDao();
	List<MemberDto> list;
	if(search){//검색
		list = memberDao.search(column, keyword);	
	}
	else{
		list = memberDao.list();
	}
	
	//삼항 연산 : if문 축소버전 - (조건) ? 참 : 거짓;
	String title = search ? "회원 검색" : "회원 목록";
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-900 container-center">

	<!-- 페이지 제목 -->
	<div class="row center">
		<h2><%=title%></h2>		
	</div>

	<!-- 검색창 -->
	<div class="row center">
		<form action="list.jsp" method="get">
			<select name="column" class="form-input form-inline">
				<%if(column != null && column.equals("member_id")){ %>
				<option value="member_id" selected>아이디</option>
				<%} else { %>
				<option value="member_id">아이디</option>
				<%} %>

				<%if(column != null && column.equals("member_nick")){ %>
				<option value="member_nick" selected>닉네임</option>
				<%} else { %>
				<option value="member_nick">닉네임</option>
				<%} %>

				<%if(column != null && column.equals("member_email")){ %>
				<option value="member_email" selected>이메일</option>
				<%} else { %>
				<option value="member_email">이메일</option>
				<%} %>

				<%if(column != null && column.equals("member_phone")){ %>
				<option value="member_phone" selected>전화번호</option>
				<%} else { %>
				<option value="member_phone">전화번호</option>
				<%} %>

				<%if(column != null && column.equals("member_grade")){ %>
				<option value="member_grade" selected>등급</option>
				<%} else { %>
				<option value="member_grade">등급</option>
				<%} %>

			</select>
			<input type="search" name="keyword" placeholder="검색어 입력" required value="<%=keyword == null ? "" : keyword%>" class="form-input form-inline">
			<input type="submit" value="검색" class="form-btn form-inline">
		</form>	
	</div>

	<!-- 데이터 표시 영역 -->
	<div class="row center">
		<%if(list.isEmpty()){ %>
		<h3>데이터가 존재하지 않습니다</h3>
		<%}else{ %>
		<!-- 테이블 -->
		<table class="table table-border table-hover">
			<thead>
				<tr>
					<th>아이디</th>
					<th>닉네임</th>
					<th>이메일</th>
					<th>전화번호</th>
					<th>등급</th>
					<th>메뉴</th>
				</tr>
			</thead>
			<tbody align="center">
				<%for(MemberDto memberDto : list){ %>
				<tr>
					<td><%=memberDto.getMemberId()%></td>
					<td><%=memberDto.getMemberNick()%></td>
					<td><%=memberDto.getMemberEmailString()%></td>
					<td><%=memberDto.getMemberPhoneString()%></td>
					<td><%=memberDto.getMemberGrade()%></td>
					<td>
						<a href="detail.jsp?memberId=<%=memberDto.getMemberId()%>" class="a-link-btn">상세</a>
						<a href="edit.jsp?memberId=<%=memberDto.getMemberId()%>" class="a-link-btn">수정</a>
						<a href="quit.txt?memberId=<%=memberDto.getMemberId()%>" class="a-link-btn">탈퇴</a>
					</td>
				</tr>
				<%} %>
			</tbody>
		</table>
		<%} %>
	</div>

</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ list.jsp ]

관리자 회원 상세 보기

[ detail.jsp ]

더보기
<%@page import="home.beans.BoardDto"%>
<%@page import="home.beans.BoardDao"%>
<%@page import="home.beans.MemberProfileDto"%>
<%@page import="home.beans.MemberProfileDao"%>
<%@page import="home.beans.TotalHistoryDto"%>
<%@page import="home.beans.TotalHistoryDao"%>
<%@page import="java.text.DecimalFormat"%>
<%@page import="java.text.Format"%>
<%@page import="home.beans.HistoryDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.HistoryDao"%>
<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 : 상세조회 할 회원 ID - String memberId --%>
<%
	String memberId = request.getParameter("memberId");
%>
<%-- 처리 : 회원정보(MemberDto) --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);
	
// 	아래와 같이 조회하면 취소 여부를 알 수 없다.
// 	HistoryDao historyDao = new HistoryDao();
// 	List<HistoryDto> historyList = historyDao.findByMemberId(memberId);
// 	새롭게 만든 뷰(total_history)를 이용하여 포인트 이력을 조회

	TotalHistoryDao historyDao = new TotalHistoryDao();
	List<TotalHistoryDto> historyList = historyDao.findByMemberId(memberId);
	
	MemberProfileDao memberProfileDao = new MemberProfileDao();
	MemberProfileDto memberProfileDto = memberProfileDao.get(memberId);
	
	BoardDao boardDao = new BoardDao();
	List<BoardDto> boardList = boardDao.searchEquals("board_writer", memberId);
	Format f = new DecimalFormat("#,##0"); 
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<style>
	.float-container > .float-item-left:nth-child(1) {
		width:25%;	
		padding:0.5rem;
	}
	.float-container > .float-item-left:nth-child(2) {
		width:75%;
		padding:0.5rem;
	}
	
	.link-btn {
		width:100%;
	}
</style>

<!-- 이 페이지를 2단으로 구현 -->
<div class="container-900 container-center">
	<div class="row">
		<h2>회원 상세 정보</h2>
	</div>
	<div class="row float-container">

		<!-- 1단 -->
		<div class="float-item-left">
			<!-- 회원 프로필 이미지 -->
			<div class="row">
				<%if(memberProfileDto == null){ %>
				<img src="https://via.placeholder.com/300x300?text=User" width="100%" class="image image-round image-border">
				<%}else{ %>
				<img src="profile.txt?memberProfileNo=<%=memberProfileDto.getMemberProfileNo()%>" width="100%" class="image image-round image-border">
				
				<%} %>
			</div>

			<!-- 회원 아이디 -->
			<div class="row center">
				<h2><%=memberDto.getMemberId()%></h2>
			</div>

			<!-- 각종 메뉴들 -->
			<div class="row center">
				<a href="edit.jsp?memberId=<%=memberDto.getMemberId()%>" class="link-btn-block">회원 정보 변경</a>
			</div>
			<div class="row center">
				<a href="quit.txt?memberId=<%=memberDto.getMemberId()%>" class="link-btn-block">회원 강제 탈퇴</a>
			</div>

		</div>

		<!-- 2단 -->
		<div class="float-item-left">

			<!-- 회원 정보 출력 -->
			<div class="row">
				<h2>회원 상세 정보</h2>
			</div>
			<div class="row">
				<table class="table table-stripe">
					<tbody>
						<tr>
							<th width="25%">아이디</th>
							<td><%=memberDto.getMemberId()%></td>
						</tr>
						<tr>
							<th>닉네임</th>
							<td><%=memberDto.getMemberNick()%></td>
						</tr>
						<tr>
							<th>생년월일</th>
							<td><%=memberDto.getMemberBirth()%></td>
						</tr>
						<tr>
							<th>이메일</th>
							<td><%=memberDto.getMemberEmailString()%></td>
						</tr>
						<tr>
							<th>전화번호</th>
							<td><%=memberDto.getMemberPhoneString()%></td>
						</tr>
						<tr>
							<th>가입일시</th>
							<td><%=memberDto.getMemberJoin()%></td>
						</tr>
						<tr>
							<th>포인트</th>
							<td><%=memberDto.getMemberPoint()%></td>
						</tr>
						<tr>
							<th>등급</th>
							<td><%=memberDto.getMemberGrade()%></td>
						</tr>
					</tbody>
				</table>
			</div>

			<!-- 포인트 내역 출력 -->
			<div class="row">
				<h2>포인트 상세 내역</h2>
			</div>

			<div class="row">
				<table class="table table-border table-hover">
					<thead>
						<tr>
							<th>일시</th>
							<th>금액</th>
							<th>메모</th>
							<th>cancel</th>
							<th>취소</th>
						</tr>
					</thead>
					<tbody>
						<%for(TotalHistoryDto historyDto : historyList) { %>
						<tr>
							<td><%=historyDto.getHistoryTime()%></td>
							<td class="right"><%=f.format(historyDto.getHistoryAmount())%></td>
							<td class="left"><%=historyDto.getHistoryMemo()%></td>
							<td><%=historyDto.getCancel()%></td>
							<td>
								<%if(historyDto.available()){ %>
								<a href="<%=request.getContextPath()%>/point/cancel.txt?historyNo=<%=historyDto.getHistoryNo()%>">취소</a>
								<%} %>
							</td>
						</tr>
						<%} %>
					</tbody>
				</table>
			</div>

			<!-- 회원이 작성한 게시글 출력 -->
			<div class="row">
				<h2>회원이 작성한 게시글</h2>
			</div>
			<div class="row">
				<table class="table table-border table-hover">
					<thead>
						<tr>
							<th>번호</th>
							<th width="50%">제목</th>
							<th>작성일</th>
							<th>조회수</th>
						</tr>
					</thead>
					<tbody>
						<%for(BoardDto boardDto : boardList){ %>
						<tr>
							<td><%=boardDto.getBoardNo()%></td>
							<td class="left">

								<%-- 
									게시글의 제목을 출력하기 전에 차수에 따라 띄어쓰기를 진행한다
									띄어쓰기는 HTML 특수문자인 &nbsp; 을 사용한다.
									답변글에는 reply icon을 추가로 출력한다. 
								--%>
								<%
									//if(boardDto.getBoardDepth() > 0){
									if(boardDto.hasDepth()){ 
								%>
									<%for(int i=0; i < boardDto.getBoardDepth(); i++){ %>
									&nbsp;&nbsp;&nbsp;&nbsp;
									<%} %>

									<img src="<%=request.getContextPath()%>/resource/image/reply.png" width="15" height="15">
								<%} %>

								<a href="<%=request.getContextPath()%>/board/detail.jsp?boardNo=<%=boardDto.getBoardNo()%>">
									<%=boardDto.getBoardTitle()%>
								</a>

								<!-- 제목 뒤에 댓글 개수를 출력한다 -->
								<%
								//if(boardDto.getBoardReply() > 0){
								if(boardDto.isReplyExist()){
								%>
									[<%=boardDto.getBoardReply()%>]
								<%} %>
							</td>
							<td><%=boardDto.getBoardTime()%></td>
							<td><%=boardDto.getBoardRead()%></td>
						</tr>
						<%} %>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
<jsp:include page="/template/footer.jsp"></jsp:include>

[ detail.jsp ]

관리자 회원 수정 하기

[ edit.jsp ]

더보기

 

<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>


<%-- 입력 : memberId (parameter) --%>
<%
	String memberId = request.getParameter("memberId");
%>

<%-- 처리 --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<form action="edit.txt" method="post">
<input type="hidden" name="memberId" required value="<%=memberDto.getMemberId()%>">

<div class="container-400 container-center">
	<div class="row center">
		<h2>회원 정보 수정</h2>
	</div>

	<div class="row">
		<label>아이디</label>
		<input type="text" disabled value="<%=memberDto.getMemberId()%>" class="form-input">
	</div>
	<div class="row">
		<label>닉네임</label>
		<input type="text" name="memberNick" required value="<%=memberDto.getMemberNick()%>" class="form-input">
	</div>
	<div class="row">
		<label>생년월일</label>
		<input type="date" name="memberBirth" required value="<%=memberDto.getMemberBirthDay()%>" class="form-input">
	</div>
	<div class="row">
		<label>이메일</label>
		<input type="email" name="memberEmail" value="<%=memberDto.getMemberEmailString()%>" class="form-input">
	</div>
	<div class="row">
		<label>전화번호</label>
		<input type="tel" name="memberPhone" value="<%=memberDto.getMemberPhoneString()%>" class="form-input">
	</div>
	<div class="row">
		<label>가입일</label>
		<input type="date" value="<%=memberDto.getMemberJoin()%>" disabled class="form-input">
	</div>
	<div class="row">
		<label>포인트</label>
		<input type="number" name="memberPoint" value="<%=memberDto.getMemberPoint()%>" class="form-input">
	</div>
	<div class="row">
		<label class="form-block">등급</label>
		<select name="memberGrade" class="form-input form-inline">
			<%if(memberDto.getMemberGrade().equals("정회원")){ %>
			<option>준회원</option>
			<option selected>정회원</option>
			<option>우수회원</option>
			<%}else if(memberDto.getMemberGrade().equals("우수회원")){ %>
			<option>준회원</option>
			<option>정회원</option>
			<option selected>우수회원</option>
			<%}else { %>
			<option selected>준회원</option>
			<option>정회원</option>
			<option>우수회원</option>
			<%} %>
		</select>
	</div>

	<div class="row">
		<input type="submit" value="수정" class="form-btn">
	</div>
	</div>

</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ edit.jsp ]

 


관리자 포인트 상품 보기

[ list.jsp ]

더보기
<%@page import="java.text.DecimalFormat"%>
<%@page import="java.text.Format"%>
<%@page import="home.beans.CoinDto"%>
<%@page import="java.util.List"%>
<%@page import="home.beans.CoinDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
   
<%
	CoinDao coinDao = new CoinDao();
	List<CoinDto> list = coinDao.list();
%>

<jsp:include page="/template/header.jsp"></jsp:include>

<div class="container-600 container-center">

	<div class="row center">
		<h2>포인트 상품 관리</h2>	
	</div>

	<div class="row right">
		<a href="add.jsp" class="link-btn">상품등록</a>
	</div>

	<div class="row">
		<table class="table table-border table-hover">
			<thead>
				<tr>
					<th>상품번호</th>
					<th>상품이름</th>
					<th>상품금액</th>
					<th>관리메뉴</th>
				</tr>
			</thead>
			<tbody align="center">
				<%Format f = new DecimalFormat("#,##0"); %>
				<%for(CoinDto coinDto : list){ %>
				<tr>
					<td><%=coinDto.getCoinNo()%></td>
					<td class="left"><%=coinDto.getCoinName()%></td>
					<td class="right"><%=f.format(coinDto.getCoinAmount())%></td>
					<td> 
						<a href="./edit.jsp?coinNo=<%=coinDto.getCoinNo()%>" class="a-link-btn">수정</a>
						<a href="./delete.txt?coinNo=<%=coinDto.getCoinNo()%>" class="a-link-btn">삭제</a>
					</td>
				</tr>
				<%} %>
			</tbody>
		</table>
	</div>

	<div class="row right">
		<a href="add.jsp" class="link-btn">상품등록</a>
	</div>

</div>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ list.jsp ]

관리자 포인트 상품 추가 하기

[ add.jsp ]

더보기
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>
<style>
	.link-btn {
		padding:0.75rem;
		font-size:20px;
	}
</style>

<form action="add.txt" method="post">
<div class="container-400 container-center">
	<div class="row center">
		<h2>포인트 상품 등록</h2>		
	</div>

	<div class="row">
		<label>상품이름</label>
		<input type="text" name="coinName" required class="form-input">
	</div>

	<div class="row">
		<label>상품금액</label>
		<input type="number" name="coinAmount" required class="form-input">
	</div>

	<div class="row right">
		<a href="list.jsp" class="link-btn">목록</a>
		<input type="submit" value="등록" class="form-btn form-inline">	
	</div>
</div>
</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

 

[ add.jsp ]

관리자 포인트 상품 수정 하기

[ edit.jsp ]

더보기
<%@page import="home.beans.CoinDto"%>
<%@page import="home.beans.CoinDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 --%>    
<%
	int coinNo = Integer.parseInt(request.getParameter("coinNo"));
%>
<%-- 처리 --%>
<%
	CoinDao coinDao = new CoinDao();
	CoinDto coinDto = coinDao.get(coinNo);
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<style>
	.link-btn {
		padding:0.75rem;
		font-size:20px;
	}
</style>



<form action="edit.txt" method="post">
<input type="hidden" name="coinNo" value="<%=coinDto.getCoinNo()%>">

<div class="container-400 container-center">

	<div class="row center">
		<h2>포인트 상품 수정</h2>
	</div>

	<div class="row">
		<label>상품이름</label>
		<input type="text" name="coinName" value="<%=coinDto.getCoinName()%>" class="form-input">
	</div>

	<div class="row">
		<label>상품금액</label>
		<input type="number" name="coinAmount" value="<%=coinDto.getCoinAmount()%>" class="form-input">
	</div>

	<div class="row right">
		<a href="list.jsp" class="link-btn">목록</a>
		<input type="submit" value="수정" class="form-btn form-inline">	
	</div>
</div>
</form>

<jsp:include page="/template/footer.jsp"></jsp:include>

[ edit.jsp ]