diff --git a/src/views/board/BoardEdit.vue b/src/views/board/BoardEdit.vue index 4c4936d..8be6961 100644 --- a/src/views/board/BoardEdit.vue +++ b/src/views/board/BoardEdit.vue @@ -70,7 +70,7 @@ - @@ -120,6 +120,58 @@ const editorUploadedImgList = ref([]); const editorDeleteImgList = ref([]); + const originalTitle = ref(''); + const originalPlainText = ref(''); + const originalFiles = ref([]); + + + function extractPlainText(delta) { + if (!delta || !Array.isArray(delta.ops)) return ''; + return delta.ops + .filter(op => typeof op.insert === 'string') + .map(op => op.insert.trim()) + .join(' ') + .trim(); + } + + const isChanged = computed(() => { + const isTitleChanged = title.value !== originalTitle.value; + const currentPlainText = extractPlainText(content.value); + const isContentChanged = currentPlainText !== originalPlainText.value; + + const currentAttachedFiles = attachFiles.value.filter(f => f.id); + const isFilesChanged = + attachFiles.value.some(f => !f.id) || // id 없는 새 파일이 있는 경우 + delFileIdx.value.length > 0 || // 삭제된 파일이 있는 경우 + !isSameFiles( + attachFiles.value.filter(f => f.id), // 기존 파일(id 있는 것만) + originalFiles.value + ); + console.log(isTitleChanged); + console.log(isContentChanged); + console.log(isFilesChanged); + return isTitleChanged || isContentChanged || isFilesChanged; + }); + watch(isChanged, (val) => { + console.log('🔄 isChanged changed:', val); + }); + + + // 파일 비교 함수 + function isSameFiles(current, original) { + if (current.length !== original.length) return false; + + const sortedCurrent = [...current].sort((a, b) => a.id - b.id); + const sortedOriginal = [...original].sort((a, b) => a.id - b.id); + + return sortedCurrent.every((file, idx) => { + return ( + file.id === sortedOriginal[idx].id && + file.name === sortedOriginal[idx].name + ); + }); + } + // 게시물 데이터 로드 const fetchBoardDetails = async () => { // 수정 데이터 전송 @@ -139,15 +191,24 @@ const boardData = data.data; // 기존 첨부파일 추가 if (boardData.hasAttachment && boardData.attachments.length > 0) { - attachFiles.value = addDisplayFileName([...boardData.attachments]); + const formatted = addDisplayFileName([...boardData.attachments]); + attachFiles.value = formatted; + originalFiles.value = formatted; } // 데이터 설정 title.value = boardData.title || '제목 없음'; content.value = boardData.content || '내용 없음'; + originalTitle.value = title.value; contentLoaded.value = true; }; + watch(content, (val) => { + if (contentLoaded.value && !originalPlainText.value) { + originalPlainText.value = extractPlainText(val); + } + }, { immediate: true }); + const handleUpdateEditorImg = item => { editorUploadedImgList.value = item; };