diff --git a/src/common/js/commonJS.js b/src/common/js/commonJS.js index 85e23c5..554a8f8 100644 --- a/src/common/js/commonJS.js +++ b/src/common/js/commonJS.js @@ -1152,7 +1152,51 @@ export default { initEditorButton(vueInstance, ed) { - + ed.ui.registry.addButton('copyButton', { + text: 'Copy', + 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) + window.copiedContent=dataId + // alert('内容已复制',dataId); + // vueInstance.$emit('onAddRow', dataId); + } + // alert('内容已复制'); + } + }); + + // 自定义粘贴按钮 + ed.ui.registry.addButton('pasteButton', { + text: 'Paste', + 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'); + if(window.copiedContent&&window.copiedContent!='dataId'){ + vueInstance.$emit('onSort', dataId,window.copiedContent); + }else{ + alert('没有复制的内容'); + } + // alert('内容已复制',dataId); + // vueInstance.$emit('onAddRow', dataId); + } + // 将存储的复制内容插入到当前光标位置 + + } + }); ed.ui.registry.addMenuButton('customDropdown', { text: 'Set Title', // 下拉框标题 fetch: function (callback) { @@ -1531,37 +1575,29 @@ export default { }, inTinymceButtonClass() { setTimeout(function () { - // 查找该按钮并添加 className - const commentaddbutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="commentadd"]'); - if (commentaddbutton) { - commentaddbutton.classList.add('tinymce-custom-button-commentadd'); - } - const addrowbutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="addrow"]'); - if (addrowbutton) { - addrowbutton.classList.add('tinymce-custom-button-addrow'); - } - const deletebutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="delete"]'); - if (deletebutton) { - deletebutton.classList.add('tinymce-custom-button-delete'); - } - const editbutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="edit"]'); - if (editbutton) { - editbutton.classList.add('tinymce-custom-button-edit'); - } - const savebutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="save"]'); - if (savebutton) { - savebutton.classList.add('tinymce-custom-button-save'); - } - const button = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="customblue"]'); - if (button) { - button.classList.add('tinymce-custom-button-blue'); - } - const removebutton = document.querySelector('.tox-toolbar .tox-toolbar__group .tox-tbtn[data-mce-name="removeblue"]'); - if (removebutton) { - removebutton.classList.add('tinymce-custom-button-removeblue'); - } + // 使用 querySelectorAll 获取所有符合条件的按钮 + const buttons = [ + { selector: '.tox-tbtn[data-mce-name="commentadd"]', className: 'tinymce-custom-button-commentadd' }, + { selector: '.tox-tbtn[data-mce-name="addrow"]', className: 'tinymce-custom-button-addrow' }, + { selector: '.tox-tbtn[data-mce-name="delete"]', className: 'tinymce-custom-button-delete' }, + { selector: '.tox-tbtn[data-mce-name="edit"]', className: 'tinymce-custom-button-edit' }, + { selector: '.tox-tbtn[data-mce-name="save"]', className: 'tinymce-custom-button-save' }, + { selector: '.tox-tbtn[data-mce-name="customblue"]', className: 'tinymce-custom-button-blue' }, + { selector: '.tox-tbtn[data-mce-name="removeblue"]', className: 'tinymce-custom-button-removeblue' } + ]; + + // 遍历每个按钮并为每个按钮添加类 + buttons.forEach(item => { + const buttonElements = document.querySelectorAll(item.selector); + buttonElements.forEach(button => { + if (!button.classList.contains(item.className)) { // 防止重复添加 + button.classList.add(item.className); + } + }); + }); }, 100); // 延迟执行，确保按钮渲染完成 } + // 通用递归方法 diff --git a/src/components/page/GenerateCharts.vue b/src/components/page/GenerateCharts.vue index b2108e1..2b134f2 100644 --- a/src/components/page/GenerateCharts.vue +++ b/src/components/page/GenerateCharts.vue @@ -86,7 +86,7 @@ --> * Table : - -

- {{ commentForm.content }} +

+

@@ -628,6 +630,21 @@ export default { } }); }, + async onSort(mainId,sortId) { + console.log('mainId at line 633:', mainId) + console.log('sortId at line 633:', sortId) + var that = this; + // await that.$api + // .post(that.urlList.sort, { + // article_id: this.articleId + // }) + // .then(async (res) => { + // if (res.code == 0) { + // this.ManuscirptContent = res.data.list; + // // this.$refs.commonWordHtmlTypeSetting.getCommentList(); + // } + // }); + }, changeComment() { this.isShowComment = !this.isShowComment; }, @@ -884,8 +901,8 @@ export default { }); }, async onAddRow(mainId) { - console.log('data at line 886:', mainId) - + console.log('data at line 886:', mainId); + await this.$api .post(this.urlList.addRow, { am_id: mainId, diff --git a/src/components/page/components/table/word.vue b/src/components/page/components/table/word.vue index 190c497..fab1a56 100644 --- a/src/components/page/components/table/word.vue +++ b/src/components/page/components/table/word.vue @@ -60,38 +60,46 @@
- - - + id="drop-target" + @dragover="handleDragOver" + @dragenter="handleDragEnter" + @dragleave="handleDragLeave" + @drop="handleDrop" + @click="initializeEditor(item.am_id, 'table', item)" + class="thumbnailTableBox wordTableHtml table_Box pMain myeditabledivTable drop-target" + v-else-if="item.type == 2" + :main-state="item.state" + :remark="item.checks.length > 0 ? 1 : 0" + :contenteditable="!readonly && !isPreview" + :data-id="item.amt_id" + :type="item.type" + :id="'editor' + item.am_id" + :main-id="item.am_id" +> + + + + - - - - -
- -
+ + + + + +
+ +
+ + + + + +
- - -
  • @@ -714,10 +724,10 @@ export default { image_advtab: false, // 禁用图片高级选项卡（防止自动调整大小） valid_elements: '*[*]', - plugins: 'forecolor code paste table image resize searchreplace dragdrop', + plugins: 'forecolor code paste table image resize dragdrop', menubar: false, - toolbar: _this.isEditComment ? ['commentAdd |delete| level1 level2 level3|addRow|Edit'] : ['delete|addRow| Edit'], + toolbar: _this.isEditComment ? ['commentAdd |delete| level1 level2 level3|addRow|copyButton pasteButton|Edit'] : ['delete|addRow|copyButton pasteButton| Edit'], end_container_on_empty_block: true, content_css: 'default ', content_style: `${tableStyle + this.wordStyle} @@ -773,7 +783,7 @@ export default { image_advtab: false, // 禁用图片高级选项卡（防止自动调整大小） valid_elements: '*[*]', - plugins: 'forecolor code paste table image resize searchreplace', + plugins: 'forecolor code paste table image resize ', content_style: `${tableStyle + this.wordStyle} @@ -858,7 +868,7 @@ export default { table_resize_bars: true, valid_elements: '*[*]', image_advtab: false, // 禁用图片高级选项卡（防止自动调整大小） - plugins: 'forecolor code paste table image resize searchreplace', + plugins: 'forecolor code paste table image resize ', content_style: `${tableStyle + this.wordStyle} `, @@ -988,13 +998,18 @@ export default { const formattedDate = `${year}-${month}-${day} ${hours}:${minutes}`; return formattedDate; + }, + goToListComment(data) { + console.log('data at line 993:', data) + this.goToComment(data.am_id) + }, divOnScroll() { if (!this.isPreview) { // const scrollTop = scrollDiv.scrollTop; // 获取垂直滚动距离 this.scrollPosition = this.$refs.scrollDiv.scrollTop; localStorage.setItem('scrollPosition', this.scrollPosition); - console.log('this.scrollPosition at line 980:', this.scrollPosition); + // console.log('this.scrollPosition at line 980:', this.scrollPosition); // 检查每个编辑器是否在可视区域内 for (const key in this.editors) { const editorElement = document.getElementById(key); @@ -1044,62 +1059,65 @@ export default { return emptyContentIndexes; }, + escapeRegExp(string) { + return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); +}, highlightText(text, annotations) { - if (!this.isPreview) { - let tempText = text; + if (!this.isPreview) { + let tempText = text; - // 1. 使用占位符替代批注内容 - const placeholders = []; - annotations.forEach((annotation, index) => { - if (annotation.content == '') { - return tempText; - } - const placeholder = `{{remark_placeholder_${index}}}`; // 占位符 - const regExp = new RegExp(`(${annotation.content})`, 'gi'); // 全局匹配批注内容 - - // 如果批注内容存在，替换成占位符 - if (tempText.includes(annotation.content)) { - tempText = tempText.replace(regExp, placeholder); - placeholders.push({ placeholder, annotation, index }); - } - }); - - // 2. 为占位符添加高亮 - placeholders.forEach(({ placeholder, annotation, index }) => { - const regExp = new RegExp(placeholder, 'gi'); - - tempText = tempText.replace(regExp, (match) => { - // 随机生成浅色透明背景颜色 - const randomColor = this.getRandomLightColor(); - - let highlightedText = ` - - ${annotation.content} - - ${index + 1} - - - `; - - return highlightedText; - }); - }); - - // 3. 返回处理后的文本 + // 1. 使用占位符替代批注内容 + const placeholders = []; + annotations.forEach((annotation, index) => { + if (annotation.content == '') { return tempText; - } else { - return text; } - }, + const escapedContent = this.escapeRegExp(annotation.content); // 转义正则表达式中的特殊字符 + const placeholder = `{{remark_placeholder_${index}}}`; // 占位符 + const regExp = new RegExp(`(${escapedContent})`, 'gi'); // 全局匹配批注内容 + + // 如果批注内容存在，替换成占位符 + if (tempText.includes(annotation.content)) { + tempText = tempText.replace(regExp, placeholder); + placeholders.push({ placeholder, annotation, index }); + } + }); + + // 2. 为占位符添加高亮 + placeholders.forEach(({ placeholder, annotation, index }) => { + const regExp = new RegExp(placeholder, 'gi'); + + tempText = tempText.replace(regExp, (match) => { + const randomColor = this.getRandomLightColor(); + return ` + + ${annotation.content} + + ${index + 1} + + + `; + }); + }); + + // 3. 返回处理后的文本 + return tempText; + } else { + return text; + } +}, + getCommentsData() { if (!this.isPreview) {