익명게시물일때 댓글 삭제 수정중

This commit is contained in:
kimdaae328 2025-02-25 13:27:57 +09:00
parent 4bab9ed5f0
commit 66fb1f204e
3 changed files with 52 additions and 39 deletions

View File

@ -17,6 +17,7 @@
rows="3" rows="3"
v-model="comment" v-model="comment"
></textarea> ></textarea>
<span v-if="commentAlert" class="invalid-feedback d-block text-start ms-2">{{ commentAlert }}</span>
</div> </div>
</div> </div>
@ -42,6 +43,7 @@
id="basic-default-password" id="basic-default-password"
class="form-control flex-grow-1" class="form-control flex-grow-1"
v-model="password" v-model="password"
placeholder="비밀번호 입력"
/> />
<span v-if="passwordAlert" class="invalid-feedback d-block text-start ms-2">{{ passwordAlert }}</span> <span v-if="passwordAlert" class="invalid-feedback d-block text-start ms-2">{{ passwordAlert }}</span>
</div> </div>
@ -74,6 +76,10 @@ const props = defineProps({
passwordAlert: { passwordAlert: {
type: String, type: String,
default: false default: false
},
commentAlert: {
type: String,
default: false
} }
}); });
@ -87,11 +93,16 @@ function handleCommentSubmit() {
emit('submitComment', { emit('submitComment', {
comment: comment.value, comment: comment.value,
password: isCheck.value ? password.value : '', password: isCheck.value ? password.value : '',
isCheck: isCheck.value
}); });
comment.value = '';
password.value = '';
} }
watch(() => props.passwordAlert, () => {
if (!props.passwordAlert) {
comment.value = '';
password.value = '';
}
});
</script> </script>

View File

