1

src/views/board/BoardView.vue

@@ -36,7 +36,7 @@
                                     />
                                     <button class="btn btn-primary" @click="submitPassword">확인</button>
                                 </div>
-                                <span v-if="passwordAlert" class="invalid-feedback d-block text-start">{{ passwordAlert }}</span>
+                                <span v-if="boardPasswordAlert" class="invalid-feedback d-block text-start">{{ boardPasswordAlert }}</span>
                             </div>
                         </div>
                     </div>
@@ -210,6 +210,7 @@
     const isEditTextarea = ref(false);
     const isDeleted = ref(true);
     const commentAlert = ref('');
+    const boardPasswordAlert = ref('');
 
     const updatePassword = newPassword => {
         password.value = newPassword;
@@ -368,6 +369,9 @@
 
     // 댓글 작성
     const handleCommentSubmit = async data => {
+        closeAllEditTextareas();
+        closeAllPasswordareas();
+        togglePassword('close');
         if (!data) {
             return;
         }
@@ -524,6 +528,12 @@
         });
     };
 
+    const closeAllPasswordareas = () => {
+        currentPasswordCommentId.value = null; // 비밀번호 창 닫기
+        password.value = '';
+        passwordCommentAlert.value = '';
+    };
+
     // 댓글 삭제 버튼 클릭
     const deleteComment = async comment => {
         const isMyComment = comment.authorId === currentUserId.value;
@@ -556,19 +566,27 @@
     };
 
     const togglePassword = button => {
+        // close: 게시글 비밀번호 란을 초기화 한다.
+        if (button === 'close') {
+            isPassword.value = false;
+            boardPasswordAlert.value = '';
+            return;
+        }
+
         if (lastClickedButton.value === button) {
             isPassword.value = !isPassword.value;
+            boardPasswordAlert.value = '';
         } else {
             isPassword.value = true;
         }
+
         lastClickedButton.value = button;
     };
 
     // 게시글 비밀번호 제출
     const submitPassword = async () => {
         if (!password.value.trim()) {
-            passwordAlert.value = '비밀번호를 입력해주세요.';
+            boardPasswordAlert.value = '비밀번호를 입력해주세요.';
-
             return;
         }
 
@@ -579,7 +597,7 @@
             });
 
             if (response.data.code === 200 && response.data.data === true) {
-                password.value = '';
+                boardPasswordAlert.value = '';
                 isPassword.value = false;
 
                 if (lastClickedButton.value === 'edit') {
@@ -589,10 +607,10 @@
                 }
                 lastClickedButton.value = null;
             } else {
-                passwordAlert.value = '비밀번호가 일치하지 않습니다.';
+                boardPasswordAlert.value = '비밀번호가 일치하지 않습니다.';
             }
         } catch (error) {
-            if (error.response && error.response.status === 401) passwordAlert.value = '비밀번호가 일치하지 않습니다.';
+            if (error.response && error.response.status === 401) boardPasswordAlert.value = '비밀번호가 일치하지 않습니다.';
         }
     };
 
@@ -702,6 +720,7 @@
 
     // 댓글 수정 확인
     const handleSubmitEdit = async (comment, editedContent) => {
+        togglePassword();
         try {
             const response = await axios.put(`board/comment/${comment.commentId}`, {
                 LOCCMTSEQ: comment.commentId,