From c97996f85d306d0dc77a5afe3dd0829e4dfe6f4d Mon Sep 17 00:00:00 2001
From: khj0414 <khj0414@local-host.co.kr>
Date: Thu, 23 Jan 2025 12:39:21 +0900
Subject: [PATCH] =?UTF-8?q?=EA=B2=8C=EC=8B=9C=ED=8C=90=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/list/BoardCard.vue |  2 +-
 src/views/board/BoardView.vue     | 19 +++----------------
 src/views/board/BoardWrite.vue    |  7 +++++--
 3 files changed, 9 insertions(+), 19 deletions(-)

diff --git a/src/components/list/BoardCard.vue b/src/components/list/BoardCard.vue
index 327e1e7..3713a04 100644
--- a/src/components/list/BoardCard.vue
+++ b/src/components/list/BoardCard.vue
@@ -25,7 +25,7 @@
                         </span>
                     </h5>
                     <!-- 본문 -->
-                    <p class="card-text str_wrap">{{ content }}</p>
+                    <div class="card-text str_wrap" v-html="$common.contentToHtml(content)"></div>
                     <!-- 날짜 -->
                     <div class="d-flex justify-content-between">
                         <small class="text-muted">{{ formattedDate }}</small>
diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue
index f655bfc..fd20dc0 100644
--- a/src/views/board/BoardView.vue
+++ b/src/views/board/BoardView.vue
@@ -11,7 +11,9 @@
                     <div class="card-body">
                         <h5 class="mb-4">{{ boardTitle }}</h5>
                         <!-- HTML 콘텐츠 렌더링 -->
-                        <div class="board-content text-body" style="line-height: 1.6;" v-html="convertedContent"></div>
+                        <div class="board-content text-body" style="line-height: 1.6;"  v-html="$common.contentToHtml(boardContent)">
+
+                        </div>
                         <!-- 첨부파일 목록 -->
                         <ul v-if="attachments.length" class="attachments mt-4 list-unstyled">
                             <li v-for="(attachment, index) in attachments" :key="index" class="mb-2">
@@ -40,7 +42,6 @@ import { ref, onMounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import axios from '@api';
 import Quill from 'quill';
-import DOMPurify from 'dompurify';
 
 // 게시물 데이터 상태
 const profileName = ref('익명 사용자');
@@ -72,20 +73,6 @@ const fetchBoardDetails = async () => {
         boardTitle.value = boardDetail.title || '제목 없음';
         boardContent.value = boardDetail.content || '';
 
-        // Quill을 사용하여 Delta 데이터를 HTML로 변환
-        if (boardContent.value) {
-            try {
-                const quillContainer = document.createElement('div');
-                const quillInstance = new Quill(quillContainer);
-                quillInstance.setContents(JSON.parse(boardContent.value));
-                convertedContent.value = DOMPurify.sanitize(quillContainer.innerHTML);
-            } catch (parseError) {
-                console.error('Delta 데이터 변환 오류:', parseError);
-                convertedContent.value = '내용을 표시할 수 없습니다.';
-            }
-        } else {
-            convertedContent.value = '내용 없음';
-        }
 
         attachments.value = data.attachments || [];
         comments.value = data.comments || [];
diff --git a/src/views/board/BoardWrite.vue b/src/views/board/BoardWrite.vue
index 535bc9e..cdace2f 100644
--- a/src/views/board/BoardWrite.vue
+++ b/src/views/board/BoardWrite.vue
@@ -84,7 +84,7 @@
 import QEditor from '@c/editor/QEditor.vue';
 import FormInput from '@c/input/FormInput.vue';
 import FormFile from '@c/input/FormFile.vue';
-import { ref } from 'vue';
+import { getCurrentInstance, ref } from 'vue';
 import router from '@/router';
 import axios from '@api';
 
@@ -100,6 +100,9 @@ const passwordAlert = ref(false);
 const contentAlert = ref(false);
 const attachFilesAlert = ref(false);
 
+const { appContext } = getCurrentInstance();
+const $common = appContext.config.globalProperties.$common; // $common에 접근
+
 const goList = () => {
     router.push('/board');
 };
@@ -116,7 +119,7 @@ const write = async () => {
     try {
         const boardData = {
             LOCBRDTTL: title.value,
-            LOCBRDCON: content.value,
+            LOCBRDCON: $common.deltaAsJson(content.value),
             LOCBRDPWD: category.value === 1 ? password.value : null,
             LOCBRDTYP: category.value === 1 ? 'S' : 'F',
         };