@ -21,9 +21,8 @@
</div> </div>
<!-- 버튼 영역 --> <!-- 버튼 영역 -->
<div class="ms-auto text-end"> <div class="ms-auto text-end">
<!-- 수정, 삭제 버튼 --> <!-- 수정, 삭제 버튼 - 익명일때 본인일때 (게시글, 댓글)-->
<!-- <template v-if="isAuthor || showDetail"> --> <template v-if="unknown || isCommentAuthor || isAuthor">
<template v-if="isCommentAuthor || isAuthor">
<EditButton @click.stop="editClick" /> <EditButton @click.stop="editClick" />
<DeleteButton @click.stop="deleteClick" /> <DeleteButton @click.stop="deleteClick" />
</template> </template>
@ -101,12 +100,12 @@ const emit = defineEmits(['updateReaction', 'editClick', 'deleteClick']);
// //
const editClick = () => { const editClick = () => {
emit('editClick', props.comment); emit('editClick', { ...props.comment, unknown: props.unknown });
}; };
// //
const deleteClick = () => { const deleteClick = () => {
emit('deleteClick', props.comment); emit('deleteClick', { ...props.comment, unknown: props.unknown });
}; };
const handleUpdateReaction = (reactionData) => { const handleUpdateReaction = (reactionData) => {

View File

@ -94,6 +94,7 @@
<BoardCommentArea <BoardCommentArea
:profileName="profileName" :profileName="profileName"
:unknown="unknown" :unknown="unknown"
:commentAlert="commentAlert"
:passwordAlert="passwordAlert" :passwordAlert="passwordAlert"
@submitComment="handleCommentSubmit" @submitComment="handleCommentSubmit"
/> />
@ -185,6 +186,7 @@ const isCommentPassword = ref(false);
const lastClickedButton = ref(""); const lastClickedButton = ref("");
const lastCommentClickedButton = ref(""); const lastCommentClickedButton = ref("");
const isEditTextarea = ref(false); const isEditTextarea = ref(false);
const commentAlert = ref('')
const pagination = ref({ const pagination = ref({
currentPage: 1, currentPage: 1,
@ -208,7 +210,7 @@ const fetchBoardDetails = async () => {
const response = await axios.get(`board/${currentBoardId.value}`); const response = await axios.get(`board/${currentBoardId.value}`);
const data = response.data.data; const data = response.data.data;
console.log(data) // console.log(data)
// API // API
// const boardDetail = data.boardDetail || {}; // const boardDetail = data.boardDetail || {};
@ -218,6 +220,9 @@ const fetchBoardDetails = async () => {
// //
// profileName.value = ''; // profileName.value = '';
console.log("📌 게시글 작성자:", profileName.value); //
console.log("🔍 익명 여부 (unknown.value):", unknown.value); //
authorId.value = data.authorId; // id authorId.value = data.authorId; // id
boardTitle.value = data.title || '제목 없음'; boardTitle.value = data.title || '제목 없음';
@ -368,33 +373,37 @@ const fetchComments = async (page = 1) => {
console.log('댓글 목록 불러오기 오류:', error); console.log('댓글 목록 불러오기 오류:', error);
} }
}; };
// const isSubmitting = ref(false);
// //
const handleCommentSubmit = async ({ comment, password }) => { const handleCommentSubmit = async ({ comment, password, isCheck }) => {
// console.log('')
//
if (comment.trim() === "") {
commentAlert.value = '댓글을 입력해주세요.';
return;
} else {
commentAlert.value = '';
}
// //
if (unknown && !password) { if (unknown.value && isCheck && !password) {
passwordAlert.value = "비밀번호를 입력해야 합니다."; passwordAlert.value = "비밀번호를 입력해야 합니다.";
return; return;
} }
// console.log(' ')
//
// if (isSubmitting.value) return;
// isSubmitting.value = true;
try { try {
const response = await axios.post(`board/${currentBoardId.value}/comment`, { const response = await axios.post(`board/${currentBoardId.value}/comment`, {
LOCBRDSEQ: currentBoardId.value, LOCBRDSEQ: currentBoardId.value,
LOCCMTRPY: comment, LOCCMTRPY: comment,
LOCCMTPWD: password, LOCCMTPWD: isCheck ? password : '', //
LOCCMTPNT: 1 LOCCMTPNT: 1
}); });
console.log('여기',response)
if (response.status === 200) { if (response.status === 200) {
console.log('댓글 작성 성공:', response.data.message); console.log('댓글 작성 성공:', response.data.message);
passwordAlert.value = '';
commentAlert.value = '';
await fetchComments(); await fetchComments();
} else { } else {
console.log('댓글 작성 실패:', response.data.message); console.log('댓글 작성 실패:', response.data.message);
@ -408,13 +417,6 @@ const handleCommentSubmit = async ({ comment, password }) => {
// ( `BoardCommentList` ) // ( `BoardCommentList` )
const handleCommentReply = async (reply) => { const handleCommentReply = async (reply) => {
try { 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`, { const response = await axios.post(`board/${currentBoardId.value}/comment`, {
LOCBRDSEQ: currentBoardId.value, LOCBRDSEQ: currentBoardId.value,
LOCCMTRPY: reply.comment, LOCCMTRPY: reply.comment,
@ -422,13 +424,6 @@ const handleCommentReply = async (reply) => {
LOCCMTPNT: reply.parentId LOCCMTPNT: reply.parentId
}); });
//
// console.log(' :', {
// status: response.status,
// data: response.data,
// headers: response.headers
// });
if (response.status === 200) { if (response.status === 200) {
if (response.data.code === 200) { // if (response.data.code === 200) { //
console.log('대댓글 작성 성공:', response.data); console.log('대댓글 작성 성공:', response.data);
@ -449,7 +444,9 @@ const handleCommentReply = async (reply) => {
// //
const editClick = (unknown) => { const editClick = (unknown) => {
if (unknown) { const isUnknown = unknown?.unknown ?? false;
if (isUnknown) {
togglePassword("edit"); togglePassword("edit");
} else { } else {
router.push({ name: "BoardEdit", params: { id: currentBoardId.value } }); router.push({ name: "BoardEdit", params: { id: currentBoardId.value } });
@ -480,7 +477,7 @@ const findCommentById = (commentId, commentsList) => {
// //
const editComment = (comment) => { const editComment = (comment) => {
// console.log(' ') console.log('대댓글 수정 버튼 클릭')
// //
const targetComment = findCommentById(comment.commentId, comments.value); const targetComment = findCommentById(comment.commentId, comments.value);
@ -501,8 +498,14 @@ const editComment = (comment) => {
// //
const deleteComment = async (comment) => { const deleteComment = async (comment) => {
console.log('🗑 댓글 삭제 시도:', comment);
// //
if (unknown.value) { const isMyComment = comment.authorId === currentUserId.value;
if (unknown.value && !isMyComment) {
console.log('🛑 익명 사용자의 댓글 삭제 시도 (비밀번호 필요)');
if (comment.isEditTextarea) { if (comment.isEditTextarea) {
// , // ,
comment.isEditTextarea = false; comment.isEditTextarea = false;
@ -512,8 +515,8 @@ const deleteComment = async (comment) => {
toggleCommentPassword(comment, "delete"); toggleCommentPassword(comment, "delete");
} }
} else { } else {
// ( ) console.log('✅ 로그인 사용자 댓글 삭제 진행');
deleteReplyComment(comment) deleteReplyComment(comment);
} }
}; };