localnet/localhost-front
10
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

대댓글 수정중

Browse Source
This commit is contained in:
kimdaae328 2025-02-19 23:38:40 +09:00
parent 6d705d1093
commit bba4c60cb2
2 changed files with 51 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/board/BoardComment.vue
View File

@ -23,11 +23,12 @@
<textarea v-model="editedContent" class="form-control"></textarea>
<div class="mt-2 d-flex justify-content-end">
<button class="btn btn-secondary me-2" @click="emit('toggleEdit', comment.commentId, false)">취소</button>
<button class="btn btn-primary" @click="submitEdit">수정 완료</button>
<button class="btn btn-primary" @click="submitEdit">수정</button>
</div>
</template>
<template v-else>
<p class="m-0">{{ comment.content }}</p>
<span>{{ comment.commentId }}</span>
</template>
</div>

76
src/views/board/BoardView.vue
View File

@ -223,42 +223,64 @@ const handleUpdateReaction = async ({ boardId, commentId, isLike, isDislike }) =
// 댓글 목록 조회
const fetchComments = async (page = 1) => {
try {
const response = await axios.get(`board/${currentBoardId.value}/comments`, {
params: {
LOCBRDSEQ: currentBoardId.value,
page
}
const { data } = await axios.get(`board/${currentBoardId.value}/comments`, {
params: { LOCBRDSEQ: currentBoardId.value, page }
});
console.log("목록 API 응답 데이터:", response.data);
const { data: replyData } = await axios.get(`board/${currentBoardId.value}/reply`, {
params: { LOCBRDSEQ: currentBoardId.value }
});
console.log("댓글:", data);
console.log("대댓글:", replyData);
let allComments = response.data.data.list.map(comment => ({
commentId: comment.LOCCMTSEQ, // 댓글 id
if (!data?.data?.list) return;
comments.value = data.data.list.map(comment => ({
commentId: comment.LOCCMTSEQ, // 댓글 ID
boardId: comment.LOCBRDSEQ,
parentId: comment.LOCCMTPNT, // 부모 id
author: comment.author || "익명 사용자", // 작성자
content: comment.LOCCMTRPY, // 댓글 내용
createdAt: formattedDate(comment.LOCCMTRDT), // 생성 날짜
children: []
parentId: comment.LOCCMTPNT, // 부모 ID
author: comment.author || "익명 사용자",
content: comment.LOCCMTRPY,
createdAtRaw: new Date(comment.LOCCMTRDT), // 정렬용
createdAt: formattedDate(comment.LOCCMTRDT), // 표시용
children: [] // 대댓글을 담을 배열
}));
allComments.sort((a, b) => b.commentId - a.commentId);
let replies = replyData.data.map(reply => ({
commentId: reply.LOCCMTSEQ, // 대댓글 ID
boardId: reply.LOCBRDSEQ,
parentId: reply.LOCCMTPNT, // 부모 댓글 ID
author: reply.author || "익명 사용자",
content: reply.LOCCMTRPY,
createdAtRaw: new Date(reply.LOCCMTRDT), // 정렬용
createdAt: formattedDate(reply.LOCCMTRDT) // 표시용
}));
let commentMap = {};
let rootComments = [];
// let commentMap = {};
// let rootComments = [];
allComments.forEach(comment => {
commentMap[comment.commentId] = comment;
});
// 최상위 댓글 저장
// allComments.forEach(comment => {
// commentMap[comment.commentId] = comment;
// });
allComments.forEach(comment => {
if (comment.parentId && commentMap[comment.parentId]) {
commentMap[comment.parentId].children.push(comment);
} else {
rootComments.push(comment);
}
});
// 대댓글을 부모 댓글에 추가
// replies.forEach(reply => {
// if (commentMap[reply.parentId]) {
// commentMap[reply.parentId].children.push(reply);
// } else {
// console.warn("부모 댓글을 찾을 수 없는 대댓글:", reply);
// }
// });
comments.value = rootComments;
// rootComments = allComments.filter(comment => comment.parentId === 1);
// 정렬
// rootComments.sort((a, b) => b.createdAtRaw - a.createdAtRaw);
// rootComments.forEach(comment => {
// comment.children.sort((a, b) => b.createdAtRaw - a.createdAtRaw);
// });
// comments.value = rootComments;
// console.log("변환된 comments 데이터:", comments.value);