익명게시물일때 댓글 삭제 수정중
This commit is contained in:
parent
4bab9ed5f0
commit
66fb1f204e
@ -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>
|
||||||
|
|||||||
@ -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) => {
|
||||||
|
|||||||
@ -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);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user