diff --git a/src/components/board/BoardComment.vue b/src/components/board/BoardComment.vue index 4f635d4..0ae221e 100644 --- a/src/components/board/BoardComment.vue +++ b/src/components/board/BoardComment.vue @@ -25,7 +25,7 @@ /> - {{ passwordAlert }} + {{ passwordCommentAlert }} @@ -96,7 +96,7 @@ const props = defineProps({ type: Boolean, default: false, }, - passwordAlert: { + passwordCommentAlert: { type: String, default: false } @@ -133,6 +133,7 @@ const handleUpdateReaction = (reactionData) => { // 비밀번호 확인 const logPasswordAndEmit = () => { emit('submitPassword', props.comment, password.value); + password.value = ""; }; watch(() => props.comment.isEditTextarea, (newVal) => { diff --git a/src/components/board/BoardCommentList.vue b/src/components/board/BoardCommentList.vue index d464529..9cd3425 100644 --- a/src/components/board/BoardCommentList.vue +++ b/src/components/board/BoardCommentList.vue @@ -10,7 +10,7 @@ :comment="comment" :isCommentPassword="comment.isCommentPassword" :isEditTextarea="comment.isEditTextarea" - :passwordAlert="passwordAlert" + :passwordCommentAlert="passwordCommentAlert" @editClick="$emit('editClick', comment)" @deleteClick="$emit('deleteClick', comment)" @submitPassword="submitPassword" @@ -46,7 +46,7 @@ const props = defineProps({ type: Boolean, default: false, }, - passwordAlert: { + passwordCommentAlert: { type: String, default: false } diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue index 3614d4c..0820d92 100644 --- a/src/views/board/BoardView.vue +++ b/src/views/board/BoardView.vue @@ -100,7 +100,7 @@ :comments="comments" :isCommentPassword="isCommentPassword" :isEditTextarea="isEditTextarea" - :passwordAlert="passwordAlert" + :passwordCommentAlert="passwordCommentAlert" @editClick="editComment" @deleteClick="deleteComment" @updateReaction="handleCommentReaction" @@ -255,7 +255,6 @@ const handleCommentReaction = async ({ boardId, commentId, isLike, isDislike }) // console.log("댓글 좋아요 API 응답 데이터:", response.data); - // 좋아요/싫어요 상태 업데이트를 위해 새로 불러오기 await fetchComments(); } catch (error) { @@ -361,19 +360,19 @@ const handleCommentSubmit = async ({ comment, password }) => { isSubmitting.value = true; try { - await axios.post(`board/${currentBoardId.value}/comment`, { + const response = await axios.post(`board/${currentBoardId.value}/comment`, { LOCBRDSEQ: currentBoardId.value, LOCCMTRPY: comment, LOCCMTPWD: password, LOCCMTPNT: 1 }); - // if (response.status === 200) { - // console.log('댓글 작성 성공:', response.data.message); - // await fetchComments(); - // } else { - // console.log('댓글 작성 실패:', response.data.message); - // } + if (response.status === 200) { + // console.log('댓글 작성 성공:', response.data.message); + await fetchComments(); + } else { + console.log('댓글 작성 실패:', response.data.message); + } } catch (error) { console.log('댓글 작성 중 오류 발생:', error); } @@ -383,6 +382,13 @@ const handleCommentSubmit = async ({ comment, password }) => { // 대댓글 작성 const handleCommentReply = async (reply) => { try { + console.log('대댓글 작성 요청 데이터:', { + LOCBRDSEQ: currentBoardId.value, + LOCCMTRPY: reply.comment, + LOCCMTPWD: reply.password || null, + LOCCMTPNT: reply.parentId + }); + const response = await axios.post(`board/${currentBoardId.value}/comment`, { LOCBRDSEQ: currentBoardId.value, LOCCMTRPY: reply.comment, @@ -390,12 +396,19 @@ const handleCommentReply = async (reply) => { LOCCMTPNT: reply.parentId }); + // 응답 데이터를 자세히 로그로 확인 + console.log('대댓글 작성 응답:', { + status: response.status, + data: response.data, + headers: response.headers + }); + if (response.status === 200) { - if (response.data.code === 200) { - // console.log('대댓글 작성 성공:', response.data); - await fetchComments(); + if (response.data.code === 200) { // 서버 응답 코드도 확인 + console.log('대댓글 작성 성공:', response.data); + await fetchComments(); // 댓글 목록 새로고침 } else { - // console.log('대댓글 작성 실패 - 서버 응답:', response.data); + console.log('대댓글 작성 실패 - 서버 응답:', response.data); alert('대댓글 작성에 실패했습니다.'); } } @@ -428,6 +441,12 @@ const deleteClick = (unknown) => { // 댓글 수정 버튼 클릭 const editComment = (comment) => { + if (comment.isEditTextarea) { + // 이미 수정창이 열려 있으면 닫기 + comment.isEditTextarea = false; + return; + } + if (unknown.value) { toggleCommentPassword(comment, "edit"); } else { @@ -449,12 +468,21 @@ const editComment = (comment) => { // 댓글 삭제 버튼 클릭 const deleteComment = (comment) => { if (unknown.value) { - toggleCommentPassword(comment, "delete"); + if (comment.isEditTextarea) { + // 현재 수정 중이라면 수정 모드를 끄고, 삭제 비밀번호 입력창을 띄움 + comment.isEditTextarea = false; + comment.isCommentPassword = true; + } else { + // 수정 중이 아니면 기존의 삭제 비밀번호 입력창을 띄우는 로직 실행 + toggleCommentPassword(comment, "delete"); + } } else { + // 로그인 사용자 바로 삭제 comments.value = comments.value.filter(c => c.commentId !== comment.commentId); } }; +// 익명 비밀번호 창 토글 const toggleCommentPassword = (comment, button) => { if (lastCommentClickedButton.value === button && comment.isCommentPassword) { comment.isCommentPassword = false; @@ -525,7 +553,7 @@ const submitPassword = async () => { // 댓글 비밀번호 제출 const submitCommentPassword = async (comment, password) => { if (!password) { - passwordAlert.value = "비밀번호를 입력해주세요."; + passwordCommentAlert.value = "비밀번호를 입력해주세요."; return; } @@ -536,7 +564,6 @@ const submitCommentPassword = async (comment, password) => { }); if (response.data.code === 200 && response.data.data === true) { - // password = ''; comment.isCommentPassword = false; if (lastCommentClickedButton.value === "edit") { @@ -548,10 +575,10 @@ const submitCommentPassword = async (comment, password) => { } lastCommentClickedButton.value = null; } else { - passwordAlert.value = "비밀번호가 일치하지 않습니다."; + passwordCommentAlert.value = "비밀번호가 일치하지 않습니다."; } } catch (error) { - passwordAlert.value = "비밀번호 검증 중 오류가 발생했습니다."; + passwordCommentAlert.value = "비밀번호 검증 중 오류가 발생했습니다."; } }; @@ -582,24 +609,31 @@ const deletePost = async () => { // 댓글 삭제 const deleteReplyComment = async (comment) => { if (!confirm("정말 이 댓글을 삭제하시겠습니까?")) return; + // console.log("댓글 ID:", comment); try { const response = await axios.delete(`board/comment/${comment.commentId}`, { data: { LOCCMTSEQ: comment.commentId } }); + // console.log("서버 응답:", response.data); + if (response.data.code === 200) { + // console.log("댓글 삭제 성공!"); await fetchComments(); } else { + // console.log("댓글 삭제 실패:", response.data.message); alert("댓글 삭제에 실패했습니다."); } } catch (error) { + console.log("댓글 삭제 중 오류 발생:", error); alert("댓글 삭제 중 오류가 발생했습니다."); } }; // 댓글 수정 취소 const handleCancelEdit = (comment) => { + console.log("BoardView.vue - 댓글 수정 취소:", comment); comment.isEditTextarea = false; };