From 170e47281501209f1c2a763f114d65c590950d71 Mon Sep 17 00:00:00 2001
From: kimdaae328 <kimdaae328@gmail.com>
Date: Mon, 24 Feb 2025 15:11:37 +0900
Subject: [PATCH] =?UTF-8?q?=EC=9D=B5=EB=AA=85=EB=B6=80=EB=B6=84=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95=EC=A4=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/board/BoardComment.vue |  4 +-
 src/components/board/BoardProfile.vue |  1 +
 src/views/board/BoardView.vue         | 60 +++++++++++++++++----------
 3 files changed, 40 insertions(+), 25 deletions(-)

diff --git a/src/components/board/BoardComment.vue b/src/components/board/BoardComment.vue
index 2bcdc10..0dafc9a 100644
--- a/src/components/board/BoardComment.vue
+++ b/src/components/board/BoardComment.vue
@@ -8,14 +8,14 @@
             :date="comment.createdAt"
             :comment="comment"
             :showDetail="false"
-            :author="true"
             :isLike="!isLike"
             :isCommentPassword="comment.isCommentPassword"
             :isCommentProfile="true"
             @editClick="$emit('editClick', comment)"
             @deleteClick="$emit('deleteClick', comment)"
             @updateReaction="handleUpdateReaction"
-        />
+            />
+            <!-- :author="true" -->
         <!-- 댓글 비밀번호 입력창 (익명일 경우) -->
         <div v-if="isCommentPassword && unknown" class="mt-3 w-25 ms-auto">
             <div class="input-group">
diff --git a/src/components/board/BoardProfile.vue b/src/components/board/BoardProfile.vue
index a550136..f9aee8a 100644
--- a/src/components/board/BoardProfile.vue
+++ b/src/components/board/BoardProfile.vue
@@ -101,6 +101,7 @@ const emit = defineEmits(['updateReaction', 'editClick', 'deleteClick']);
 
 // 수정
 const editClick = () => {
+    console.log('클릭 확인')
     emit('editClick', props.unknown);
 };
 
diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue
index 268d358..ad4c5f6 100644
--- a/src/views/board/BoardView.vue
+++ b/src/views/board/BoardView.vue
@@ -163,6 +163,7 @@ const currentUserId = computed(() => userStore.user.id); // 현재 로그인한
 const authorId = ref(''); // 작성자 id
 
 const isAuthor = computed(() => currentUserId.value === authorId.value);
+// const isCommentAuthor =
 const commentsWithAuthStatus = computed(() => {
     const updatedComments = comments.value.map(comment => ({
         ...comment,
@@ -459,34 +460,32 @@ const deleteClick = (unknown) => {
     }
 };
 
-// 댓글 수정 버튼 클릭(대댓글 포함)
+// 댓글 수정 버튼 클릭
 const editComment = (comment) => {
-    if (comment.isEditTextarea) {
-        // 이미 수정창이 열려 있으면 닫기
-        comment.isEditTextarea = false;
+    const targetComment = comments.value.find(c => c.commentId === comment.commentId);
+    
+    if (!targetComment) {
         return;
     }
 
+    // 수정 text창 열림, 닫힘 유무
+    if (targetComment.isEditTextarea) {
+        targetComment.isEditTextarea = false;
+    } else {
+        targetComment.isEditTextarea = true;
+    }
+
+    // 익명일때
     if (unknown.value) {
         toggleCommentPassword(comment, "edit");
     } else {
         comment.isEditTextarea = true;
     }
-
-    // comments.value.forEach(c => {
-    //     c.isEditTextarea = false;
-    //     c.isCommentPassword = false;
-    // });
-
-    // if (comment.unknown) {  
-    //     comment.isCommentPassword = true;
-    // } else {
-    //     comment.isEditTextarea = true;
-    // }
 }
 
-// 댓글 삭제 버튼 클릭(대댓글 포함)
-const deleteComment = (comment) => {
+// 댓글 삭제 버튼 클릭
+const deleteComment = async (comment) => {
+    // 익명 사용자인 경우
     if (unknown.value) {
         if (comment.isEditTextarea) {
             // 현재 수정 중이라면 수정 모드를 끄고, 삭제 비밀번호 입력창을 띄움
@@ -497,8 +496,8 @@ const deleteComment = (comment) => {
             toggleCommentPassword(comment, "delete");
         }
     } else {
-        // 로그인 사용자 바로 삭제
-        comments.value = comments.value.filter(c => c.commentId !== comment.commentId);
+        // 로그인 사용자인 경우 (바로 삭제)
+        deleteReplyComment(comment)
     }
 };
 
@@ -656,7 +655,7 @@ const deleteReplyComment = async (comment) => {
     }
 };
 
-// 댓글 수정 확인 (대댓글 포함)
+// 댓글 수정 확인
 const handleSubmitEdit = async (comment, editedContent) => {
     try {
         const response = await axios.put(`board/comment/${comment.commentId}`, {
@@ -665,8 +664,14 @@ const handleSubmitEdit = async (comment, editedContent) => {
         });
 
         // 수정 성공 시 업데이트
-        comment.content = editedContent;
-        comment.isEditTextarea = false; 
+        // comment.content = editedContent;
+        // comment.isEditTextarea = false; 
+        if (response.status === 200) {
+            // 댓글 목록 새로고침
+            await fetchComments();
+        } else {
+            console.log("❌ 댓글 수정 실패:", response.data);
+        }
     } catch (error) {
         console.error("댓글 수정 중 오류 발생:", error);
     }
@@ -675,7 +680,16 @@ const handleSubmitEdit = async (comment, editedContent) => {
 // 댓글 수정 취소 (대댓글 포함)
 const handleCancelEdit = (comment) => {
     console.log("BoardView.vue - 댓글 수정 취소:", comment);
-    comment.isEditTextarea = false;
+
+    // 원본 comments 배열에서 동일한 comment 찾기
+    const targetComment = comments.value.find(c => c.commentId === comment.commentId);
+
+    if (targetComment) {
+        console.log("✅ 원본 데이터 찾음, 수정 취소 처리 가능");
+        targetComment.isEditTextarea = false;
+    } else {
+        console.error("❌ 원본 데이터 찾을 수 없음, 수정 취소 실패");
+    }
 };
 
 // 페이지 변경