댓글 수정 삭제 보완

src/components/board/BoardComment.vue

@@ -25,7 +25,7 @@
                 />
                 <button class="btn btn-primary" @click="logPasswordAndEmit">확인</button>
             </div>
-            <span v-if="passwordAlert" class="invalid-feedback d-block text-start">{{ passwordAlert }}</span>
+            <span v-if="passwordCommentAlert" class="invalid-feedback d-block text-start">{{ passwordCommentAlert }}</span>
         </div>
         
 
@@ -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) => {

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
     }

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) {
+        if (response.status === 200) {
-        //     console.log('댓글 작성 성공:', response.data.message);
+            // console.log('댓글 작성 성공:', response.data.message);
-        //     await fetchComments();
+            await fetchComments();
-        // } else {
+        } else {
-        //     console.log('댓글 작성 실패:', response.data.message);
+            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) {
+            if (response.data.code === 200) {  // 서버 응답 코드도 확인
-                // console.log('대댓글 작성 성공:', response.data);
+                console.log('대댓글 작성 성공:', response.data);
-                await fetchComments();
+                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;
 };