Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@Joody20
Joody20 authored Dec 3, 2023
1 parent b556356 commit 02773af
Show file tree
Hide file tree
Showing 4 changed files with 662 additions and 0 deletions.
139 changes: 139 additions & 0 deletions src/main/webapp/WEB-INF/views/free_boardEdit.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,139 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>공지사항</title>
<link rel="stylesheet" href="css/css.css">
<link rel="stylesheet" href="css/header.css">

</head>

<body>
<div id = 'head' class="header">
<div class="logo" onclick="location.href='/login'"></div>
<div class="button-container">
<!-- Conditionally render buttons based on login status -->
<!-- For example, you can use server-side templating or JavaScript to determine login status -->
<!-- Replace the following buttons with your server-side logic -->
<div class="nickname">
<div class="username">웹썰미</div>님
</div>
<button class="button" style="margin: 7px; margin-right: 15px;" onclick=" " location.href='/write'>새 글 작성</button>
<button class="button" style="margin: 7px; margin-right: 15px;" onclick="logout()">로그아웃</button>
<!-- Or render login/signup buttons -->
<!--
<button class="button" onclick="location.href='/login'">로그인</button>
<button class="button" onclick="location.href='/signup'">회원가입</button>
-->
</div>
</div>
</body>
<style type="text/css">
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');

* {
margin: 0px;
font-family: "Do Hyeon";

}
</style>
<body>
<div class="board_wrap">
<div class="board_title">
<strong>자유게시판(수정)</strong>
<p>수정할 정보를 입력해주세요.</p>
</div>
<div class="board_write_wrap">
<div class="board_write">
<div class="title">
<dl>
<dt>제목</dt>
<dd><input type="text" name = "subject" placeholder="제목 입력"></dd>
</dl>
</div>
<div class="info">
<dl>
<dt>글쓴이</dt>
<dd id="userNickname"></dd>
</dl>
</div>
<div class="cont">
<textarea name = "content" placeholder="내용 입력"></textarea>
</div>
</div>
<div class="bt_wrap">
<a id="editbtn" class="on">수정</a>
<a href="free_boardList.html">취소</a>
</div>
</div>
</div>

</body>
</html>

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script type="module"></script>
<script>
// Move the window.onload outside the click event listener

window.onload = function () {

// Retrieve user_nickname from the URL parameters
const urlParams = new URLSearchParams(window.location.search);
const userNickname = urlParams.get('userNickname');

console.log(userNickname);

// Check if the element with id 'userNickname' exists before updating innerText
const userNicknameElement = document.getElementById('userNickname');
if (userNicknameElement) {
userNicknameElement.innerText = userNickname;
}

const editBtn = document.getElementById("editbtn");

editBtn.addEventListener("click", async (e) => {
e.preventDefault();

const updatedSubject = document.querySelector('input[name="subject"]').value;
const updatedContent = document.querySelector('textarea[name="content"]').value;

// Check each field individually
if (!updatedSubject || !updatedContent) {
alert("수정할 제목, 내용을 모두 입력해주세요!");
return;


}

// URL에서 직접 idx 값을 가져오기

const urlParams = new URLSearchParams(window.location.search);
const idx = urlParams.get('idx');

console.log(idx); // Now, idx should

try {
const response = await axios.put(`http://35.212.196.164/freeboard/putcontent/${idx}/${updatedSubject}/${updatedContent}`);

console.log(response.data);

// Check response data and process success or failure
if (response.data === true) {
console.log("글 수정 성공!");
// Redirect or perform other actions on success
window.location.href = 'free_boardList.html';
alert('수정이 완료되었습니다.')
} else {
console.log('글 수정 실패!');
// Handle in case of failure, display error message, etc.
}
} catch (error) {
console.error("PUT 요청 중 오류 발생:", error);
// Error handling, displaying error messages, etc.
}
});
};

</script>
143 changes: 143 additions & 0 deletions src/main/webapp/WEB-INF/views/free_boardList.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,143 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>헤더 </title>
<link rel = 'stylesheet' href = "css/header.css">
<link rel = 'stylesheet' href = "../css/index.css">

</head>

