题目富文本编辑

.gitignore

@@ -16,3 +16,6 @@ check_table_structure.php
 MODIFICATION_SUMMARY.md
 start-dev.bat
 test_db_fields.php
+COMMIT_SUMMARY.md
+sql/add_answer_times_to_subjects.sql
+sql/update_paper_statistics.sql

addons/admin/src/views/exam/component/TopicManager.vue

@@ -24,7 +24,7 @@
                             <template slot-scope="{ row }">
                                 <div v-if="row.show_type === 1" class="topic-content clickable"
                                     @click="showContentDialog('题目内容', row.topic_name)">
-                                    {{ row.topic_name }}
+                                    <div class="topic-html-content" v-html="row.topic_name"></div>
                                 </div>
                                 <div v-else class="topic-content clickable"
                                     @click="showImageDialog('题目内容', row.topic_name)">
@@ -102,7 +102,7 @@
                 </el-form-item>
 
                 <el-form-item label="题目内容" prop="topic_name" v-if="form.show_type === 1">
-                    <el-input type="textarea" :rows="3" v-model="form.topic_name" placeholder="请输入题目内容"></el-input>
+                    <tinymce-editor v-model="form.topic_name" :init="editorConfig" />
                 </el-form-item>
 
                 <el-form-item label="题目图片" prop="topic_name" v-else>
@@ -213,9 +213,7 @@
 
         <!-- 内容查看弹窗 -->
         <el-dialog :visible.sync="contentDialogVisible" :title="contentDialogTitle" width="600px">
-            <div class="content-display">
-                <pre>{{ contentDialogContent }}</pre>
-            </div>
+            <div class="content-display" v-html="contentDialogContent"></div>
         </el-dialog>
 
         <!-- 图片查看弹窗 -->
@@ -230,10 +228,12 @@
 <script>
 import Sortable from 'sortablejs';
 import uploadImage from '../../../components/uploadImage'
+import TinymceEditor from '@/components/TinymceEditor/index.vue'
 
 export default {
     components: {
-        uploadImage
+        uploadImage,
+        TinymceEditor
     },
     name: 'TopicManager',
     props: {
@@ -291,7 +291,19 @@ export default {
             // 图片查看弹窗
             imageDialogVisible: false,
             imageDialogTitle: '',
-            imageDialogImage: ''
+            imageDialogImage: '',
+            // 富文本编辑器配置
+            editorConfig: {
+                height: 300,
+                branding: false,
+                skin_url: '/tinymce/skins/ui/oxide',
+                content_css: '/tinymce/skins/content/default/content.css',
+                language_url: '/tinymce/langs/zh_CN.js',
+                language: 'zh_CN',
+                plugins: 'code print preview fullscreen paste searchreplace link autolink image imagetools media table codesample lists advlist hr charmap emoticons anchor directionality quickbars nonbreaking visualblocks visualchars wordcount',
+                toolbar: 'fullscreen preview code | undo redo | forecolor backcolor | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | formatselect fontselect fontsizeselect | link image media emoticons charmap anchor codesample',
+                toolbar_drawer: 'sliding'
+            }
         };
     },
     mounted() {
@@ -628,9 +640,28 @@ export default {
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-line-clamp: 3;
+    line-clamp: 3;
     -webkit-box-orient: vertical;
 }
 
+.topic-html-content {
+    max-height: 60px;
+    overflow: hidden;
+    word-break: break-word;
+}
+
+.topic-html-content>>>p {
+    margin: 0;
+    padding: 0;
+}
+
+.topic-html-content>>>img {
+    max-width: 100%;
+    height: auto;
+    max-height: 50px;
+    object-fit: contain;
+}
+
 .topic-content.clickable {
     cursor: pointer;
     transition: all 0.3s ease;
@@ -645,6 +676,9 @@ export default {
 .content-display {
     max-height: 400px;
     overflow-y: auto;
+    padding: 10px;
+    background-color: #f8f9fa;
+    border-radius: 4px;
 }
 
 .content-display pre {