Merge branch 'main' of http://192.168.0.251:3000/localnet/localhost-front

src/components/board/BoardComment.vue

@@ -9,15 +9,16 @@
             :comment="comment"
             :showDetail="false"
             :isLike="!isLike"
-            :isCommentPassword="comment.isCommentPassword"
+            :isCommentPassword="isCommentPassword"
             :isCommentProfile="true"
             @editClick="aaaa"
             @deleteClick="$emit('deleteClick', comment)"
             @updateReaction="handleUpdateReaction"
             />
+            <!-- <P>Commentpassssss: {{isCommentPassword}}</P> -->
             <!-- :author="true" -->
         <!-- 댓글 비밀번호 입력창 (익명일 경우) -->
-        <div v-if="isCommentPassword && unknown" class="mt-3 w-25 ms-auto">
+        <div v-if="isCommentPassword === comment.commentId && unknown" class="mt-3 w-25 ms-auto">
             <div class="input-group">
                 <input
                     type="password"
@@ -37,8 +38,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>
@@ -59,6 +61,7 @@
             <!-- <p>대댓글 데이터(JSON): {{ JSON.stringify(child, null, 2) }}</p> -->
             <!-- <p>comment child: {{ comment.children }}</p> -->
             <!-- :unknown="child.author === '익명'" -->
+            <p>child.isCommentPassword: {{ child.isCommentPassword }}</p>
                 <BoardComment
                     :comment="child"
                     :unknown="child.author === '익명'"
@@ -66,6 +69,7 @@
                     :isLike="true"
                     :isCommentProfile="true"
                     :isCommentAuthor="child.isCommentAuthor"
+                    :isCommentPassword="isCommentPassword"
                     @editClick="$emit('editClick', $event)"
                     @deleteClick="$emit('deleteClick', child)"
                     @submitEdit="(comment, editedContent) => $emit('submitEdit', comment, editedContent)"
