提交

src/common/js/commonJS.js

@@ -22,7 +22,7 @@ export default {
         var txt = document.createElement('textarea');
         txt.innerHTML = html;
         return txt.value;
-      },
+    },
     //去掉最外层自定义的span标签
     extractContentWithoutOuterSpan(cell) {
         var str = ''
@@ -54,7 +54,7 @@ export default {
         str = str.replace(/<blue>/g, '').replace(/<\/blue>/g, ''); // 先去掉所有的 <blue> 标签
 
         if (regex.test(str)) {
-            str = str.replace(regex, function(match) {
+            str = str.replace(regex, function (match) {
                 // 提取出方括号中的内容，并进行匹配
                 const content = match.slice(1, match.length - 1);  // 去掉方括号
 
@@ -303,7 +303,7 @@ export default {
                                 formattedText = formattedText.replace(/<blue>/g, '').replace(/<\/blue>/g, ''); // 先去掉所有的 <blue> 标签
 
                                 if (regex.test(formattedText)) {
-                                    formattedText = formattedText.replace(regex, function(match) {
+                                    formattedText = formattedText.replace(regex, function (match) {
                                         // 提取出方括号中的内容，并进行匹配
                                         const content = match.slice(1, match.length - 1);  // 去掉方括号
 
@@ -386,6 +386,41 @@ export default {
 
     },
 
+   cleanAndParseWordContent(content) {
+        // 1️⃣ 解析成 <p> 段落数组
+        let tempDiv = document.createElement('div');
+        tempDiv.innerHTML = content; // 解析 HTML 内容
+        let paragraphs = tempDiv.querySelectorAll("p"); // 选取所有 <p> 作为数据项
+    
+        // 2️⃣ 将 <p> 内容转换为数组，处理空标签对
+        let parsedData = Array.from(paragraphs).map(p => {
+            let text = p.innerHTML.trim(); // 获取内容，去除两端空格
+    
+            // 3️⃣ 移除 <o:p>（Word 复制的无效标签）
+            text = text.replace(/<\/?o:p>/g, "");
+    
+            // 4️⃣ 移除 style="..."（防止 Word 带入无用样式）
+            text = text.replace(/\s*style="[^"]*"/g, "");
+    
+            // 5️⃣ 替换 <strong> 为 <b>
+            text = text.replace(/<strong>/g, "<b>").replace(/<\/strong>/g, "</b>");
+    
+            // 6️⃣ 替换 <em> 为 <i>
+            text = text.replace(/<em>/g, "<i>").replace(/<\/em>/g, "</i>");
+    
+            // 7️⃣ 处理空标签对：<i> </i>、<b> </b>、<span> </span> 等
+            text = text.replace(/<[^>]+>\s*<\/[^>]+>/g, "");
+    
+            // 8️⃣ 如果最终内容为空，则替换为 `""`
+            return text.trim() === "" ? "" : text;
+        });
+    
+        console.log(parsedData); // 输出数组，方便调试
+        return parsedData;
+    }
+    
+
+    ,
 
 
     parseTableToArray(tableString, callback) {
@@ -1240,7 +1275,7 @@ export default {
             }
         });
         ed.ui.registry.addButton('addRow', {
-            icon:'duplicate-row',
+            icon: 'duplicate-row',
             text: 'Add Row', // 下拉框标题
             onAction: function () {
                 var edSelection = ed.selection;
@@ -1547,17 +1582,17 @@ export default {
 
                 // 确保选中的文本是单个单词，包括空格
                 if (selectedText.trim() && /^[\s\w]+$/.test(selectedText)) {
-                  // 使用正则将选中的文本中的第一个字母大写
+                    // 使用正则将选中的文本中的第一个字母大写
-                  var capitalizedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function(match, p1, p2) {
+                    var capitalizedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function (match, p1, p2) {
-                    return p1 + p2.toUpperCase();
+                        return p1 + p2.toUpperCase();
-                  });
+                    });
 
-                  // 替换选中的文本，保持空格和其他内容
+                    // 替换选中的文本，保持空格和其他内容
-                  ed.selection.setContent(capitalizedText);
+                    ed.selection.setContent(capitalizedText);
-              } else {
+                } else {
-                vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
+                    vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
 
-              }
+                }
             }
         });
         ed.ui.registry.addButton('myuppercase', {
@@ -1569,46 +1604,46 @@ export default {
 
                 // 确保选中的文本是单个单词，包括空格
                 if (selectedText.trim() && /^[\s\w]+$/.test(selectedText)) {
-                  // 使用正则将选中的文本中的第一个字母大写
+                    // 使用正则将选中的文本中的第一个字母大写
-                  var capitalizedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function(match, p1, p2) {
+                    var capitalizedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function (match, p1, p2) {
-                    return p1 + p2.toUpperCase();
+                        return p1 + p2.toUpperCase();
-                  });
+                    });
 
-                  // 替换选中的文本，保持空格和其他内容
+                    // 替换选中的文本，保持空格和其他内容
-                  ed.selection.setContent(capitalizedText);
+                    ed.selection.setContent(capitalizedText);
-              } else {
+                } else {
-                vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
+                    vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
 
-              }
+                }
             }
         });
         ed.ui.registry.addButton('myuppercasea', {
             text: 'a', // 按钮文本（小写字母）
             onAction: function () {
-              // 获取选中的文本，保留 HTML 格式
+                // 获取选中的文本，保留 HTML 格式
-              var selectedText = ed.selection.getContent({ format: 'html' });
+                var selectedText = ed.selection.getContent({ format: 'html' });
 
-              // 确保选中的文本是单个有效的单词，包括空格
+                // 确保选中的文本是单个有效的单词，包括空格
-              if (selectedText.trim() && /^[\s\w]+$/.test(selectedText)) {
+                if (selectedText.trim() && /^[\s\w]+$/.test(selectedText)) {
-                // 使用正则将选中的文本中的第一个字母转换为小写
+                    // 使用正则将选中的文本中的第一个字母转换为小写
-                var lowercasedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function(match, p1, p2) {
+                    var lowercasedText = selectedText.replace(/(^|\s)([a-zA-Z])/g, function (match, p1, p2) {
-                  return p1 + p2.toLowerCase();
+                        return p1 + p2.toLowerCase();
-                });
+                    });
 
-                // 替换选中的文本，保持空格和其他内容
+                    // 替换选中的文本，保持空格和其他内容
-                ed.selection.setContent(lowercasedText);
+                    ed.selection.setContent(lowercasedText);
-              } else {
+                } else {
-                vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
+                    vueInstance.$message.error(vueInstance.$t('commonTable.selectWord'));
-              }
+                }
             }
-          });
+        });
-       ed.ui.registry.addButton('Line', {
+        ed.ui.registry.addButton('Line', {
-  text: '−', // 按钮文本
+            text: '−', // 按钮文本
-  onAction: function () {
+            onAction: function () {
-    // 插入 `−` 符号到当前光标位置
+                // 插入 `−` 符号到当前光标位置
-    ed.insertContent('−');
+                ed.insertContent('−');
-  }
+            }
-});
+        });
 
 
         ed.ui.registry.addButton('removeBlue', {

src/components/page/GenerateCharts.vue

@@ -73,7 +73,7 @@
                     </common-word-html-type-setting>
                 </div>
             </div>
-            <div style="width: 100%; width: calc(100% - 285px); float: right;height: calc(100% - 20px);; background-color: #e4e9ed">
+            <div style="width: 100%; width: calc(100% - 285px); float: right; height: calc(100% - 0px); background-color: #e4e9ed">
                 <!-- <div class="toolbar">
                     <div class="toolbar_item" @click="handleImageAdd('img')">
                         <img src="@/assets/img/upload.png" style="object-fit: contain" />
@@ -98,7 +98,10 @@
                     @editComment="editComment"
                     @loaded="loadedWord"
                     @onEdit="onEdit"
+                    @addContent="onAddContent"
+                    @changeSort="changeSort"
                     @onDelete="onDelete"
+                    @onDeletes="onDeletes"
                     @refresh="onRefresh"
                     @onComment="onComment"
                     @onAddComment="onAddComment"
@@ -232,9 +235,10 @@
         >
             <el-form ref="editMes" :model="commentForm" label-width="115px">
                 <el-form-item label="Select Content:" v-if="commentForm.content">
-                    <p style="background: #eef0f4; line-height: 20px; padding: 10px; box-sizing: border-box" v-html="commentForm.content">
+                    <p
-                       
+                        style="background: #eef0f4; line-height: 20px; padding: 10px; box-sizing: border-box"
-                    </p>
+                        v-html="commentForm.content"
+                    ></p>
                 </el-form-item>
                 <el-form-item label="Word">
                     <span slot="label">
@@ -293,6 +297,40 @@
                 </el-button>
             </span>
         </el-dialog>
+        <el-dialog
+            destroy-on-close
+            v-if="addContentVisible"
+            title="Add Content"
+            :visible.sync="addContentVisible"
+            width="1200px"
+          
+            :close-on-click-modal="false"
+        >
+            <el-form ref="editMes" :model="addContent" label-width="115px">
+                <el-form-item label="Word">
+                    <span slot="label">
+                        <font style="color: #f56c6c; margin-right: 5px">*</font>
+                        Content :
+                    </span>
+                    <common-content
+                        :value="addContent.content"
+                        @getContent="getContent"
+                        v-if="addContentVisible"
+                        ref="addContent"
+                       
+                        style="margin-left: -115px"
+                    ></common-content>
+                </el-form-item>
+            </el-form>
+
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="editVisible = false"> Cancel </el-button>
+                <el-button type="primary" @click="handleSaveAddContent">
+                    <!-- <i class="el-icon-finished" style="margin-right: 5px"></i> -->
+                    Save
+                </el-button>
+            </span>
+        </el-dialog>
     </div>
 </template>
 
@@ -400,6 +438,8 @@ export default {
                 ChGtpTxt: ''
             },
             txtVisible: false,
+            addContentVisible: false,
+            addContent: {},
             lineStyle: {},
             contentStyle: {},
             lineTable: [],
@@ -494,11 +534,13 @@ export default {
         handleSaveContent() {
             this.$refs.commonContent.getTinymceContent('content');
         },
+        handleSaveAddContent() {
+            this.$refs.addContent.getTinymceContent('addcontent');
+        },
 
         async getContent(type, content) {
-        
+            console.log('content at line 539:', content);
             if (type == 'content') {
-               
                 content = content.replace(/<(?!\/?(img|b|i|sub|sup|span|strong|em |blue)\b)[^>]+>/g, '');
 
                 content = content.replace(/\s*style="[^"]*"/g, '');
@@ -523,26 +565,40 @@ export default {
                 // 获取最终修改后的 HTML
                 content = div.innerHTML;
 
-
-
                 this.saveContent(content, this.currentContent.am_id);
+            } else if (type == 'addcontent') {
+                var hasTable = /<table[\s\S]*?>[\s\S]*?<\/table>/i.test(content);
+
+                if (hasTable) {
+                    this.$message({
+                        type: 'warning',
+                        message: 'Table content is not supported!'
+                    });
+                    return false
+                }
+                var list = this.$commonJS.cleanAndParseWordContent(content);
+                console.log('list at line 569:', list);
+
+                this.saveContentList(list, this.currentId);
             } else if (type == 'table') {
                 this.saveTable(content);
             } else if (type == 'comment') {
                 this.addComment(content);
             }
         },
-         async saveContent(content, am_id) {
+        async saveContent(content, am_id) {
-            
             var that = this;
-            var str = content.replace(/^<p>(.*?)<\/p>$/, '$1') ? content.replace(/^<p>(.*?)<\/p>$/, '$1') : '';
+            var str = content.replace(/^<p>\s*(.*?)\s*<\/p>$/, '$1').trim();
-            if (str == '') {
+            // var str = content.replace(/^<p>(.*?)<\/p>$/, '$1') ? content.replace(/^<p>(.*?)<\/p>$/, '$1') : '';
-                this.$message({
+            console.log('str at line 580:', JSON.stringify(str));
-                    type: 'warning',
+
-                    message: 'Please enter the content!'
+            // if (str == '') {
-                });
+            //     this.$message({
-            }
+            //         type: 'warning',
-            str= await that.$commonJS.decodeHtml(str)
+            //         message: 'Please enter the content!'
+            //     });
+            // }
+            str = await that.$commonJS.decodeHtml(str);
             await that.$api
                 .post(that.urlList.editContent, {
                     am_id: am_id,
@@ -556,6 +612,28 @@ export default {
                     }
                 });
         },
+        async saveContentList(content, am_id) {
+            if (content.length == 0) {
+                this.$message({
+                    type: 'warning',
+                    message: 'Please enter the content!'
+                });
+            }
+
+            await this.$api
+                .post('api/Preaccept/addMoreRow', {
+                    article_id: this.articleId,
+                    am_id: am_id,
+                    rows: content
+                })
+                .then(async (res) => {
+                    if (res.code == 0) {
+                        this.addContentVisible = false;
+                        this.getDate();
+                        this.getCommentList();
+                    }
+                });
+        },
         deleteComment(comment, index) {
             console.log('comment at line 480:', comment);
             if (this.isEditComment) {
@@ -712,6 +790,56 @@ export default {
                     console.log('err at line 466:', err);
                 });
         },
+        async onDeletes(dataId) {
+            await this.$confirm(this.$t('commonTable.removeContent'), 'Prompt', {
+                confirmButtonText: 'Submit',
+                cancelButtonText: 'Cancel',
+                type: 'warning'
+            })
+                .then(async () => {
+                    var that = this;
+
+                    await that.$api
+                        .post('/api/Preaccept/delMoreArticleMains', {
+                            ids: dataId
+                        })
+                        .then(async (res) => {
+                            if (res.code == 0) {
+                                setTimeout(() => {
+                                    that.getDate();
+                                    that.getCommentList();
+                                    that.$refs.commonWordHtmlTypeSetting.refresh('img');
+                                    that.$refs.commonWordHtmlTypeSetting.refresh('table');
+                                    that.$forceUpdate();
+                                });
+                            }
+                        });
+                    // this.Main_List.splice(
+                    //     this.Main_List.findIndex((item) => item.p_main_id == dataId),
+                    //     1
+                    // );
+                })
+                .catch((err) => {
+                    console.log('err at line 466:', err);
+                });
+        },
+        async changeSort(type,id) {
+            var that=this
+            await that.$api
+                        .post(type=='up'?'/api/Preaccept/upArticleMain':'/api/Preaccept/downArticleMain', {
+                            am_id: id
+                        })
+                        .then(async (res) => {
+                            if (res.code == 0) {
+                                setTimeout(() => {
+                                    that.getDate();
+                                    that.getCommentList();
+                                   
+                                    that.$forceUpdate();
+                                });
+                            }
+                        });
+        },
         async addCommentSetting(content) {
             console.log('content at line 602:', content);
             await this.$api
@@ -850,6 +978,9 @@ export default {
         async onEditTitle(data) {
             var url;
             switch (data.value) {
+                case 0:
+                    url = 'api/Preaccept/changeNormal';
+                    break;
                 case 1:
                     url = 'api/Preaccept/changeH1';
                     break;
@@ -962,7 +1093,7 @@ export default {
             }
         },
         updateChange(content, type) {
-        console.log('content at line 976:', content)
+            console.log('content at line 976:', content);
             var str = this.$commonJS.transformHtmlString(content);
             if (type == 'imgNote') {
                 this.picStyle.note = str;
@@ -1005,13 +1136,19 @@ export default {
                 this.lineStyle.visiTitle = 'Edit Table';
                 this.threeVisible = true;
             } else {
-                data.content = data.content.replace(/<span[^>]*>/g, '').replace(/<\/span>/g, '');  // 去除span标签
+                data.content = data.content.replace(/<span[^>]*>/g, '').replace(/<\/span>/g, ''); // 去除span标签
                 this.currentContent = data;
 
                 this.editVisible = true;
                 this.currentId = dataId;
             }
         },
+        onAddContent(dataId) {
+            this.addContentVisible = true;
+            this.addContent = {};
+
+            this.currentId = dataId;
+        },
         async onDrop(event, dataId) {
             if (event.dataTransfer.getData('image')) {
                 const draggedImage = JSON.parse(event.dataTransfer.getData('image'));
@@ -1330,16 +1467,16 @@ export default {
         },
 
         // 确定保存图片
-       async savePic() {
+        async savePic() {
             this.picStyle.picUrl;
-            var str=this.picStyle.note
+            var str = this.picStyle.note;
-            str= await this.$commonJS.decodeHtml(str)
+            str = await this.$commonJS.decodeHtml(str);
             if (this.picStyle.visiTitle == 'Edit Figure') {
                 this.$api
                     .post(this.urlList.editImage, {
                         ami_id: this.picStyle.ami_id,
                         url: this.picStyle.picUrl,
-                        note:str 
+                        note: str
                     })
                     .then((res) => {
                         if (res.code == 0) {
@@ -1391,14 +1528,14 @@ export default {
                 this.$refs.tinymceChildComment.getContent('comment');
             });
         },
-       async saveTable(content) {
+        async saveTable(content) {
             console.log('content at line 998:', content);
-            var strTitle=this.lineStyle.title
+            var strTitle = this.lineStyle.title;
-            strTitle= await this.$commonJS.decodeHtml(strTitle)
+            strTitle = await this.$commonJS.decodeHtml(strTitle);
 
-            var strNote=this.lineStyle.note
+            var strNote = this.lineStyle.note;
-            if(strNote!=''){
+            if (strNote != '') {
-                 strNote= await this.$commonJS.decodeHtml(strNote)
+                strNote = await this.$commonJS.decodeHtml(strNote);
             }
 
             if (content && content.table && content.table.length > 0) {

src/components/page/ReferenceEditor.vue

@@ -92,6 +92,10 @@
                     <li>
                         <p>- If you want to discard all references and import a new batch of reference information, please click <el-button type="text" @click="removeAll">Delete and re-import</el-button>.</p>
                     </li>
+                   <li >
+                        <p style="display: flex;align-items: center">- Please note that if this status exists, <span > <img src="../../assets/img/repeat.png"  alt="" style="width: 24px;height: 24px;margin-left: 5px;margin-right: 5px">
+                           </span>  it indicates that the current reference is duplicated .</p>
+                    </li> 
                    <li>
                         <p>- Please do not forget to recheck all references in the <span  class="status ok float" ><i class="el-icon-circle-check"></i></span> status,especially abbreviated journal title.</p>
                     </li> 
@@ -100,7 +104,12 @@
             <div class="refenceCentent mt20">
                 <el-table :data="tableData"  ref="multipleTable"  
               empty-text="New messages (0)" :show-header="false" :stripe="false" :highlight-current-row="false"> 
-                    <el-table-column type="index" label="No." width="55" align="center"></el-table-column>
+                    <el-table-column type="index" label="No." width="60" align="center">
+                        <template slot-scope="scope" >
+                            <img src="../../assets/img/repeat.png" v-if="scope.row.is_repeat==1" alt="" style="width: 24px;height: 24px;float: left;">
+                            <span>{{scope.$index+1}}</span>
+                        </template>
+                    </el-table-column>
                     <el-table-column label="state"  width="55" align="center">
                         <template slot-scope="scope">                           
                             <span  class="status ok"  v-if="scope.row.refer_type == 'journal' && scope.row.doilink != '' ||  scope.row.refer_type == 'book' && scope.row.isbn != '' "  >

src/components/page/comArtHtmlCreatNew.vue

@@ -200,6 +200,7 @@ export default {
     },
 
     methods: {
+        
         goEdit() {
             window.open(this.$router.resolve({  path: '/GenerateCharts',
                 query: {

src/components/page/components/Tinymce/index.vue

@@ -324,10 +324,13 @@ export default {
                                 // _this.updateTableStyles(container); // 根据需要应用额外的样式
                                 args.content = container.innerHTML; // 更新处理后的内容
                             });
+                        }else{
+                            
                         }
                     } else {
                         if (_this.isAutomaticUpdate) {
                             args.content = _this.$commonJS.transformHtmlString(args.content); // 更新处理后的内容
+                           
                         }
                         console.log('粘贴的内容不包含表格');
                     }

src/components/page/components/table/word.vue

@@ -1,5 +1,9 @@
 <template>
-    <div class="tinymce-container editor-container word-container" :style="!isPreview ? 'padding:10px 20px 10px 10px;' : 'padding:0px;'" ref="scrollDiv">
+    <div
+        class="tinymce-container editor-container word-container"
+        :style="!isPreview ? 'padding:10px 20px 10px 30px;' : 'padding:0px;'"
+        ref="scrollDiv"
+    >
         <div
             style="
                 box-shadow: 0 2px 2px -2px rgba(34, 47, 62, 0.1), 0 8px 8px -4px rgba(34, 47, 62, 0.07);
@@ -9,10 +13,101 @@
             "
         >
             <div
-                class=""
+                v-if="!isPreview"
-                :style="isPreview ? 'width: 100%;padding: 20px;' : 'width: calc(100% - 300px);padding: 20px  20px 20px 34px;'"
                 style="
+                    border-bottom: 2px solid #c7cdcf;
+                    background-color: #fff;
+                    position: fixed;
+                    top: 60px;
+                    left: 285px;
+                    z-index: 10;
+                    right: 330px;
+                    height: 60px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: space-between;
+                    padding: 10px;
+                    box-sizing: border-box;
+                    overflow: hidden;
+                    width: calc(100% - 285px - 330px);
+                "
+            >
+                <div style="width: auto; display: flex; align-items: center">
+                    <!-- <el-checkbox v-model="checked" style="border-right: 1px solid #d8d8d8; padding: 0 20px 0 0;z-index: 10;"  size="medium">Select All</el-checkbox> -->
+                    <div
+                        style="border-right: 1px solid #d8d8d8; padding: 0 20px"
+                        :style="currentData.type == 0 ? 'Opacity:1' : 'Opacity:0.6'"
+                    >
+                        <ul class="HTitleBox">
+                            <li
+                                :style="currentData.is_h1 == 1 ? 'color:#4d99f1' : 'color:#333'"
+                                @click="currentData.is_h1 == 0 ? changeTitle(1) : changeTitle(0)"
+                            >
+                                H1
+                            </li>
+                            <li
+                                :style="currentData.is_h2 == 1 ? 'color:#4d99f1' : 'color:#333'"
+                                @click="currentData.is_h2 == 0 ? changeTitle(2) : changeTitle(0)"
+                            >
+                                H2
+                            </li>
+                            <li
+                                :style="currentData.is_h3 == 1 ? 'color:#4d99f1' : 'color:#333'"
+                                @click="currentData.is_h3 == 0 ? changeTitle(3) : changeTitle(0)"
+                            >
+                                H3
+                            </li>
+                        </ul>
+                    </div>
+                    <div style="border-right: 1px solid #d8d8d8; padding: 0 20px">
+                        <ul class="HTitleBox" style="border: none">
+                            <li @click="addContent" style="font-size: 14px; padding: 0">
+                                <i class="el-icon-document"> </i>
+                                Batch Add content
+                            </li>
+                        </ul>
+                    </div>
+                </div>
 
+                <div style="border-left: 1px solid #d8d8d8; padding: 0 20px; float: right">
+                    <ul class="operateBox">
+                        <li
+                            v-if="isEditComment"
+                            style="height: 40px; background-color: #fff !important; color: #f56c6c; border: 1px solid #f56c6c"
+                            @mousedown="cacheSelection"
+                            @click="handleSelection"
+                        >
+                            <i class="el-icon-document-add" style="margin-top: 2px"></i>
+
+                            Comment
+                        </li>
+                        <li
+                            style="height: 40px; background-color: #cbccd1 !important; color: #333; border: 1px solid #cbccd1"
+                            @click="onAddRow"
+                        >
+                            <i class="el-icon-document-add" style="margin-top: 2px"></i>
+
+                            Row
+                        </li>
+
+                        <li style="height: 40px" @click="onEdit">
+                            <i class="el-icon-edit" style="margin-top: 2px"></i>
+
+                            Edit
+                        </li>
+
+                        <li style="height: 40px; background-color: red !important" @click="onDelete">
+                            <i class="el-icon-delete" style="margin-top: 2px"></i>
+
+                            Delete
+                        </li>
+                    </ul>
+                </div>
+            </div>
+            <div
+                class=""
+                :style="isPreview ? 'width: 100%;padding: 20px;' : 'width: calc(100% - 300px);padding: 60px  20px 20px 34px;'"
+                style="
                     box-sizing: border-box;
                     width: calc(100% - 300px);
                     float: left;
@@ -22,6 +117,13 @@
                 "
             >
                 <template v-for="(item, index) in wordList">
+                    <el-checkbox
+                        @change="updateUniqueIds"
+                        v-if="!isPreview"
+                        v-model="item.checked"
+                        style="position: absolute; left: -20px; width: 8px; height: 8px; margin-top: 8px"
+                    ></el-checkbox>
+
                     <span class="isRemark" :remark-main-id="item.am_id" v-if="item.checks && item.checks.length > 0 && !isPreview">
                         ><img
                             class="isRemark"
@@ -32,98 +134,140 @@
 
                         <span>{{ item.am_id }}</span>
                     </span>
-                    <div :class="!isPreview?(item.is_h1?'isTitleH1':item.is_h2?'isTitleH2':item.is_h3?'isTitleH3':''):''" style="line-height: 24px;">
+                    <div
-                        <template v-if="!isPreview"> <span class="Htitle Htitle1" v-if="item.is_h1==1">H1</span>
+                        :class="!isPreview ? (item.is_h1 ? 'isTitleH1' : item.is_h2 ? 'isTitleH2' : item.is_h3 ? 'isTitleH3' : '') : ''"
-                        <span class="Htitle Htitle2" v-else-if="item.is_h2==1">H2</span>
+                        style="line-height: 24px"
-                        <span class="Htitle Htitle3" v-else-if="item.is_h3==1">H3</span></template>
+                    >
-                       
+                        <template v-if="!isPreview">
-                        <div
+                            <span class="Htitle Htitle1" v-if="item.is_h1 == 1">H1</span>
-                            :key="item.am_id"
+                            <span class="Htitle Htitle2" v-else-if="item.is_h2 == 1">H2</span>
-                            id="drop-target"
+                            <span class="Htitle Htitle3" v-else-if="item.is_h3 == 1">H3</span></template
-                            :class="highlightImg(item.ami_id, item.checks ? item.checks : [])"
-                            :comment-Id="highlightImgCommentId(item.ami_id, item.checks ? item.checks : [])"
-                            @dragover="handleDragOver"
-                            @dragenter="handleDragEnter"
-                            @dragleave="handleDragLeave"
-                            @drop="handleDrop"
-                            class="MaxPicture pMain myeditabledivImage drop-target"
-                            @click="initializeEditor(item.am_id, 'img', item)"
-                            v-if="item.type == 1"
-                            :main-state="item.state"
-                            :remark="item.checks && item.checks.length > 0 ? 1 : 0"
-                            :contenteditable="!readonly && !isPreview"
-                            :data-id="item.ami_id"
-                            :type="item.type"
-                            :main-id="item.am_id"
-                            :id="'editor' + item.am_id"
                         >
-                            <img :src="`${mediaUrl + item.image.url}`" />
 
-                            <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`">
+                        <div :class="currentId == item.am_id ? 'glowing-border' : ''" style="position: relative">
-                                <span v-html="item.image.note ? highlightText(item.image.note, item.checks ? item.checks : []) : ''"></span>
+                            <div
-                            </font>
+                                v-if="currentId == item.am_id"
-                        </div>
+                                style="background-color: #fff; z-index: 100; position: absolute; right: 0px; top: -40px"
-                        <div
+                            >
-                            id="drop-target"
+                                <el-button
-                            @dragover="handleDragOver"
+                                    v-if="currentId == item.am_id"
-                            @dragenter="handleDragEnter"
+                                    style="background-color: #006699d1; font-weight: bold; color: #fff; font-size: 16px !important"
-                            @dragleave="handleDragLeave"
+                                    :style="index==0?' opacity: 0.2;':' opacity: 1;'"
-                            @drop="handleDrop"
+                                    size="mini"
-                            @click="initializeEditor(item.am_id, 'table', item)"
+                                    plain
-                            class="thumbnailTableBox wordTableHtml table_Box pMain myeditabledivTable drop-target"
+                                    :disabled="index != 0 ? false : true"
-                            v-else-if="item.type == 2"
+                                    @click="changeSort('up')"
-                            :main-state="item.state"
+                                    >↑</el-button
-                            :remark="item.checks && item.checks.length > 0 ? 1 : 0"
+                                >
-                            :contenteditable="!readonly && !isPreview"
+                                <el-button
-                            :data-id="item.amt_id"
+                                    v-if="currentId == item.am_id"
-                            :type="item.type"
+                                    style="
-                            :id="'editor' + item.am_id"
-                            :main-id="item.am_id"
-                        >
-                            <!-- 标题部分 -->
-                            <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`" style="text-align: center;">
-                                <span v-html="highlightText(item.table.title || '', item.checks ? item.checks : [])"></span>
-                            </font>
                                        
-                            <!-- 表格部分 -->
+                                        background-color: #006699d1;
-                            <table border="1" style="width: 100%; border-collapse: collapse; text-align: center">
+                                        font-weight: bold;
-                                <tr v-for="(row, i) in JSON.parse(item.table.table_data)" :key="i" :class="{ 'table-header-row': isHeaderRow(i,item.table.table_data) }">
+                                        color: #fff;
-                                    <td 
+                                        font-size: 16px !important;
-                                        v-for="(cell, i1) in row"
+                                    "
-                                        :key="i1"
+                                    size="mini"
-                                        :colspan="`${cell.colspan || 1}`"
+                                    :style="index == wordList.length - 1 ?' opacity: 0.2;':' opacity: 1;'"
-                                        :rowspan="`${cell.rowspan || 1}`"
+                                    plain
+                                    :disabled="index == wordList.length - 1 ? true : false"
+                                    @click="changeSort('down')"
+                                    >↓</el-button
+                                >
+                            </div>
+
+                            <div
+                                :key="item.am_id"
+                                id="drop-target"
+                                :class="highlightImg(item.ami_id, item.checks ? item.checks : [])"
+                                :comment-Id="highlightImgCommentId(item.ami_id, item.checks ? item.checks : [])"
+                                @dragover="handleDragOver"
+                                @dragenter="handleDragEnter"
+                                @dragleave="handleDragLeave"
+                                @drop="handleDrop"
+                                class="MaxPicture pMain myeditabledivImage drop-target"
+                                @click="initializeEditor(item.am_id, 'img', item, index)"
+                                v-if="item.type == 1"
+                                :main-state="item.state"
+                                :remark="item.checks && item.checks.length > 0 ? 1 : 0"
+                                :data-id="item.ami_id"
+                                :type="item.type"
+                                :main-id="item.am_id"
+                                :id="'editor' + item.am_id"
+                            >
+                                <img :src="`${mediaUrl + item.image.url}`" />
+
+                                <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`">
+                                    <span
+                                        v-html="item.image.note ? highlightText(item.image.note, item.checks ? item.checks : []) : ''"
+                                    ></span>
+                                </font>
+                            </div>
+                            <div
+                                id="drop-target"
+                                @dragover="handleDragOver"
+                                @dragenter="handleDragEnter"
+                                @dragleave="handleDragLeave"
+                                @drop="handleDrop"
+                                @click="initializeEditor(item.am_id, 'table', item, index)"
+                                class="thumbnailTableBox wordTableHtml table_Box pMain myeditabledivTable drop-target"
+                                v-else-if="item.type == 2"
+                                :main-state="item.state"
+                                :remark="item.checks && item.checks.length > 0 ? 1 : 0"
+                                :data-id="item.amt_id"
+                                :type="item.type"
+                                :id="'editor' + item.am_id"
+                                :main-id="item.am_id"
+                            >
+                                <!-- 标题部分 -->
+                                <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`" style="text-align: center">
+                                    <span v-html="highlightText(item.table.title || '', item.checks ? item.checks : [])"></span>
+                                </font>
+
+                                <!-- 表格部分 -->
+                                <table border="1" style="width: 100%; border-collapse: collapse; text-align: center">
+                                    <tr
+                                        v-for="(row, i) in JSON.parse(item.table.table_data)"
+                                        :key="i"
+                                        :class="{ 'table-header-row': isHeaderRow(i, item.table.table_data) }"
                                     >
-                                        <span v-html="highlightText(cell.text || '', item.checks ? item.checks : [])"></span>
+                                        <td
-                                    </td>
+                                            v-for="(cell, i1) in row"
-                                </tr>
+                                            :key="i1"
-                            </table>
+                                            :colspan="`${cell.colspan || 1}`"
+                                            :rowspan="`${cell.rowspan || 1}`"
+                                        >
+                                            <span v-html="highlightText(cell.text || '', item.checks ? item.checks : [])"></span>
+                                        </td>
+                                    </tr>
+                                </table>
 
-                            <!-- 备注部分 -->
+                                <!-- 备注部分 -->
-                            <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`">
+                                <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`">
-                                <span v-html="highlightText(item.table.note || '', item.checks ? item.checks : [])"></span>
+                                    <span v-html="highlightText(item.table.note || '', item.checks ? item.checks : [])"></span>
-                            </font>
+                                </font>
+                            </div>
+
+                            <div
+                                v-else
+                                id="drop-target"
+                                @dragover="handleDragOver"
+                                @dragenter="handleDragEnter"
+                                @dragleave="handleDragLeave"
+                                @drop="handleDrop"
+                                @click="initializeEditor(item.am_id, 'text', item, index)"
+                                class="pMain myeditablediv drop-target"
+                                @blur="clearEditor(item.am_id)"
+                                :main-state="item.state"
+                                :remark="item.checks && item.checks.length > 0 ? 1 : 0"
+                                :data-id="item.am_id"
+                                :main-id="item.am_id"
+                                :type="item.type"
+                                :id="'editor' + item.am_id"
+                                v-html="highlightText(item.content, item.checks ? item.checks : [], item.type)"
+                            ></div>
                         </div>
-
-                        <div
-                            v-else
-                            id="drop-target"
-                            @dragover="handleDragOver"
-                            @dragenter="handleDragEnter"
-                            @dragleave="handleDragLeave"
-                            @drop="handleDrop"
-                            @click="initializeEditor(item.am_id)"
-                            class="pMain myeditablediv drop-target"
-                            @blur="clearEditor(item.am_id)"
-                            :main-state="item.state"
-                            :remark="item.checks && item.checks.length > 0 ? 1 : 0"
-                            :contenteditable="!readonly && !isPreview"
-                            :data-id="item.am_id"
-                            :main-id="item.am_id"
-                            :type="item.type"
-                            :id="'editor' + item.am_id"
-                            v-html="highlightText(item.content, item.checks ? item.checks : [], item.type)"
-                        ></div>
                     </div>
                 </template>
             </div>
@@ -146,7 +290,7 @@
                     v-for="(item, index) in commentList"
                     class="comment-item annotation"
                     :data-target="`main-${item.am_id}`"
-                    style="width: 100%; margin:0 0 10px; background: #fafafa; box-sizing: border-box"
+                    style="width: 100%; margin: 0 0 10px; background: #fafafa; box-sizing: border-box"
                 >
                     <div>
                         <div style="display: flex; align-items: center; justify-content: space-between; background-color: #f3d5d5c2">
@@ -162,21 +306,16 @@
                             </el-link>
                         </div>
                         <div
-                            style="
+                            style="padding: 6px 6px; box-sizing: border-box; border-bottom: 1px solid rgba(243, 213, 213)"
-                           
-                                padding:6px 6px;
-                                box-sizing: border-box;
-                                border-bottom: 1px solid rgba(243, 213, 213);
-                            "
                             :style="commont.estate == 1 ? 'background:#13bc200f;' : ''"
                             v-for="(commont, commentIndex) in item.comment"
                             @click="highlightLeftComment(commont.amc_id, item.am_id)"
                         >
                             <div style="width: 100%; display: flex; align-items: center; justify-content: space-between">
-                                <div style="display: flex; align-items: center;line-height: 20px;">
+                                <div style="display: flex; align-items: center; line-height: 20px">
                                     <span
                                         :style="commont.estate == 1 ? 'opacity:0.6;color:rgb(19, 188, 32);' : ''"
-                                        style="color: #e61a12; font-weight: bold;font-size: 12px;"
+                                        style="color: #e61a12; font-weight: bold; font-size: 12px"
                                         >{{ commentIndex + 1 }}、</span
                                     >
                                     <span
@@ -195,7 +334,7 @@
                                         $t('commonTable.Resolved')
                                     }}</span>
                                 </div>
-                                <div style="display: flex; align-items: center; justify-content: center;line-height: 20px;">
+                                <div style="display: flex; align-items: center; justify-content: center; line-height: 20px">
                                     <span style="color: #b8b7b7; font-size: 12px">{{ getTime(commont.ctime) }}</span
                                     ><span
                                         style="color: #aaa; font-size: 13px; margin: 0 4px"
@@ -302,7 +441,10 @@
                                     "
                                 >
                                     <i class="el-icon-user-solid" style="color: #333; padding: 0 4px"></i>
-                                    <div v-html="commont.author_remark" style="width: calc(100% - 20px); font-size: 13px;line-height: 14px;"></div>
+                                    <div
+                                        v-html="commont.author_remark"
+                                        style="width: calc(100% - 20px); font-size: 13px; line-height: 14px"
+                                    ></div>
                                 </div>
                                 <i
                                     class="el-icon-edit"
@@ -510,6 +652,14 @@ export default {
     },
     data() {
         return {
+            cachedHtml: '', // 缓存选中的 HTML
+            cachedText: '', // 缓存选中的纯文本
+            cachedMainId: null, // 选中的 main-id
+            cachedType: null, // 选中的 type
+            currentId: null,
+            currentIndex: null,
+            checked: false,
+            currentData: {},
             imagePath: require('@/assets/img/carriageReturn.png'), // 或者你可以设置其他路径
             scrollPosition: 0,
             wordList: [],
@@ -556,6 +706,7 @@ export default {
                 }
             ],
             uploadReset: false,
+            uniqueIds: [],
             dialogVisible: false,
             form: {
                 name: '',
@@ -589,6 +740,11 @@ export default {
             deep: true // 启用深度监听
         }
     },
+    computed: {
+        selectedIds() {
+            return this.wordList.filter((item) => item.checked).map((item) => item.am_id);
+        }
+    },
     updated() {
         // 恢复子组件的滚动位置
         // this.$refs.scrollDiv.scrollTop = this.scrollPosition;
@@ -623,8 +779,6 @@ export default {
         this.editors = {};
     },
     beforeDestroy() {
-      
-
         for (const key in this.editors) {
             if (this.editors[key]) {
                 // 确保销毁所有编辑器实例
@@ -639,6 +793,143 @@ export default {
         this.editors = {};
     },
     methods: {
+        changeSort(type) {
+            console.log('type at line 782:', type); 
+            if (this.currentId) {
+                this.$emit('changeSort',type, this.currentId);
+            } 
+        },
+        addContent() {
+            if (this.currentId) {
+                this.$emit('addContent', this.currentId);
+            } else {
+                this.$message.warning('Please select content');
+            }
+           
+        },
+        cacheSelection() {
+            const selection = window.getSelection();
+            if (!selection.rangeCount) {
+                this.clearCache();
+                return;
+            }
+
+            const range = selection.getRangeAt(0);
+            let selectedNode = range.commonAncestorContainer;
+
+            // **向上查找包含 main-id 的最近 div**
+            let outerDiv = selectedNode;
+            while (outerDiv && outerDiv.tagName !== 'DIV') {
+                outerDiv = outerDiv.parentNode;
+            }
+
+            if (!outerDiv) {
+                this.clearCache();
+                return;
+            }
+
+            // **缓存 main-id 和 type**
+            this.cachedMainId = outerDiv.getAttribute('main-id');
+            this.cachedType = outerDiv.getAttribute('type');
+
+            // **创建临时 div 存放选中的 HTML**
+            const tempDiv = document.createElement('div');
+            tempDiv.appendChild(range.cloneContents());
+
+            // **检查是否包含 <img> 标签**
+            if (tempDiv.querySelector('img')) {
+                this.clearCache();
+                this.$message.error(this.$t('commonTable.selectComment'));
+                return;
+            }
+
+            // **获取纯文本**
+            let selectedText = tempDiv.innerText.trim().replace(/\s+/g, ' ');
+
+            // **允许保留的 HTML 标签**
+            const allowedTags = ['sup', 'sub', 'strong', 'em', 'b', 'i', 'blue', 'tr', 'td'];
+
+            function preserveTags(node) {
+                if (node.nodeType === 3) return node.nodeValue; // 文本节点
+                if (node.nodeType === 1 && allowedTags.includes(node.nodeName.toLowerCase())) {
+                    return node.outerHTML; // 仅保留允许的标签
+                }
+                return '';
+            }
+
+            let preservedContent = Array.from(tempDiv.childNodes).map(preserveTags).join('');
+
+            // **检查是否已有批注**
+            if (tempDiv.querySelector('.positionRemarkIndex')) {
+                this.clearCache();
+                this.$message.error(this.$t('commonTable.alreadyCommented'));
+                return;
+            }
+
+            // **缓存选区内容**
+            this.cachedHtml = preservedContent;
+            this.cachedText = selectedText;
+        },
+
+        // **点击“添加批注”按钮**
+        handleSelection() {
+            if (!this.cachedText) {
+                this.$message.error(this.$t('commonTable.selectComment'));
+                return;
+            }
+
+            // **发送批注**
+            this.$emit('onAddComment', {
+                mainId: this.cachedMainId,
+                label: this.cachedHtml
+            });
+
+            // **清空缓存**
+            this.clearCache();
+        },
+
+        // **清空缓存**
+        clearCache() {
+            this.cachedHtml = '';
+            this.cachedText = '';
+            this.cachedMainId = null;
+            this.cachedType = null;
+        },
+        updateUniqueIds() {
+            this.currentId = null;
+            this.currentData = {};
+            // this.uniqueIds = [...new Set(this.wordList.filter((item) => item.checked).map((item) => item.am_id))];
+            console.log('this.uniqueIds at line 839:', this.selectedIds);
+            this.$forceUpdate();
+        },
+        onEdit() {
+            this.currentData = this.currentData;
+            this.$emit('onEdit', this.currentId);
+        },
+        onAddRow() {
+            this.currentData = this.currentData;
+            this.$emit('onAddRow', this.currentId);
+        },
+        onDelete() {
+            console.log('this.uniqueIds.length at line 866:', this.selectedIds.length);
+            if (this.selectedIds.length > 0) {
+                this.$emit('onDeletes', this.selectedIds.toString());
+                this.$forceUpdate();
+            }
+
+            if (this.currentId) {
+                this.$emit('onDelete', this.currentId);
+            }
+        },
+
+        changeTitle(value) {
+            if (this.currentData.type == 0) {
+                this.$emit('onEditTitle', {
+                    mainId: this.currentId,
+                    value: value
+                });
+            }
+        },
         // 右侧批注列点击时，触发高亮左侧对应的批注
         // 右侧批注列点击时，触发高亮左侧对应的批注
         highlightLeftComment(commentId) {
@@ -689,16 +980,14 @@ export default {
             if (outerDiv) {
             }
         },
-         // 判断是否是表头行
+        // 判断是否是表头行
-    isHeaderRow(rowIndex,table) {
+        isHeaderRow(rowIndex, table) {
+            var table = JSON.parse(table);
 
-    var table=JSON.parse(table)
+            var head = table[0];
 
-    var head=table[0]
+            return rowIndex < head[0].rowspan; // 假设前两行是表头
-  
+        },
-    
-      return rowIndex < head[0].rowspan; // 假设前两行是表头
-    },
         handleDragLeave(e) {
             e.preventDefault();
             e.stopPropagation();
@@ -959,28 +1248,38 @@ export default {
                 }
             });
         },
-        initializeEditor(index, type, data) {
+        initializeEditor(id, type, data, index) {
+            this.clearHighlight();
+            this.selectedIds = [];
+            this.wordList.forEach((item, index) => {
+                item.checked = false;
+            });
             if (!this.isPreview) {
-                const editorId = `editor${index}`;
+                this.currentId = id;
-                // 检查当前编辑器是否已经初始化
+                this.currentIndex = index;
-                if (this.editors[editorId]) return;
+                this.currentData = data;
-                // 销毁所有已初始化的编辑器实例
-                for (const key in this.editors) {
-                    if (this.editors[key]) {
-                        // 确保销毁所有编辑器实例
-                        tinymce.remove(this.editors[key]);
-                        this.editors[key] = null; // 清除引用
-                    }
-                }
                 
-                if (type == 'img') {
+
-                    this.initTinymceImg(editorId);
+                // const editorId = `editor${index}`;
-                } else if (type == 'table') {
+                // // 检查当前编辑器是否已经初始化
-                    this.initTinymceTable(editorId);
+                // if (this.editors[editorId]) return;
-                } else {
+                // // 销毁所有已初始化的编辑器实例
-                    this.initTinymceContent(editorId);
+                // for (const key in this.editors) {
-                }
+                //     if (this.editors[key]) {
-                this.$set(this.editors, editorId, tinymce.get(`editor${index}`));
+                //         // 确保销毁所有编辑器实例
+                //         tinymce.remove(this.editors[key]);
+                //         this.editors[key] = null; // 清除引用
+                //     }
+                // }
+
+                // if (type == 'img') {
+                //     this.initTinymceImg(editorId);
+                // } else if (type == 'table') {
+                //     this.initTinymceTable(editorId);
+                // } else {
+                //     this.initTinymceContent(editorId);
+                // }
+                // this.$set(this.editors, editorId, tinymce.get(`editor${index}`));
             }
         },
         deleteComment(data) {
@@ -1025,6 +1324,8 @@ export default {
         },
         divOnScroll() {
             if (!this.isPreview) {
+                this.currentId = null;
+                this.currentData = {};
                 // const scrollTop = scrollDiv.scrollTop; // 获取垂直滚动距离
                 this.scrollPosition = this.$refs.scrollDiv.scrollTop;
                 localStorage.setItem('scrollPosition', this.scrollPosition);
@@ -1071,16 +1372,11 @@ export default {
             }
         },
         highlightImgCommentId(imgId, annotations) {
-           
+            const emptyContentIndexes = annotations
-                 const emptyContentIndexes = annotations
                 .map((annotation, index) => (annotation.content === '' ? annotation.amc_id : -1)) // 找到内容为空的批注项的索引，其他项返回 -1
                 .filter((index) => index !== -1) // 过滤掉值为 -1 的项
                 .join(','); // 以逗号连接索引
-                return emptyContentIndexes;
+            return emptyContentIndexes;
-           
-           
-
-            
         },
         escapeRegExp(string) {
             return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
@@ -1118,7 +1414,7 @@ export default {
                         style="background-color: ${randomColor}; 
                                position: relative; 
                                display: inline-block; 
-                               white-space: nowrap; 
+                            //    white-space: nowrap; 
                                overflow-wrap: anywhere; 
                                border-left: 2px solid #cd5454; 
                                border-right: 2px solid #cd5454;"
@@ -1134,7 +1430,6 @@ export default {
                     });
                 });
                 if (type == 0 && tempText == '') {
-             
                     tempText =
                         tempText +
                         `<img contenteditable="${false}" src="${this.imagePath}" alt="" style="width: 20px;height: 20px;opacity:0.6;">`;
@@ -1851,6 +2146,7 @@ export default {
 .pMain {
     margin-top: 5px;
     margin-bottom: 5px;
+    min-height: 30px;
 }
 ::v-deep .tox.tox-tinymce-inline {
     z-index: 9999 !important;
@@ -1955,18 +2251,17 @@ export default {
     border: 2px solid #cd5454; /* 高亮边框 */
     box-shadow: 0 0 10px #f77b7b; /* 高亮阴影 */
 }
-.isTitleH1{
+.isTitleH1 {
-  position: relative;
+    position: relative;
-  /* border: 1px solid #94c2f7; */
+    /* border: 1px solid #94c2f7; */
     background-color: #dbebfc54;
 }
 
- .Htitle{
+.Htitle {
-  
+    color: #4d99f1;
-   color: #4d99f1;
+    background-color: #dbebfca6;
-   background-color: #dbebfca6;
+    /* border: 1px solid #4d99f1; */
-   /* border: 1px solid #4d99f1; */
+    border-radius: 50%;
-   border-radius: 50%;
     font-weight: bold;
     position: absolute;
 
@@ -1976,25 +2271,85 @@ export default {
     left: -30px;
     top: 0px;
     text-align: center;
-
 }
-.Htitle1{
+.Htitle1 {
     width: 24px;
     height: 24px;
     /* font-size: 14px; */
 }
-.Htitle2{   width: 24px;
+.Htitle2 {
+    width: 24px;
     height: 24px;
     /* font-size: 16px; */
 }
-.Htitle3{   width: 24px;
+.Htitle3 {
+    width: 24px;
     height: 24px;
     /* font-size: 12px; */
 }
-.isTitleH2{position: relative;
+.isTitleH2 {
+    position: relative;
     background-color: #dbebfc54;
 }
-.isTitleH3{position: relative;
+.isTitleH3 {
+    position: relative;
     background-color: #dbebfc54;
 }
+.glowing-border {
+    border: 3px solid #006699d1;
+    border-radius: 5px;
+    padding: 4px;
+    animation: glow 1.5s infinite alternate;
+}
+@keyframes glow {
+    0% {
+        box-shadow: 0 0 5px #006699d1;
+    }
+    50% {
+        box-shadow: 0 0 20px #006699d1;
+    }
+    100% {
+        box-shadow: 0 0 5px #006699d1;
+    }
+}
+.HTitleBox {
+    height: 100%;
+    border: 1px solid #c5c5c5;
+    width: auto;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-radius: 6px;
+}
+.HTitleBox li {
+    list-style: none;
+    padding: 0 10px;
+    color: #333;
+    font-weight: bold;
+    font-size: 20px;
+}
+.operateBox {
+    width: auto;
+    display: flex;
+}
+.operateBox li {
+    width: 55px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    list-style: none;
+    padding: 2px 10px;
+    margin: 0 10px;
+    color: #8a8a8b;
+    /* font-weight: bold; */
+    font-size: 16px;
+    background-color: rgb(43, 129, 239) !important;
+    color: #fff;
+    border-radius: 4px;
+}
+::v-deep .el-checkbox__inner {
+    width: 18px;
+    height: 18px;
+}
 </style>

src/components/page/editPublicRefRdit.vue

@@ -78,6 +78,7 @@
 										<el-table-column type="index" label="No." width="55" align="center">											
 												<template slot-scope="scope">													
 													<i v-if="scope.row.is_change == 1" class="itemChanged"></i>
+													<img src="../../assets/img/repeat.png" v-if="scope.row.is_repeat==1" alt="" style="width: 24px;height: 24px;float: left;">
 													<span>{{scope.$index + 1}}</span>												
 												</template>											
 										</el-table-column>