Skip to content

Commit

Permalink
fix: 마이페이지 헤더 수정 및 디렉토리 변경
Browse files Browse the repository at this point in the history
  • Loading branch information
fernandokkang committed Apr 8, 2024
1 parent ca39627 commit f5e6b2f
Show file tree
Hide file tree
Showing 2 changed files with 170 additions and 170 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ public String myPage(@RequestParam(defaultValue = "1") int boardPage,@RequestPar
model.addAttribute("commentPage", commentPageResult);
model.addAttribute("user", user);
model.addAttribute("userName",user.getNickname());
return "test/mypage";
return "mypage";
}
}
// 사용자를 찾을 수 없거나 인증되지 않은 경우, 로그인 페이지로 리다이렉트 또는 다른 처리
Expand Down Expand Up @@ -147,7 +147,7 @@ public String deleteUserInfo(@PathVariable Long userId){
return "redirect:login";
}

@GetMapping("mypage/admin")
@GetMapping("/mypage/admin")
public String getAllUsers(Model model,@AuthenticationPrincipal UserDetails userDetails){

Long id = getUserIdFromUserDetails(userDetails);
Expand All @@ -169,7 +169,7 @@ public String getAllUsers(Model model,@AuthenticationPrincipal UserDetails userD

}
@Transactional
@PostMapping("mypage/{userId}/admin")
@PostMapping("/mypage/{userId}/admin")
public String updateRole(@PathVariable Long userId,@RequestParam String role){
userService.updateRole(userId,role);
return "redirect:mypage/admin";
Expand Down
Original file line number Diff line number Diff line change
@@ -1,168 +1,168 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorate="~{layout/layout}">

<th:block layout:fragment="head">
<title>마이 페이지</title>
<link th:href="@{/css/mypage.css}" rel="stylesheet"/>
</th:block>

<div th:replace="~{/fragments/header}"></div>
<main th:fragment="content">
<div class="wrap">
<h1>마이 페이지</h1>
<section class="user-info-section">
<p th:text="'이메일 : '+${user.email}"></p>
<p th:text="'닉네임 : '+${user.nickname}"></p>
<div class="btn-div">
<button class="ui-button" th:onclick="|location.href='@{/mypage/update/{userId}(userId=${user.id})}'|">정보 수정</button>
<!-- 계정 삭제 처리 -->
<form id="delete-form" th:action="@{/mypage/{userId}(userId=${user.id})}" method="post">
<input type="hidden" name="_method" value="delete" />
<button type="submit">계정 삭제</button>
</form>
<button class="ui-button" th:if="${user.role eq 'admin'}" th:onclick="|location.href='/mypage/admin'|">관리자 페이지</button>
</div>
</section>
<section class="board-table-section">
<h3 class="table-title">내가 작성한 게시글</h3>
<ul class="board-table-header">
<li class="no">번호</li>
<li class="title">제목</li>
<li class="create-time">생성 일시</li>
</ul>
<ul class="board-table-body">
<li th:each="board : ${boardPage.content}">
<p class="no" th:text="${board.id}"></p>
<a class="title" th:href="@{/boards/{id}(id=${board.id}, team=${board.team})}" th:text="${board.title}"></a>
<p class="create-time" th:text="${#dates.format(board.createdAt, 'yyyy-MM-dd HH:mm')}"></p>
</li>
</ul>
<div th:if="${boardPage.totalPages > 0}">
<ul class="pagination">
<!-- 이전 페이지 버튼 -->
<li class="page-item" th:classappend="${boardPage.hasPrevious()} ? '' : 'disabled'">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number > 0 ? boardPage.number : 1}, commentPage=${commentPage.number+1})}" th:disabled="${boardPage.number == 0}">
<span>이전</span>
</a>
</li>
<!-- 페이지 번호 표시 -->
<li th:each="page : ${#numbers.sequence(1, boardPage.totalPages)}"
th:classappend="${boardPage.number + 2 == page} ? 'active' : ''">
<form th:action="@{/mypage}" method="get">
<input type="hidden" name="boardPage" th:value="${page}" />
<input type="hidden" name="commentPage" th:value="${commentPage.number+1}" />
<button type="submit" class="page-link" th:text="${page}"></button>
</form>
</li>
<!-- 다음 페이지 버튼 -->
<li class="page-item" th:classappend="${boardPage.hasNext()} ? '' : 'disabled'">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.totalPages < boardPage.number + 2 ? boardPage.number + 1 : boardPage.number + 2}, commentPage=${commentPage.number+1})}" th:disabled="${!boardPage.hasNext()}">
<span>다음</span>
</a>
</li>
</ul>
</div>
</section>
<section class="comment-table-section">
<h3 class="table-title">내가 작성한 댓글</h3>
<ul class="comment-table-header">
<li class="no">번호</li>
<li class="comment">내용</li>
<li class="move">게시글</li>
<li class="create-time">생성 일시</li>
</ul>
<ul class="comment-table-body">
<li th:each="comment, commentIndex : ${commentPage.content}">
<p class="no" th:text="${commentIndex.index + 1}"></p>
<p class="comment" th:text="${comment.content}"></p>
<a class="move" th:href="@{/boards/{boardId}(boardId=${comment.board.id})}">게시글로 이동</a>
<p class="create-time" th:text="${#dates.format(comment.createdAt, 'yyyy-MM-dd HH:mm')}"></p>
</li>
</ul>
<div th:if="${commentPage.totalPages > 0}">
<ul class="pagination">
<!-- 이전 페이지 버튼 -->
<li class="page-item" th:classappend="${commentPage.hasPrevious() ? '' : 'disabled'}">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number+1}, commentPage=${commentPage.number > 0 ? commentPage.number: 1})}">
<span>이전</span>
</a>
</li>