<body>
<div id = 'head' class="header">
<div class="logo" onclick="location.href='/login'"></div>
<div class="button-container">
<!-- Add login and signup buttons -->
<button class="button" style="margin: 7px; margin-right: 15px; " id="loginBtn" onclick="location.href='/login'">로그인</button>
<button class="button" style="margin: 7px; margin-right: 15px; " id="signupBtn" onclick="location.href='/signup'">회원가입</button>
<div class="nickname" id="nicknameDiv"></div>
<button class="button" style="margin: 7px; margin-right: 15px; display: none;" id="logoutBtn" onclick="logout()">로그아웃</button>

</div>
</div>

<div class="nav__bar">
<ul class="nav__menu">
<li><a href="/" style="margin-top: 10px; margin-left: 10px;" class="white_font"> 홈 </a></li>
<li><a href="/PostListPage" style="margin-top: 10px; margin-left: 10px;" class="white_font"> 후기 목록 </a></li>
<li><a href="free_boardList.html" style="margin-top: 10px; margin-left: 10px;" class="white_font"> 자유게시판 </a></li>
<li><a href="/MyPage" style="margin-top: 10px; margin-left: 10px;" class="white_font"> 마이페이지 </a></li>
</ul>
</div>
</body>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>공지사항</title>
<link rel="stylesheet" href="css/css.css">
</head>
<style type="text/css">
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');

* {
margin: 0px;
font-family: "Do Hyeon";

}
</style>
<body>
<div class="board_wrap">
<div class="board_title">
<strong>자유게시판</strong>
<p>여러 정보들을 공유해주세요.</p>
</div>
<div class="board_list_wrap">
<div class="top">
<div class="num">번호</div> <!-- 아마 id가 들어가면됌.-->
<div class="title">제목</div> <!--title-->
<div class="writer">글쓴이</div> <!--user_nickname-->
<div class="date">작성일</div> <!--createdAt-->
</div>
<div class="board_list" id ="boardList" >
<div>
<div class="num"></div>
<div class="title"><a href="free_boardView.html"></a></div>
<div class="writer"></div>
<div class="date"></div>
</div>
</div>
<div class="board_page">
<a href="#" class="bt first"></a>
<a href="#" class="bt prev"></a>
<a href="#" class="num on">1</a>
<a href="#" class="num">2</a>
<a href="#" class="num">3</a>
<a href="#" class="num">4</a>
<a href="#" class="num">5</a>
<a href="#" class="bt next">></a>
<a href="#" class="bt last">>></a>
</div>
<div class="bt_wrap">
<a href="free_boardWrite.html" class="on">글쓰기</a>
<!--<a href="#">수정</a>-->
</div>
</div>
</div>
</body>
</html>

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

<script>
//import axios from 'axios';

// 페이지 로드 시 실행되는 함수
window.onload = async function () {
// 서버로부터 자유게시판 목록을 가져오는 요청
try {
const response = await axios.get('http://35.212.196.164/freeboard/getfreeboardlist');

// 서버로부터 받은 데이터를 변수에 저장
const boardList = response.data;

// 가져온 데이터를 화면에 출력하는 함수 호출
displayBoardList(boardList);
} catch (error) {
console.error('서버로부터 자유게시판 목록을 가져오는 중 오류 발생:', error);
// 오류 처리, 오류 메시지 표시 등
}
};

// 서버로부터 받은 데이터를 화면에 출력하는 함수
function displayBoardList(boardList) {
const boardListContainer = document.getElementById('boardList');

// 이전에 표시된 목록 삭제 (새로고침을 했을 때 중복 방지)
boardListContainer.innerHTML = '';


// boardList를 최신순으로 정렬
boardList.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));


let i = 1;
// 받아온 목록을 화면에 출력 id index관리/........
for (const boardItem of boardList) {

const date = new Date(boardItem.created_at);
const formattedDate = `${date.getFullYear()}.${date.getMonth() + 1}.${date.getDate()}`;

const boardItemElement = document.createElement('div');
boardItemElement.innerHTML = `
<div class="num">${i++}</div>
<div class="title"><a href="free_boardView.html?idx=${boardItem.id}">${boardItem.title}</a></div>
<div class="writer">${boardItem.user_nickname}</div>
<div class="date">${formattedDate}</div>
<div class="idx" style="display: none;">${boardItem.id}</div>
`;
boardListContainer.appendChild(boardItemElement);
}
}

</script>
Loading

0 comments on commit 02773af

Please sign in to comment.