@@ -83,6 +87,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: {
@@ -91,7 +96,7 @@ const props = defineProps({
     },
     unknown: {
         type: Boolean,
-        default: true,
+        default: false,
     },
     isCommentAuthor: {
         type: Boolean,

src/components/board/BoardCommentArea.vue

@@ -4,11 +4,11 @@
             <!-- 댓글 입력 섹션 -->
             <div class="d-flex justify-content-start align-items-top">
                 <!-- 프로필섹션 -->
-                <div class="avatar-wrapper">
+                <!-- <div class="avatar-wrapper">
                     <div v-if="!unknown" class="avatar me-4">
                         <img src="/img/avatars/11.png" alt="Avatar" class="rounded-circle">
                     </div>
-                </div>
+                </div> -->
                 <!-- 텍스트박스 -->
                 <div class="w-100">
                     <textarea
@@ -95,7 +95,6 @@ function handleCommentSubmit() {
         password: isCheck.value ? password.value : '',
         isCheck: isCheck.value,
         LOCBRDTYP,  // 익명일 경우 '300102' 설정
-        isCheck: isCheck.value
     });
 }
 

src/components/board/BoardCommentList.vue

@@ -9,16 +9,16 @@
                 :unknown="unknown"
                 :comment="comment"
                 :isCommentAuthor="comment.isCommentAuthor"
-                :isCommentPassword="comment.isCommentPassword" 
                 :isEditTextarea="comment.isEditTextarea"
+                :isCommentPassword="isCommentPassword" 
                 :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>

src/components/board/BoardProfile.vue

@@ -23,7 +23,7 @@
         <div class="ms-auto text-end">
             <!-- 수정, 삭제 버튼 -->
             <!-- <template v-if="isAuthor || showDetail"> -->
-            <template v-if="isCommentProfile ? isCommentAuthor : isAuthor">
+            <template v-if="unknown || isCommentAuthor || isAuthor">
                 <EditButton @click.stop="editClick" />
                 <DeleteButton @click.stop="deleteClick" />
             </template>
@@ -62,7 +62,6 @@ const props = defineProps({
     },
     profileName: {
         type: String,
-        default: '익명',
         default: '',
     },
     unknown: {
@@ -102,13 +101,12 @@ const emit = defineEmits(['updateReaction', 'editClick', 'deleteClick']);
 
 // 수정
 const editClick = () => {
-    console.log('클릭 확인')
+    emit('editClick', { ...props.comment, unknown: props.unknown });
-    emit('editClick', props.unknown);
 };
 
 // 삭제
 const deleteClick = () => {
-    emit('deleteClick', props.unknown);
+    emit('deleteClick', { ...props.comment, unknown: props.unknown });
 };
 
 const handleUpdateReaction = (reactionData) => {

src/views/board/BoardList.vue

@@ -4,7 +4,7 @@
             <div class="card-header">
                 <!-- 검색창 -->
                 <div class="container col-6 mt-12 mb-8">
-                    <search-bar @update:data="search" />
+                    <search-bar @update:data="search" @keyup.enter="searchOnEnter"/>
                 </div>
             </div>
             <div class="card-datatable">
@@ -57,7 +57,7 @@
                                     class="bg-label-gray fw-bold"
                                     @click="goDetail(notice.id)">
                                     <td class="text-center">공지</td>
-                                    <td>
+                                    <td class="cursor-pointer">
                                         📌 {{ notice.title }}
                                         <i v-if="notice.img" class="bi bi-image me-1"></i>
                                         <i v-if="notice.hasAttachment" class="bi bi-paperclip"></i>
@@ -74,7 +74,7 @@
                                 class="invert-bg-white"
                                 @click="goDetail(post.realId)">
                                 <td class="text-center">{{ post.id }}</td>
-                                <td>
+                                <td class="cursor-pointer">
                                     {{ post.title }}
                                     <i v-if="post.img" class="bi bi-image me-1"></i>
                                     <i v-if="post.hasAttachment" class="bi bi-paperclip"></i>
@@ -86,6 +86,12 @@
                             </tr>
                         </tbody>
                     </table>
+                    <!-- 검색 결과가 없을 때 -->
+                    <div v-if="generalList.length === 0">
+                        <p class="text-center pt-10 mt-2 mb-0 text-muted">
+                            검색 결과가 없습니다.
+                        </p>
+                    </div>
                 </div>
             </div>
             <div class="card-footer">
@@ -189,10 +195,10 @@ const fetchGeneralPosts = async (page = 1) => {
         });
 
         if (data?.data) {
-            console.log(data)
+            // console.log(data)
             const totalPosts = data.data.total; // 전체 게시물 개수 받아오기
 
-            console.log('📌 API 응답 데이터:', data.data);
+            // console.log('📌 API 응답 데이터:', data.data);
 
             generalList.value = data.data.list.map((post, index) => ({
                 realId: post.id,
@@ -251,6 +257,18 @@ const fetchNoticePosts = async () => {
     }
 };
 
+// Enter 키를 눌렀을 때
+const searchOnEnter = (event) => {
+    const searchTextValue = event.target.value.trim();
+
+    if (!searchTextValue || searchTextValue[0] === ' ') {
+        return; // 검색어가 비어있거나 첫 글자가 공백이면 실행 안 함
+    }
+
+    searchText.value = searchTextValue;
+    fetchGeneralPosts(1);
+};
+
 // 페이지 변경
 const handlePageChange = (page) => {
     if (page !== pagination.value.currentPage) {

src/views/board/BoardView.vue

@@ -106,7 +106,7 @@
                         <BoardCommentList
                             :unknown="unknown"
                             :comments="commentsWithAuthStatus"
-                            :isCommentPassword="isCommentPassword"
+                            :isCommentPassword="Boolean(isCommentPassword)"
                             :isEditTextarea="isEditTextarea"
                             :passwordCommentAlert="passwordCommentAlert"
                             @editClick="editComment"
@@ -170,7 +170,7 @@ const commentsWithAuthStatus = computed(() => {
         isCommentAuthor: comment.authorId === currentUserId.value,
         children: comment.children.map(reply => ({
             ...reply,
-            isCommentAuthor: reply.authorId === currentUserId.value
+            isCommentAuthor: reply.authorId === currentUserId.value,
         }))
     }));
     // console.log("✅ commentsWithAuthStatus 업데이트됨:", updatedComments);
@@ -220,8 +220,8 @@ const fetchBoardDetails = async () => {
         // 익명확인하고 싶을때
         // profileName.value = '익명';
 
-        console.log("📌 게시글 작성자:", profileName.value); // 작성자 이름 출력
+        // console.log("📌 게시글 작성자:", profileName.value); // 작성자 이름 출력
-        console.log("🔍 익명 여부 (unknown.value):", unknown.value); // 익명 여부 확인
+        // console.log("🔍 익명 여부 (unknown.value):", unknown.value); // 익명 여부 확인
 
 
         authorId.value = data.authorId; //게시글 작성자 id
@@ -263,7 +263,8 @@ const handleUpdateReaction = async ({ boardId, commentId, isLike, isDislike }) =
         // console.log("갱신된 데이터:", updatedData);
 
     } catch (error) {
-        alert('반응을 업데이트하는 중 오류 발생');
+        alert('오류가 발생했습니다.');
+        // console.log('반응을 업데이트하는 중 오류가 발생했습니다.');
     }
 };
 
@@ -285,7 +286,8 @@ const handleCommentReaction = async ({ boardId, commentId, isLike, isDislike })
         await fetchComments();
 
     } catch (error) {
-        alert('댓글 반응을 업데이트하는 중 오류 발생');
+        alert('오류가 발생했습니다.');
+        // console.log('댓글 반응을 업데이트하는 중 오류 발생');
     }
 };
 
@@ -370,7 +372,8 @@ const fetchComments = async (page  = 1) => {
 
 
     } catch (error) {
-        console.log('댓글 목록 불러오기 오류:', error);
+        alert('오류가 발생했습니다.');
+        // alert('댓글 목록 불러오기 오류:', error);
     }
 };
 
@@ -382,7 +385,6 @@ const handleCommentSubmit = async (data, isCheck) => {
     }
 
     const { comment, password } = data;
-    const LOCBRDTYP = data.LOCBRDTYP || null;
 
     if (!comment || comment.trim() === "") {
         commentAlert.value = '댓글을 입력해주세요.';
@@ -402,19 +404,21 @@ const handleCommentSubmit = async (data, isCheck) => {
             LOCCMTRPY: comment,
             LOCCMTPWD: isCheck ? password : '',
             LOCCMTPNT: 1,
-            LOCBRDTYP
+            LOCBRDTYP: unknown.value ? "300102" : null
         });
 
         if (response.status === 200) {
-            console.log('댓글 작성 성공:', response.data.message);
+            // console.log('댓글 작성 성공:', response.data.message);
             passwordAlert.value = '';
             commentAlert.value = '';
             await fetchComments();
         } else {
-            console.error('댓글 작성 실패:', response.data.message);
+            // console.error('댓글 작성 실패:', response.data.message);
+            alert("댓글 작성을 실패했습니다.")
         }
     } catch (error) {
-        console.error('댓글 작성 중 오류 발생:', error);
+        // console.error('댓글 작성 중 오류 발생:', error);
+        alert("오류가 발생했습니다.")
     }
 };
 
@@ -431,19 +435,21 @@ const handleCommentReply = async (reply) => {
 
         if (response.status === 200) {
             if (response.data.code === 200) {  // 서버 응답 코드도 확인
-                console.log('대댓글 작성 성공:', response.data);
+                // console.log('대댓글 작성 성공:', response.data);
                 await fetchComments();  // 댓글 목록 새로고침
             } else {
-                console.log('대댓글 작성 실패 - 서버 응답:', response.data);
+                // console.log('대댓글 작성 실패 - 서버 응답:', response.data);
-                alert('대댓글 작성에 실패했습니다.');
+                alert('대댓글 작성을 실패했습니다.');
             }
         }
     } catch (error) {
-        console.error('대댓글 작성 중 오류 발생:', error);
+        // console.error('대댓글 작성 중 오류 발생:', error);
         if (error.response) {
-            console.error('서버 응답 에러:', error.response.data);
+            // console.error('서버 응답 에러:', error.response.data);
+            alert("오류가 발생했습니다.");
         }
-        alert('대댓글 작성 중 오류가 발생했습니다.');
+        alert("오류가 발생했습니다.");
+
     }
 }
 
