From f4a58c6bc994cb24e11ad0f67310a968891d3e47 Mon Sep 17 00:00:00 2001
From: yaojn <yaojn@techsure.com.cn>
Date: Tue, 25 Mar 2025 18:35:58 +0800
Subject: [PATCH] =?UTF-8?q?-=20[=E4=BF=AE=E5=A4=8D]=E7=A0=94=E5=8F=91?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=8F=AA=E8=AF=BB=E6=A8=A1=E5=BC=8F=E4=B8=8B?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=E5=8F=98=E5=BD=A2=20=20=20=20-=20[=E5=85=B3?=
 =?UTF-8?q?=E8=81=94]#[1384881798479872]=E7=A0=94=E5=8F=91=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E5=8F=AA=E8=AF=BB=E6=A8=A1=E5=BC=8F=E4=B8=8B=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E5=8F=98=E5=BD=A2=20http://192.168.0.96:8090/demo/rdm?=
 =?UTF-8?q?.html#/bug-detail/939050947543040/939050947543057/1384881798479?=
 =?UTF-8?q?872?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/resources/plugins/TsCkeditor/ckeditor.less | 10 ++++++++++
 .../content-handler/content-handler.vue        | 18 +++++-------------
 .../viewtab/components/comment-list.vue        | 11 +++++------
 3 files changed, 20 insertions(+), 19 deletions(-)

diff --git a/src/resources/plugins/TsCkeditor/ckeditor.less b/src/resources/plugins/TsCkeditor/ckeditor.less
index a1dfb05f..0426afc4 100644
--- a/src/resources/plugins/TsCkeditor/ckeditor.less
+++ b/src/resources/plugins/TsCkeditor/ckeditor.less
@@ -25,6 +25,16 @@
     padding-left: 1.5em;
     padding-right: 1.5em;
   }
+  figure {
+    &.image {
+      img {
+        display: block;
+        height: auto;
+        margin: 0 auto;
+        max-width: 100%;
+      }
+    }
+  }
 }
 .ck-content {
   min-height: 130px;
diff --git a/src/views/pages/rdm/project/content-handler/content-handler.vue b/src/views/pages/rdm/project/content-handler/content-handler.vue
index f911e3ac..bff08c88 100644
--- a/src/views/pages/rdm/project/content-handler/content-handler.vue
+++ b/src/views/pages/rdm/project/content-handler/content-handler.vue
@@ -32,12 +32,11 @@
           }"
         ></TsCkeditor>
       </div>
-      <div
+      <TsCkeditor
         v-else
-        v-imgViewer
-        class="content"
-        v-html="issueData.content"
-      ></div>
+        :readonly="true"
+        :value="issueData.content"
+      ></TsCkeditor>
     </div>
     <div v-if="editMode === 'edit' && !autoSave" class="mt-md" style="text-align: right">
       <Button class="mr-md" type="primary" @click="saveIssue()">{{ $t('page.confirm') }}</Button>
@@ -47,10 +46,9 @@
 </template>
 <script>
 import * as handlers from './index.js';
-import imgViewer from '@/resources/directives/img-viewer.js';
 export default {
   name: '',
-  directives: { imgViewer },
+  directives: {},
   components: {
     ...handlers,
     TsCkeditor: () => import('@/resources/plugins/TsCkeditor/TsCkeditor.vue')
@@ -138,9 +136,3 @@ export default {
   padding-left: revert;
 }
 </style>
-<style lang="less">
-.content img {
-  // width: 100%; // 在非编辑模式下，图片被放大变形问题
-  cursor: pointer;
-}
-</style>
diff --git a/src/views/pages/rdm/project/viewtab/components/comment-list.vue b/src/views/pages/rdm/project/viewtab/components/comment-list.vue
index 22f36c60..46a85bf0 100644
--- a/src/views/pages/rdm/project/viewtab/components/comment-list.vue
+++ b/src/views/pages/rdm/project/viewtab/components/comment-list.vue
@@ -21,7 +21,10 @@
               <UserCard alignMode="vertical" :iconSize="32" :uuid="row.fcu"></UserCard>
             </div>
             <div>
-              <div v-imgViewer class="comment-content" v-html="row.content"></div>
+              <TsCkeditor
+                :readonly="true"
+                :value="row.content"
+              ></TsCkeditor>
               <div v-if="commentReady['c_' + row.id] && row.childCount > 0" class="mt-md">
                 <CommentList
                   :issueData="issueData"
@@ -67,10 +70,9 @@
   </div>
 </template>
 <script>
-import imgViewer from '@/resources/directives/img-viewer.js';
 export default {
   name: '',
-  directives: { imgViewer },
+  directives: {},
   components: {
     UserCard: () => import('@/resources/components/UserCard/UserCard.vue'),
     TsCard: () => import('@/resources/components/TsCard/TsCard.vue'),
@@ -199,9 +201,6 @@ export default {
   grid-template-columns: 50px calc(100% - 50px - 20px); // auto时，由内容撑开，不受父级元素的影响，导致图片没有自适应宽度
   grid-gap: 20px;
 }
-.comment-content {
-  min-height: 25px;
-}
 .comment-grid:hover {
   .comment-action {
     visibility: visible;
-- 
Gitee