<!-- 페이지 번호 표시 -->
<li th:each="page : ${#numbers.sequence(1, commentPage.totalPages)}"
th:classappend="${commentPage.number + 2 == page ? 'active' : ''}">
<form th:action="@{/mypage}" method="get">
<input type="hidden" name="boardPage" th:value="${boardPage.number+1}" />
<input type="hidden" name="commentPage" th:value="${page}" />
<button type="submit" class="page-link" th:text="${page}"></button>
</form>
</li>

<!-- 다음 페이지 버튼 -->
<li class="page-item" th:classappend="${commentPage.hasNext() ? '' : 'disabled'}">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number+1}, commentPage=${commentPage.totalPages > commentPage.number + 2 ? commentPage.number + 2 : commentPage.totalPages})}">
<span>다음</span>
</a>
</li>
</ul>
</div>
</section>
</div>
</main>
<div th:replace="~{/fragments/footer}"></div>
<script>
document.getElementById("delete-form").addEventListener("submit", async function(event) {
event.preventDefault(); // 폼 제출을 일단 방지

// 비밀번호 입력을 받는 프롬프트 대화상자 표시
var deletePassword = prompt("계정 삭제를 위해 비밀번호를 입력하세요:");

if (deletePassword === null || deletePassword === "") {
alert("비밀번호를 입력해야 계정 삭제를 진행할 수 있습니다.");
return; // 입력이 없는 경우 함수 종료
}

// 입력된 비밀번호와 현재 로그인된 사용자의 비밀번호 비교
async function checkDeletePassword() {
try {
const response = await fetch("/checkCurrentPassword", {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: `currentPassword=${encodeURIComponent(deletePassword)}`
});
const data = await response.json();
if (!data.available) {
alert("비밀번호가 일치하지 않습니다. 계정 삭제를 진행할 수 없습니다.");
return false; // 비밀번호가 일치하지 않으므로 false 반환
} else {
return true; // 비밀번호가 일치하므로 true 반환
}
} catch (error) {
console.error('비밀번호 확인 중 오류 발생:', error);
return false; // 오류가 발생했으므로 false 반환
}
}

// 비밀번호 확인 함수 호출
const isPasswordCorrect = await checkDeletePassword();
if (!isPasswordCorrect) {
return; // 비밀번호가 일치하지 않으면 함수 종료
}

// 비밀번호가 확인되면 계정 삭제 수행
if (confirm("정말로 계정을 삭제하시겠습니까? 계정을 삭제하면 모든 정보가 영구적으로 삭제됩니다.")) {

alert("계정이 성공적으로 삭제되었습니다.");
event.target.submit();

} else {
alert("계정 삭제가 취소되었습니다.");
}

});
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorate="~{layout/layout}">