@@ -482,36 +488,37 @@ const findCommentById = (commentId, commentsList) => {
 
 // 댓글 수정 버튼 클릭
 const editComment = (comment) => {
-    console.log('대댓글 수정 버튼 클릭')
 
     // 부모 또는 대댓글을 찾아서 가져오기
     const targetComment = findCommentById(comment.commentId, comments.value);
 
     if (!targetComment) {
-        console.log("대댓글을 찾을 수 없음:", comment.commentId);
         return;
     }
 
-    // 수정 text창 열림, 닫힘 유무 토글
+    // 댓글 작성자가 현재 로그인한 사용자와 동일한지 확인
-    targetComment.isEditTextarea = !targetComment.isEditTextarea;
+    const isMyComment = comment.authorId === currentUserId.value;
+    const isAnonymous = comment.author === "익명";
 
-    // 익명일 경우 비밀번호 입력창 활성화
+    if (isMyComment) {
-    if (unknown.value) {
+        // 본인 댓글이면 바로 수정 모드 활성화
-        console.log('익명 코멘트인가?')
+        targetComment.isEditTextarea = true;
+    } else if (isAnonymous) {
+        // 익명 댓글이면 비밀번호 입력창 띄우기
         toggleCommentPassword(comment, "edit");
+
+    } else {
+        // console.log("다른 사용자 댓글 - 수정 불가");
+        alert("수정이 불가능합니다");
     }
 }
 
 // 댓글 삭제 버튼 클릭
 const deleteComment = async (comment) => {
-    console.log('🗑 댓글 삭제 시도:', comment);
-
     // 익명 사용자인 경우
     const isMyComment = comment.authorId === currentUserId.value;
 
     if (unknown.value && !isMyComment) {
-        console.log('🛑 익명 사용자의 댓글 삭제 시도 (비밀번호 필요)');
-
         if (comment.isEditTextarea) {
             // 현재 수정 중이라면 수정 모드를 끄고, 삭제 비밀번호 입력창을 띄움
             comment.isEditTextarea = false;
@@ -521,26 +528,23 @@ const deleteComment = async (comment) => {
             toggleCommentPassword(comment, "delete");
         }
     } else {
-        console.log('✅ 로그인 사용자 댓글 삭제 진행');
         deleteReplyComment(comment);
     }
 };
 
 // 익명 비밀번호 창 토글
 const toggleCommentPassword = (comment, button) => {
-    if (lastCommentClickedButton.value === button && comment.isCommentPassword) {
+    if (lastCommentClickedButton.value === button && isCommentPassword.value === comment.commentId) {
-        comment.isCommentPassword = false;
+        isCommentPassword.value = false; // 비밀번호 창 닫기
     } else {
-        // 모든 댓글의 비밀번호 입력창 닫기
+        isCommentPassword.value = comment.commentId; // 비밀번호 창 열기
-        comments.value.forEach(c => (c.isCommentPassword = false));
-
-        // 현재 선택된 댓글만 비밀번호 입력창 열기
-        comment.isCommentPassword = true;
     }
 
     lastCommentClickedButton.value = button;
 };
 
+
+
 const togglePassword = (button) => {
     if (lastClickedButton.value === button) {
         isPassword.value = !isPassword.value;
@@ -597,16 +601,21 @@ const submitPassword = async () => {
 // 댓글 삭제 (비밀번호 확인 후)
 const submitCommentPassword = async (comment, password) => {
 
+    // console.log("비밀번호 :", password);
+    // console.log("댓글 ID:", comment.commentId);
+
     if (!password) {
         passwordCommentAlert.value = "비밀번호를 입력해주세요.";
         return;
     }
 
     try {
+        // console.log('서버로 비밀번호 확인 요청')
         const response = await axios.post(`board/comment/${comment.commentId}/password`, {
             LOCCMTPWD: password,
             LOCCMTSEQ: comment.commentId,
         });
+        // console.log("✅ 서버 응답 데이터:", response.data);
 
         if (response.data.code === 200 && response.data.data === true) {
             passwordCommentAlert.value = "";
@@ -624,9 +633,14 @@ const submitCommentPassword = async (comment, password) => {
             }
             lastCommentClickedButton.value = null;
         } else {
+            // console.log("❌ 비밀번호가 틀림");
             passwordCommentAlert.value = "비밀번호가 일치하지 않습니다.";
         }
     } catch (error) {
+        // console.log("🚨 서버 요청 중 오류 발생:", error.response?.data || error);
+        // if (error.response?.status === 401) {
+        //     console.log("❌ 401 오류: 인증 실패 (비밀번호 불일치)");
+        // }
         passwordCommentAlert.value = "비밀번호가 일치하지 않습니다";
     }
 };
@@ -675,7 +689,7 @@ const deleteReplyComment = async (comment) => {
             alert("댓글 삭제에 실패했습니다.");
         }
     } catch (error) {
-        console.log("댓글 삭제 중 오류 발생:", error);
+        // console.log("댓글 삭제 중 오류 발생:", error);
         alert("댓글 삭제 중 오류가 발생했습니다.");
     }
 };
@@ -698,13 +712,16 @@ const handleSubmitEdit = async (comment, editedContent) => {
                 targetComment.content = editedContent; // 댓글 내용 업데이트
                 targetComment.isEditTextarea = false; // 수정 모드 닫기
             } else {
-                console.warn("❌ 수정할 댓글을 찾을 수 없음");
+                // console.warn("❌ 수정할 댓글을 찾을 수 없음");
+                alert("수정할 댓글을 찾을 수 없습니다.");
             }
         } else {
-            console.log("❌ 댓글 수정 실패:", response.data);
+            // console.log("❌ 댓글 수정 실패:", response.data);
+            alert("댓글 수정 실패했습니다.");
         }
     } catch (error) {
-        console.error("댓글 수정 중 오류 발생:", error);
+        // console.error("댓글 수정 중 오류 발생:", error);
+        alert("댓글 수정 중 오류 발생했습니다.");
     }
 };
 
@@ -713,10 +730,11 @@ const handleCancelEdit = (comment) => {
     const targetComment = findCommentById(comment.commentId, comments.value);
 
     if (targetComment) {
-        console.log("✅ 원본 데이터 찾음, 수정 취소 처리 가능:", targetComment);
+        // console.log("✅ 원본 데이터 찾음, 수정 취소 처리 가능:", targetComment);
         targetComment.isEditTextarea = false;
     } else {
-        console.error("❌ 원본 데이터 찾을 수 없음, 수정 취소 실패");
+        // console.error("❌ 원본 데이터 찾을 수 없음, 수정 취소 실패");
+        alert("수정 취소를 실패했습니다.");
     }
 };
 
@@ -747,7 +765,7 @@ const handleCommentDeleted = (deletedCommentId) => {
         }
     }
 
-    console.error("❌ 삭제할 댓글을 찾을 수 없음:", deletedCommentId);
+    // console.error("❌ 삭제할 댓글을 찾을 수 없음:", deletedCommentId);
 };