From 88715ff43a3591cd3ddcdaeef4c7e921cddc824a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A7=8B=E4=BA=8E=E5=88=9D=E8=A7=81?= <752204717@qq.com>
Date: Thu, 15 Jan 2026 16:41:29 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9blue=E6=A0=87=E7=AD=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/common/js/commonJS.js                     | 15 ++++++-----
 .../page/components/Tinymce/index.vue         | 27 +++++++++++--------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/src/common/js/commonJS.js b/src/common/js/commonJS.js
index 7b859a4..4c255e8 100644
--- a/src/common/js/commonJS.js
+++ b/src/common/js/commonJS.js
@@ -2060,17 +2060,18 @@ export default {
 
 
         ed.ui.registry.addButton('customBlue', {
-            text: 'Blue', // 按钮文本
-            className: 'custom-button-blue',  // 添加自定义类
-            // shortcut: "Ctrl+J",
+            text: 'Blue',
+            className: 'custom-button-blue',
             onAction: function () {
-                // 在选中的文本周围包裹 <blue> 标签
-                var selectedText = ed.selection.getContent();
+                // 必须获取带 HTML 的内容，否则里面的 em/i 标签在拼接前就丢了
+                var selectedText = ed.selection.getContent({ format: 'html' });
+                
                 if (selectedText) {
+                    // 这就是你想要的：直接外层套一个 blue
                     var wrappedText = `<blue>${selectedText}</blue>`;
+                    
+                    // 使用 setContent 强行回写
                     ed.selection.setContent(wrappedText);
-                } else {
-                    this.$message.error('请选择要添加蓝色的文本');
                 }
             }
         });
diff --git a/src/components/page/components/Tinymce/index.vue b/src/components/page/components/Tinymce/index.vue
index e563ec7..e638198 100644
--- a/src/components/page/components/Tinymce/index.vue
+++ b/src/components/page/components/Tinymce/index.vue
@@ -119,15 +119,14 @@ const tableStyle = `
                         }
                         table span blue {
                     color: rgb(0, 130, 170) !important;
-                }blue {
+                }
+                blue {
                     color: rgb(0, 130, 170) !important;
                 }
-                blue sup {
-                    color: rgb(0, 130, 170) !important;
-                }
-                blue sub {
+                blue *{
                     color: rgb(0, 130, 170) !important;
                 }
+               
                 .wordTableHtml table tr.table-header-row:nth-of-type(2) td {
     border-bottom: 1px solid #000 !important;
 }
@@ -391,6 +390,10 @@ export default {
             var _this = this;
             window.tinymce.init({
                 ..._this.tinymceOtherInit,
+                extended_valid_elements: 'blue[*]',
+                custom_elements: 'blue',
+                valid_children: '+blue[#text|i|em|b|strong|span],+body[blue],+p[blue]',
+  
                 inline: false, // 使用 iframe 模式
                 selector: `#${this.tinymceId}`,
                 // noneditable_regexp: "/<wmath>.*?<\/wmath>/g",
@@ -406,10 +409,13 @@ export default {
                 content_style: `
                 ${tableStyle}
                 ${_this.wordStyle}
+                blue{
+                    display: inline;
+                }
                 `,
                 formats: {
                     bold: { inline: 'b' },
-                    italic: { inline: 'i' }
+                    italic: { inline: 'i' },
                 },
                 body_class: 'panel-body ',
                 object_resizing: false,
@@ -617,9 +623,9 @@ export default {
                 },
                 paste_preprocess: function (plugin, args) {
                     let imgIdx = 0;
-                  
+
                     const silentPlaceholder = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
-                   
+
                     let content = args.content.replace(/(<img[^>]*?)src="file:\/\/\/[^" ]*"/gi, (match, p1) => {
                         // 保留 data-idx， Word 里的尺寸
                         return `${p1}src="${silentPlaceholder}" class="word-img-placeholder" data-idx="${imgIdx++}"`;
@@ -702,9 +708,9 @@ export default {
                 },
                 init_instance_callback: (editor) => {
                     if (_this.value) {
-                        editor.setContent(_this.value);
+                    
+                        editor.setContent('<p>'+_this.value+'</p>');
 
-                        // console.log('at line 489:', '  页面');
                         setTimeout(() => {
                             window.renderMathJax(_this.tinymceId); // 初始化时渲染 MathJax
                         }, 10);
@@ -910,5 +916,4 @@ export default {
 ::v-deep .tox:not(.tox-tinymce-inline) .tox-editor-header {
     padding: 0 !important;
 }
-
 </style>