<th:block layout:fragment="head">
<title>마이 페이지</title>
<link th:href="@{/css/mypage.css}" rel="stylesheet"/>
</th:block>

<div th:replace="~{fragments/header.html}"></div>
<main th:fragment="content">
<div class="wrap">
<h1>마이 페이지</h1>
<section class="user-info-section">
<p th:text="'이메일 : '+${user.email}"></p>
<p th:text="'닉네임 : '+${user.nickname}"></p>
<div class="btn-div">
<button class="ui-button" th:onclick="|location.href='@{/mypage/update/{userId}(userId=${user.id})}'|">정보 수정</button>
<!-- 계정 삭제 처리 -->
<form id="delete-form" th:action="@{/mypage/{userId}(userId=${user.id})}" method="post">
<input type="hidden" name="_method" value="delete" />
<button type="submit">계정 삭제</button>
</form>
<button class="ui-button" th:if="${user.role eq 'admin'}" th:onclick="|location.href='/mypage/admin'|">관리자 페이지</button>
</div>
</section>
<section class="board-table-section">
<h3 class="table-title">내가 작성한 게시글</h3>
<ul class="board-table-header">
<li class="no">번호</li>
<li class="title">제목</li>
<li class="create-time">생성 일시</li>
</ul>
<ul class="board-table-body">
<li th:each="board : ${boardPage.content}">
<p class="no" th:text="${board.id}"></p>
<a class="title" th:href="@{/boards/{id}(id=${board.id}, team=${board.team})}" th:text="${board.title}"></a>
<p class="create-time" th:text="${#dates.format(board.createdAt, 'yyyy-MM-dd HH:mm')}"></p>
</li>
</ul>
<div th:if="${boardPage.totalPages > 0}">
<ul class="pagination">
<!-- 이전 페이지 버튼 -->
<li class="page-item" th:classappend="${boardPage.hasPrevious()} ? '' : 'disabled'">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number > 0 ? boardPage.number : 1}, commentPage=${commentPage.number+1})}" th:disabled="${boardPage.number == 0}">
<span>이전</span>
</a>
</li>
<!-- 페이지 번호 표시 -->
<li th:each="page : ${#numbers.sequence(1, boardPage.totalPages)}"
th:classappend="${boardPage.number + 2 == page} ? 'active' : ''">
<form th:action="@{/mypage}" method="get">
<input type="hidden" name="boardPage" th:value="${page}" />
<input type="hidden" name="commentPage" th:value="${commentPage.number+1}" />
<button type="submit" class="page-link" th:text="${page}"></button>
</form>
</li>
<!-- 다음 페이지 버튼 -->
<li class="page-item" th:classappend="${boardPage.hasNext()} ? '' : 'disabled'">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.totalPages < boardPage.number + 2 ? boardPage.number + 1 : boardPage.number + 2}, commentPage=${commentPage.number+1})}" th:disabled="${!boardPage.hasNext()}">
<span>다음</span>
</a>
</li>
</ul>
</div>
</section>
<section class="comment-table-section">
<h3 class="table-title">내가 작성한 댓글</h3>
<ul class="comment-table-header">
<li class="no">번호</li>
<li class="comment">내용</li>
<li class="move">게시글</li>
<li class="create-time">생성 일시</li>
</ul>
<ul class="comment-table-body">
<li th:each="comment, commentIndex : ${commentPage.content}">
<p class="no" th:text="${commentIndex.index + 1}"></p>
<p class="comment" th:text="${comment.content}"></p>
<a class="move" th:href="@{/boards/{boardId}(boardId=${comment.board.id})}">게시글로 이동</a>
<p class="create-time" th:text="${#dates.format(comment.createdAt, 'yyyy-MM-dd HH:mm')}"></p>
</li>
</ul>
<div th:if="${commentPage.totalPages > 0}">
<ul class="pagination">
<!-- 이전 페이지 버튼 -->
<li class="page-item" th:classappend="${commentPage.hasPrevious() ? '' : 'disabled'}">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number+1}, commentPage=${commentPage.number > 0 ? commentPage.number: 1})}">
<span>이전</span>
</a>
</li>

