This commit is contained in:
2025-01-21 09:14:35 +08:00
parent 49feb0777d
commit 1f169dc517
12 changed files with 4057 additions and 792 deletions

View File

@@ -1,3 +1,4 @@
import Vue from 'vue';
import JSZip from 'jszip';
import Common from '@/components/common/common'
import Tiff from 'tiff.js';
@@ -1150,6 +1151,226 @@ convertParagraphsToHtml(paragraphs) {
},
initEditorButton(vueInstance,ed) {
ed.ui.registry.addMenuButton('customDropdown', {
text: 'Set Title', // 下拉框标题
fetch: function (callback) {
// 定义下拉框的内容
const items = [
{
label: 'First level title',
value: 1
},
{
label: 'Secondary Title',
value: 2
},
{
label: 'Third level title',
value: 3
}
];
const menuItems = items.map((item) => ({
type: 'menuitem',
text: item.label,
onAction: function () {
var edSelection = ed.selection;
const selectedNode = edSelection.getNode(); // 获取选中的节点
if (selectedNode) {
// 向上查找最外层的 div
let outerDiv = selectedNode;
while (outerDiv && outerDiv.tagName !== 'DIV') {
outerDiv = outerDiv.parentNode;
}
// 如果找到的 div 节点存在
if (outerDiv) {
const dataId = outerDiv.getAttribute('main-id');
vueInstance.$emit('onEditTitle', {
mainId: dataId,
value: item.value
});
}
}
}
}));
callback(menuItems);
}
});
// 添加自定义菜单项
ed.ui.registry.addButton('Save', {
icon: 'checkmark',
text: 'Save',
onAction: function () {
var deleteButtons = document.querySelectorAll('.tox-tinymce-inline');
var edSelection = ed.selection;
const selectedNode = edSelection.getNode(); // 获取选中的节点
let outerDiv = selectedNode;
while (outerDiv && outerDiv.tagName !== 'DIV') {
outerDiv = outerDiv.parentNode;
}
// 如果找到的 div 节点存在
if (outerDiv) {
const dataId = outerDiv.getAttribute('main-id');
var content;
console.log('outerDiv at line 663:', outerDiv.innerHTML);
content = outerDiv.innerHTML.replace(/<(?!\/?(img|b|i|sub|sup|span|strong|em |blue)\b)[^>]+>/g, '');
content =content.replace(/<([a-zA-Z]+)>\s*<\/\1>/g, '');
content = content.replace(/&nbsp;/g, ' ');
content = content.replace(/\s*style="[^"]*"/g, '');
var div = document.createElement('div');
div.innerHTML = content; // 将 HTML 字符串加载到 div 中
// 替换所有 <strong> 为 <b>
var strongTags = div.getElementsByTagName('strong');
for (var i = 0; i < strongTags.length; i++) {
var bTag = document.createElement('b');
bTag.innerHTML = strongTags[i].innerHTML; // 保留内容
strongTags[i].parentNode.replaceChild(bTag, strongTags[i]);
}
// 替换所有 <em> 为 <i>
var emTags = div.getElementsByTagName('em');
for (var i = 0; i < emTags.length; i++) {
var iTag = document.createElement('i');
iTag.innerHTML = emTags[i].innerHTML; // 保留内容
emTags[i].parentNode.replaceChild(iTag, emTags[i]);
}
content = div.innerHTML;
console.log('content at line 486:', content);
vueInstance.$emit('saveContent', content, dataId);
}
}
});
ed.ui.registry.addButton('Edit', {
icon: 'highlight-bg-color',
text: 'Edit',
onAction: function () {
var edSelection = ed.selection;
const selectedNode = edSelection.getNode(); // 获取选中的节点
let outerDiv = selectedNode;
while (outerDiv && outerDiv.tagName !== 'DIV') {
outerDiv = outerDiv.parentNode;
}
// 如果找到的 div 节点存在
if (outerDiv) {
const dataId = outerDiv.getAttribute('main-id');
console.log('dataId at line 1258:', dataId)
vueInstance.$emit('onEdit', dataId);
}
}
});
ed.ui.registry.addButton('commentAdd', {
icon: 'comment-add',
text: 'Comment Add',
onAction: function () {
var edSelection = ed.selection;
const selectedNode = edSelection.getNode(); // 获取选中的节点
if (selectedNode) {
// 向上查找最外层的 div
let outerDiv = selectedNode;
while (outerDiv && outerDiv.tagName !== 'DIV') {
outerDiv = outerDiv.parentNode;
}
// 如果找到的 div 节点存在
if (outerDiv) {
const dataId = outerDiv.getAttribute('main-id');
let selectedText = edSelection.getContent({ format: 'text' });
vueInstance.$emit('onAddComment', {
mainId: dataId,
label: selectedText ? selectedText : ''
});
}
}
}
});
ed.ui.registry.addButton('delete', {
icon: 'remove',
text: 'Delete',
onAction: function () {
var edSelection = ed.selection;
const selectedNode = edSelection.getNode(); // 获取选中的节点
if (selectedNode) {
// 向上查找最外层的 div
let outerDiv = selectedNode;
while (outerDiv && outerDiv.tagName !== 'DIV') {
outerDiv = outerDiv.parentNode;
}
// 如果找到的 div 节点存在
if (outerDiv) {
const dataId = outerDiv.getAttribute('main-id');
vueInstance.$emit('onDelete',dataId);
}
}
}
});
// 定义自定义按钮
ed.ui.registry.addButton('clearButton', {
text: 'Empty',
onAction: () => {
// 插入自定义表格到编辑器中
ed.setContent('');
}
});
ed.ui.registry.addButton('customBlue', {
text: 'Blue', // 按钮文本
onAction: function () {
// 在选中的文本周围包裹 <blue> 标签
var selectedText = ed.selection.getContent();
console.log('selectedText at line 529:', selectedText);
if (selectedText) {
var wrappedText = `<blue>${selectedText}</blue>`;
ed.selection.setContent(wrappedText);
} else {
this.$message.error('请选择要添加蓝色的文本');
}
}
});
ed.ui.registry.addButton('removeBlue', {
text: 'Blue', // 按钮文本
onAction: function () {
const range = ed.selection.getRng(); // 获取选区范围
let startNode = range.startContainer; // 获取选区起始节点
let closestBlue = null;
// 向上查找最近的 <blue> 标签
while (startNode) {
if (startNode.nodeName && startNode.nodeName.toLowerCase() === 'blue') {
closestBlue = startNode;
break;
}
startNode = startNode.parentNode;
}
if (closestBlue) {
// 如果找到最近的 <blue> 标签,移除它的外层标签,但保留内容
const parent = closestBlue.parentNode;
while (closestBlue.firstChild) {
parent.insertBefore(closestBlue.firstChild, closestBlue);
}
parent.removeChild(closestBlue);
} else {
// 未找到 <blue> 标签,仅移除选中的 <blue> 标签内容
const selectedContent = ed.selection.getContent({ format: 'html' });
// 使用正则表达式移除选区中的 <blue> 标签
const cleanedContent = selectedContent
.replace(/<blue[^>]*>/g, '') // 删除起始标签 <blue>
.replace(/<\/blue>/g, ''); // 删除结束标签 </blue>
// 更新选中的内容
ed.selection.setContent(cleanedContent);
}
}
});
},
// 通用递归方法
};