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

Merge branch 'boardmodify3'

Browse Source
This commit is contained in:
nevermoregb 2025-03-11 10:38:47 +09:00
commit 61935cfb68
1 changed files with 89 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -157,7 +157,7 @@
const toastStore = useToastStore(); const toastStore = useToastStore();
const currentBoardId = ref(Number(route.params.id)); const currentBoardId = ref(Number(route.params.id));
const unknown = computed(() => profileName.value === '익명'); const unknown = computed(() => profileName.value === '익명');
const currentUserId = computed(() => userStore.user.id); // 현재 로그인한 사용자 id const currentUserId = computed(() => userStore?.user?.id); // 현재 로그인한 사용자 id
const authorId = ref(''); // 작성자 id const authorId = ref(''); // 작성자 id
const isAuthor = computed(() => currentUserId.value === authorId.value); const isAuthor = computed(() => currentUserId.value === authorId.value);
@ -233,24 +233,20 @@
}; };
// 게시물 상세 데이터 불러오기 // 게시물 상세 데이터 불러오기
const fetchBoardDetails = async () => { const fetchBoardDetails = async () => {
try { const response = await axios.get(`board/${currentBoardId.value}`);
const response = await axios.get(`board/${currentBoardId.value}`); const data = response.data.data;
const data = response.data.data;
profileName.value = data.author || '익명'; profileName.value = data.author || '익명';
authorId.value = data.authorId; authorId.value = data.authorId;
boardTitle.value = data.title || '제목 없음'; boardTitle.value = data.title || '제목 없음';
boardContent.value = data.content || ''; boardContent.value = data.content || '';
date.value = data.date || ''; date.value = data.date || '';
views.value = data.cnt || 0; views.value = data.cnt || 0;
likes.value = data.likeCount || 0; likes.value = data.likeCount || 0;
dislikes.value = data.dislikeCount || 0; dislikes.value = data.dislikeCount || 0;
attachment.value = data.hasAttachment || null; attachment.value = data.hasAttachment || null;
commentNum.value = data.commentCount || 0; commentNum.value = data.commentCount || 0;
attachments.value = data.attachments || []; attachments.value = data.attachments || [];
} catch (error) {
alert('게시물 데이터를 불러오는 중 오류가 발생했습니다.');
}
}; };
// 좋아요, 싫어요 // 좋아요, 싫어요
@ -280,97 +276,89 @@
const handleCommentReaction = async ({ boardId, commentId, isLike, isDislike }) => { const handleCommentReaction = async ({ boardId, commentId, isLike, isDislike }) => {
if (!commentId) return; // 댓글 ID가 없으면 실행 안 함 if (!commentId) return; // 댓글 ID가 없으면 실행 안 함
try { const response = await axios.post(`/board/${boardId}/${commentId}/reaction`, {
const response = await axios.post(`/board/${boardId}/${commentId}/reaction`, { LOCBRDSEQ: boardId, // 게시글 ID
LOCBRDSEQ: boardId, // 게시글 ID LOCCMTSEQ: commentId, // 댓글 ID
LOCCMTSEQ: commentId, // 댓글 ID LOCGOBGOD: isLike ? 'T' : 'F',
LOCGOBGOD: isLike ? 'T' : 'F', LOCGOBBAD: isDislike ? 'T' : 'F',
LOCGOBBAD: isDislike ? 'T' : 'F', });
});
await fetchComments(); await fetchComments();
} catch (error) {
alert('오류가 발생했습니다.');
}
}; };
// 댓글 목록 조회 // 댓글 목록 조회
const fetchComments = async (page = 1) => { const fetchComments = async (page = 1) => {
try { // 댓글
// 댓글 const response = await axios.get(`board/${currentBoardId.value}/comments`, {
const response = await axios.get(`board/${currentBoardId.value}/comments`, { params: {
params: { LOCBRDSEQ: currentBoardId.value,
LOCBRDSEQ: currentBoardId.value, page,
page, },
}, });
const commentsList = response.data.data.list.map(comment => ({
commentId: comment.LOCCMTSEQ, // 댓글 ID
boardId: comment.LOCBRDSEQ,
parentId: comment.LOCCMTPNT, // 부모 ID
author: comment.author || '익명',
authorId: comment.authorId,
content: comment.LOCCMTRPY,
likeCount: comment.likeCount || 0,
dislikeCount: comment.dislikeCount || 0,
likeClicked: comment.likeClicked || false,
dislikeClicked: comment.dislikeClicked || false,
createdAtRaw: new Date(comment.LOCCMTRDT), // 정렬용
createdAt: formattedDate(comment.LOCCMTRDT), // 표시용
children: [], // 대댓글을 담을 배열
updateAtRaw: comment.LOCCMTUDT,
}));
commentsList.sort((a, b) => b.createdAtRaw - a.createdAtRaw);
for (const comment of commentsList) {
if (!comment.commentId) continue;
const replyResponse = await axios.get(`board/${currentBoardId.value}/reply`, {
params: { LOCCMTPNT: comment.commentId },
}); });
const commentsList = response.data.data.list.map(comment => ({
commentId: comment.LOCCMTSEQ, // 댓글 ID
boardId: comment.LOCBRDSEQ,
parentId: comment.LOCCMTPNT, // 부모 ID
author: comment.author || '익명',
authorId: comment.authorId,
content: comment.LOCCMTRPY,
likeCount: comment.likeCount || 0,
dislikeCount: comment.dislikeCount || 0,
likeClicked: comment.likeClicked || false,
dislikeClicked: comment.dislikeClicked || false,
createdAtRaw: new Date(comment.LOCCMTRDT), // 정렬용
createdAt: formattedDate(comment.LOCCMTRDT), // 표시용
children: [], // 대댓글을 담을 배열
updateAtRaw: comment.LOCCMTUDT,
}));
commentsList.sort((a, b) => b.createdAtRaw - a.createdAtRaw); if (replyResponse.data.data) {
comment.children = replyResponse.data.data.map(reply => ({
for (const comment of commentsList) { author: reply.author || '익명',
if (!comment.commentId) continue; authorId: reply.authorId,
commentId: reply.LOCCMTSEQ,
const replyResponse = await axios.get(`board/${currentBoardId.value}/reply`, { boardId: reply.LOCBRDSEQ,
params: { LOCCMTPNT: comment.commentId }, parentId: reply.LOCCMTPNT, // 부모 댓글 ID
}); content: reply.LOCCMTRPY || '내용 없음',
createdAtRaw: new Date(reply.LOCCMTRDT),
if (replyResponse.data.data) { createdAt: formattedDate(reply.LOCCMTRDT),
comment.children = replyResponse.data.data.map(reply => ({ likeCount: reply.likeCount || 0,
author: reply.author || '익명', dislikeCount: reply.dislikeCount || 0,
authorId: reply.authorId, likeClicked: false,
commentId: reply.LOCCMTSEQ, dislikeClicked: false,
boardId: reply.LOCBRDSEQ, }));
parentId: reply.LOCCMTPNT, // 부모 댓글 ID } else {
content: reply.LOCCMTRPY || '내용 없음', comment.children = []; // 대댓글이 없으면 빈 배열로 초기화
createdAtRaw: new Date(reply.LOCCMTRDT),
createdAt: formattedDate(reply.LOCCMTRDT),
likeCount: reply.likeCount || 0,
dislikeCount: reply.dislikeCount || 0,
likeClicked: false,
dislikeClicked: false,
}));
} else {
comment.children = []; // 대댓글이 없으면 빈 배열로 초기화
}
} }
// 최종적으로 댓글 목록 업데이트
comments.value = commentsList;
pagination.value = {
...pagination.value,
currentPage: response.data.data.pageNum, // 현재 페이지 번호
pages: response.data.data.pages, // 전체 페이지 수
prePage: response.data.data.prePage, // 이전 페이지
nextPage: response.data.data.nextPage, // 다음 페이지
isFirstPage: response.data.data.isFirstPage, // 첫 페이지 여부
isLastPage: response.data.data.isLastPage, // 마지막 페이지 여부
hasPreviousPage: response.data.data.hasPreviousPage, // 이전 페이지 존재 여부
hasNextPage: response.data.data.hasNextPage, // 다음 페이지 존재 여부
navigatePages: response.data.data.navigatePages, // 몇 개의 페이지 버튼을 보여줄 것인지
navigatepageNums: response.data.data.navigatepageNums, // 실제 페이지 번호 목록
navigateFirstPage: response.data.data.navigateFirstPage, // 페이지네이션에서 첫 페이지 번호
navigateLastPage: response.data.data.navigateLastPage, // 페이지네이션에서 마지막 페이지 번호
};
} catch (error) {
alert('오류가 발생했습니다.');
} }
// 최종적으로 댓글 목록 업데이트
comments.value = commentsList;
pagination.value = {
...pagination.value,
currentPage: response.data.data.pageNum, // 현재 페이지 번호
pages: response.data.data.pages, // 전체 페이지 수
prePage: response.data.data.prePage, // 이전 페이지
nextPage: response.data.data.nextPage, // 다음 페이지
isFirstPage: response.data.data.isFirstPage, // 첫 페이지 여부
isLastPage: response.data.data.isLastPage, // 마지막 페이지 여부
hasPreviousPage: response.data.data.hasPreviousPage, // 이전 페이지 존재 여부
hasNextPage: response.data.data.hasNextPage, // 다음 페이지 존재 여부
navigatePages: response.data.data.navigatePages, // 몇 개의 페이지 버튼을 보여줄 것인지
navigatepageNums: response.data.data.navigatepageNums, // 실제 페이지 번호 목록
navigateFirstPage: response.data.data.navigateFirstPage, // 페이지네이션에서 첫 페이지 번호
navigateLastPage: response.data.data.navigateLastPage, // 페이지네이션에서 마지막 페이지 번호
};
}; };
// 댓글 작성 // 댓글 작성
@ -453,7 +441,7 @@
// 게시글 삭제 버튼 클릭 // 게시글 삭제 버튼 클릭
const deleteClick = unknown => { const deleteClick = unknown => {
if (unknown) { if (unknown.value) {
togglePassword('delete'); togglePassword('delete');
} else { } else {
deletePost(); deletePost();