공통 버튼으로 수정

src/components/board/BoardComment.vue

@@ -37,8 +37,9 @@
             <template v-if="comment.isEditTextarea">
                 <textarea v-model="localEditedContent" class="form-control"></textarea>
                 <div class="mt-2 d-flex justify-content-end">
-                    <button class="btn btn-secondary me-2" @click="$emit('cancelEdit', comment)">취소</button>
+                    <!-- <button class="btn btn-secondary me-2" @click="$emit('cancelEdit', comment)">취소</button> -->
-                    <button class="btn btn-primary" @click="submitEdit">수정</button>
+                    <!-- <button class="btn btn-primary" @click="submitEdit">수정</button> -->
+                    <SaveBtn class="btn btn-primary" @click="submitEdit"></SaveBtn>
                 </div>
             </template>
             <template v-else>
@@ -83,6 +84,7 @@ import { defineProps, defineEmits, ref, computed, watch } from 'vue';
 import BoardProfile from './BoardProfile.vue';
 import BoardCommentArea from './BoardCommentArea.vue';
 import PlusButton from '../button/PlusBtn.vue';
+import SaveBtn from '../button/SaveBtn.vue';
 
 const props = defineProps({
     comment: {

src/components/board/BoardCommentList.vue

@@ -12,13 +12,13 @@
                 :isCommentPassword="comment.isCommentPassword" 
                 :isEditTextarea="comment.isEditTextarea"
                 :passwordCommentAlert="passwordCommentAlert"
-                @editClick="$emit('editClick', comment)"
+                @editClick="handleEditClick"
-                @deleteClick="$emit('deleteClick', comment)"
+                @deleteClick="handleDeleteClick"
                 @submitPassword="submitPassword"
                 @submitComment="submitComment"
                 @commentDeleted="handleCommentDeleted"
-                @submitEdit="(comment, editedContent) => $emit('submitEdit', comment, editedContent)"
+                @submitEdit="handleSubmitEdit"
-                @cancelEdit="$emit('cancelEdit', comment)"
+                @cancelEdit="handleCancelEdit"
                 @updateReaction="(reactionData) => handleUpdateReaction(reactionData, comment.commentId, comment.boardId)"
             />
         </li>
@@ -76,4 +76,28 @@ const handleUpdateReaction = (reactionData, commentId, boardId) => {
 const submitPassword = (comment, password) => {
     emit('submitPassword', comment, password);
 };
+
+const handleEditClick = (comment) => {
+    emit('editClick', comment);
+};
+
+const handleSubmitEdit = (comment, editedContent) => {
+    emit("submitEdit", comment, editedContent);
+};
+
+const handleDeleteClick = (comment) => {
+    if (comment.parentId) {
+        emit('deleteClick', comment); // 대댓글 삭제
+    } else {
+        emit('deleteClick', comment); // 댓글 삭제
+    }
+};
+
+const handleCancelEdit = (comment) => {
+    if (comment.parentId) {
+        emit('cancelEdit', comment); // 대댓글 수정 취소
+    } else {
+        emit('cancelEdit', comment); // 댓글 수정 취소
+    }
+};
 </script>