<!-- 페이지 번호 표시 -->
<li th:each="page : ${#numbers.sequence(1, commentPage.totalPages)}"
th:classappend="${commentPage.number + 2 == page ? 'active' : ''}">
<form th:action="@{/mypage}" method="get">
<input type="hidden" name="boardPage" th:value="${boardPage.number+1}" />
<input type="hidden" name="commentPage" th:value="${page}" />
<button type="submit" class="page-link" th:text="${page}"></button>
</form>
</li>

<!-- 다음 페이지 버튼 -->
<li class="page-item" th:classappend="${commentPage.hasNext() ? '' : 'disabled'}">
<a class="page-link" th:href="@{/mypage(boardPage=${boardPage.number+1}, commentPage=${commentPage.totalPages > commentPage.number + 2 ? commentPage.number + 2 : commentPage.totalPages})}">
<span>다음</span>
</a>
</li>
</ul>
</div>
</section>
</div>
</main>
<div th:replace="~{fragments/footer.html}"></div>
<script>
document.getElementById("delete-form").addEventListener("submit", async function(event) {
event.preventDefault(); // 폼 제출을 일단 방지

// 비밀번호 입력을 받는 프롬프트 대화상자 표시
var deletePassword = prompt("계정 삭제를 위해 비밀번호를 입력하세요:");

if (deletePassword === null || deletePassword === "") {
alert("비밀번호를 입력해야 계정 삭제를 진행할 수 있습니다.");
return; // 입력이 없는 경우 함수 종료
}

// 입력된 비밀번호와 현재 로그인된 사용자의 비밀번호 비교
async function checkDeletePassword() {
try {
const response = await fetch("/checkCurrentPassword", {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: `currentPassword=${encodeURIComponent(deletePassword)}`
});
const data = await response.json();
if (!data.available) {
alert("비밀번호가 일치하지 않습니다. 계정 삭제를 진행할 수 없습니다.");
return false; // 비밀번호가 일치하지 않으므로 false 반환
} else {
return true; // 비밀번호가 일치하므로 true 반환
}
} catch (error) {
console.error('비밀번호 확인 중 오류 발생:', error);
return false; // 오류가 발생했으므로 false 반환
}
}

// 비밀번호 확인 함수 호출
const isPasswordCorrect = await checkDeletePassword();
if (!isPasswordCorrect) {
return; // 비밀번호가 일치하지 않으면 함수 종료
}

// 비밀번호가 확인되면 계정 삭제 수행
if (confirm("정말로 계정을 삭제하시겠습니까? 계정을 삭제하면 모든 정보가 영구적으로 삭제됩니다.")) {

alert("계정이 성공적으로 삭제되었습니다.");
event.target.submit();

} else {
alert("계정 삭제가 취소되었습니다.");
}

});
</script>

0 comments on commit f5e6b2f

Please sign in to comment.