Merge branch 'zy-email' of https://gitee.com/wjl2008_admin/tougao_web into pay

src/common/js/commonJS.js

@@ -137,8 +137,7 @@ export default {
             console.error("解析粘贴内容失败：", error);
             callback([]);
         }
-    }
+    },
-    ,
     
     async extractWordTablesToArrays(file, callback) {
         const Zip = new JSZip();
@@ -419,13 +418,7 @@ export default {
             const levelIndex = parseInt(level, 10) - 1;
             return currentLevelNumbers[levelIndex] || 1;
         });
-    }
+    },
-
-    ,
-
-
-
-
 
 
     async extractTablesFromWord(arrayBuffer, callback) {
@@ -450,8 +443,25 @@ export default {
             const numberingMap = this.parseNumbering(numberingDoc);
             console.log('numberingMap at line 232:', numberingMap)
             // 提取表格
-            const tables = xmlDoc.getElementsByTagName("w:tbl");
+            // 获取所有的段落
-            console.log('tables at line 17:', tables)
+        const paragraphs = xmlDoc.getElementsByTagName("w:p");
+        // 获取所有的表格
+        const tables = xmlDoc.getElementsByTagName("w:tbl");
+
+        // 找到表格前的段落
+        let previousParagraphs = [];
+        let tableIndex = 0;
+
+        // 遍历段落，找到第一个表格之前的段落
+        for (let i = 0; i < paragraphs.length; i++) {
+            if (tableIndex < tables.length && paragraphs[i].nextSibling === tables[tableIndex]) {
+                break; // 找到表格
+            }
+            previousParagraphs.push(paragraphs[i]);
+        }
+// 将前一段的内容转化为 HTML 或文本
+const previousHtml = this.convertParagraphsToHtml(previousParagraphs);
+            console.log('tables at line 17:', previousHtml)
             const tableHtml = this.convertTablesToHtml(tables, numberingMap);
             console.log('tableHtml at line 18:', tableHtml)
 
@@ -467,7 +477,45 @@ export default {
             callback("<p>文件解析失败，请检查文件格式。</p>");
         }
     },
+// 转换段落为 HTML
+convertParagraphsToHtml(paragraphs) {
+    let html = "";
+    paragraphs.forEach(p => {
+        let paragraphHtml = "";
+        
+        // 处理段落中的所有子元素
+        const runs = p.getElementsByTagName("w:r");  // 获取段落中的所有文本运行（可能包含上标、下标等）
+        
+        Array.from(runs).forEach(run => {
+            let text = "";
+            
+            // 获取文本内容
+            const textNodes = run.getElementsByTagName("w:t");
+            Array.from(textNodes).forEach(t => {
+                text += t.textContent || t.text;
+            });
+            
+            // 检查是否为上标或下标
+            const isSuperscript = run.getElementsByTagName("w:vertAlign")[0]?run.getElementsByTagName("w:vertAlign")[0].getAttribute("w:val") === "superscript":"";
+            const isSubscript = run.getElementsByTagName("w:vertAlign")[0]?run.getElementsByTagName("w:vertAlign")[0].getAttribute("w:val") === "subscript":'';
 
+            if (isSuperscript) {
+                text = `<sup>${text}</sup>`;
+            } else if (isSubscript) {
+                text = `<sub>${text}</sub>`;
+            }
+
+            // 拼接到段落 HTML 中
+            paragraphHtml += text;
+        });
+
+        // 将运行的文本拼接成完整的段落
+        html += `<p>${paragraphHtml}</p>`;
+    });
+
+    return html;
+}
+,
     convertTablesToHtml(tables, numberingMap) {
         const namespace = "http://schemas.openxmlformats.org/wordprocessingml/2006/main";
         let html = "";
@@ -544,8 +592,7 @@ export default {
         }
 
         return html;
-    }
+    },
-    ,
 
 
 

src/components/common/common.vue

@@ -2,12 +2,12 @@
 //记得切换
 
 //正式
-const mediaUrl = '/public/';
+// const mediaUrl = '/public/';
-const baseUrl = '/';
+// const baseUrl = '/';
 
 
-// const mediaUrl = 'https://submission.tmrjournals.com/public/';
+const mediaUrl = 'https://submission.tmrjournals.com/public/';
-// const baseUrl = '/api';
+const baseUrl = '/api';
 
 
 //本地(正式环境 )

src/components/page/GenerateCharts.vue

@@ -131,7 +131,7 @@
                         :action="baseUrl+'api/Preaccept/up_img_mainImage'"
                         :show-file-list="false"
                         name="mainImage"
-                        accept=".jpg,.jpeg,.png"
+                        accept=".jpg,.jpeg,.png,.tif"
                         :on-success="handleAvatarSuccess"
                         :on-error="handleAvatarError"
                         :before-upload="beforeAvatarUpload"
@@ -174,7 +174,7 @@
                         @updateChange="(res) => updateChange(res, 'title')"
                         :value="lineStyle.title"
                         class="paste-area text-container"
-                        toolbar="bold italic subscript superscript clearButton"
+                        toolbar="bold italic  subscript superscript clearButton"
                         height="120"
                     ></tinymce>
                 </el-form-item>
@@ -262,7 +262,7 @@
                         @getContent="getContent"
                         :value="currentContent.content"
                         class="paste-area text-container"
-                        toolbar="bold italic subscript superscript clearButton"
+                        toolbar="bold italic forecolor subscript superscript clearButton"
                         style=""
                     ></tinymce>
                 </el-form-item>
@@ -392,19 +392,19 @@ export default {
     computed: {
         combinedValue() {
             // 将两个值组合成一个新的值，可以是字符串、数组、对象等
-            return `${this.isFirstComponentLoaded}-${this.isWordComponentLoaded}`;
+            // return `${this.isFirstComponentLoaded}-${this.isWordComponentLoaded}`;
         }
     },
     watch: {
         // 监听计算属性
-        combinedValue(newVal, oldVal) {
+        // combinedValue(newVal, oldVal) {
-            console.log('value1 或 value2 发生变化');
+        //     console.log('value1 或 value2 发生变化');
-            console.log('新值:', newVal);
+        //     console.log('新值:', newVal);
-            console.log('旧值:', oldVal);
+        //     console.log('旧值:', oldVal);
 
-            // 处理任意一个值变化的逻辑
+        //     // 处理任意一个值变化的逻辑
-            this.updateWordTiffImage(newVal);
+        //     this.updateWordTiffImage(newVal);
-        }
+        // }
     },
 
     directives: {
@@ -431,23 +431,23 @@ export default {
             this.isWordComponentLoaded = true;
         },
         // 监听第一个兄弟组件加载完毕
-        onFirstComponentLoaded(imagesList) {
+        // onFirstComponentLoaded(imagesList) {
-            this.imagesList = [...imagesList];
+        //     this.imagesList = [...imagesList];
-            this.isFirstComponentLoaded = true;
+        //     this.isFirstComponentLoaded = true;
-        },
+        // },
-        updateWordTiffImage(data) {
+        // updateWordTiffImage(data) {
-            console.log('updateWordTiffImage at line 423:', data);
+        //     console.log('updateWordTiffImage at line 423:', data);
 
-            if (this.isFirstComponentLoaded && this.isWordComponentLoaded) {
+        //     if (this.isFirstComponentLoaded && this.isWordComponentLoaded) {
-                this.imagesList.forEach((e) => {
+        //         this.imagesList.forEach((e) => {
-                    if (e.dataUrl) {
+        //             if (e.dataUrl) {
-                        this.$nextTick(() => {
+        //                 this.$nextTick(() => {
-                            this.$refs.commonWord.replacePlaceholderImage(e.ami_id, e.dataUrl);
+        //                     this.$refs.commonWord.replacePlaceholderImage(e.ami_id, e.dataUrl);
-                        });
+        //                 });
-                    }
+        //             }
-                });
+        //         });
-            }
+        //     }
-        },
+        // },
         handleSaveContent() {
             this.$refs.tinymceChild.getContent('content');
         },
@@ -937,8 +937,8 @@ export default {
         },
         // 获取数据
         async getDate() {
-            this.isFirstComponentLoaded = false;
+            // this.isFirstComponentLoaded = false;
-            this.isWordComponentLoaded = false;
+            // this.isWordComponentLoaded = false;
             this.imagesList = [];
             let urlLInk = '';
             let urlTask = {};
@@ -1277,7 +1277,7 @@ export default {
             //     this.$message.error('Picture size cannot exceed 10M!');
             // }
             // return isLt2M;
-            const isValidFormat = ['image/jpeg', 'image/png'].includes(file.type);
+            const isValidFormat = ['image/jpeg', 'image/png', 'image/tiff'].includes(file.type);
             if (!isValidFormat) {
                 this.$message.error(this.$t('commonTable.uploadImageInfo'));
             }

src/components/page/articleDetailEditor.vue

@@ -467,7 +467,7 @@
             :visible.sync="drawer"
             direction="rtl"
             :before-close="handleClose"
-            size="1200px"
+            size="1000px"
         >
             <template #title>
                 <div style="display: inline-block; vertical-align: top">
@@ -494,7 +494,7 @@
                 </div>
             </template>
             <iframe
-                :src="`https://view.officeapps.live.com/op/embed.aspx?src=${previewData.previewUrl}`"
+                :src="`https://view.officeapps.live.com/op/view.aspx?src=${previewData.previewUrl}&ui=en-US`"
                 width="100%"
                 height="98%"
                 frameborder="0"
@@ -797,6 +797,7 @@ export default {
                 });
         },
         openDrawer(data, url) {
+        console.log('url at line 799:',data, url)
             this.previewData = {
                 ...data,
                 previewUrl: url,

src/components/page/articleListEditor_B1.vue

@@ -2058,13 +2058,13 @@
 			// 6----校对文章
 			htmlContet() {
 				this.$api
-					.post('api/Production/getProductionMains', {
+					.post('api/Preaccept/getArticleMains', {
-						p_article_id: this.p_article_id
+						article_id: this.detailMes.article_id
 					})
 					.then(res => {
 						if (res.code == 0) {
 							this.$router.push({
-								path: 'comArtHtmlCreat',
+								path: 'comArtHtmlCreatNew',
 								query: {
 									id: this.p_article_id
 								}

src/components/page/comArtHtmlCreatNew.vue

@@ -0,0 +1,287 @@
+<template>
+    <div style="height: 98%;">
+        <div class="crumbs">
+            <el-breadcrumb separator="/">
+                <el-breadcrumb-item> <i class="el-icon-document-copy"></i> Artcile Html </el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <div class="container" style="height: 97%; min-width: 1000px; background-color: #fafafa; padding: 10px 0 0 0">
+          
+
+            <common-word
+            :readonly="true"
+                v-if="htmlContent"
+                ref="commonWord"
+                :value="htmlContent"
+                :wordStyle="wordStyle"
+                style="width: calc(100%); height: calc(100%); "
+                :style="`100%`"
+            ></common-word>
+        </div>
+    </div>
+</template>
+
+<script>
+import { mediaUrl } from '@/common/js/commonJS.js'; // 引入通用逻辑
+export default {
+    data() {
+        return {
+            wordStyle: `
+            p {
+            position: relative;
+            padding: 8px 15px;
+            min-height: 22px;
+            border: 2px dashed #fff;
+            border-radius: 5px;
+            color: #606266;
+            }
+            p {
+            font-size: 14px;
+            line-height: 22px;
+            }
+
+            .imgBox .chNumer {
+            position: absolute;
+            top: -2px;
+            right: -1px;
+            border-radius: 3px;
+            font-size: 10px;
+            background-color: rgb(0 102 153 / 85%);
+            color: #fff;
+            padding: 0 6px;
+            }
+
+            .MaxPicture {
+            text-align: center;
+            }
+
+            .MaxPicture > img {
+            margin-bottom: 10px;
+            }
+
+            .font {
+            display: block;
+            margin: 0 auto;
+            font-size: 13px;
+            }
+            .tableTitle{
+                text-align:center!important;
+                font-weight: bold;
+            }
+            `,
+            detailMes: {},
+            baseUrl: this.Common.baseUrl,
+            mediaUrl: mediaUrl, //
+            Art_Id: this.$route.query.id,
+            Art_Doi: this.$route.query.doi,
+            Art_web_Id: this.$route.query.artID,
+            Art_P_Id: '',
+            btnDisble: true,
+            detailTitle: '',
+            htmlContent: '',
+            Main_List: [],
+            exegesis: "The following contents'<b></b>,<i></i>'are necessary for the generation phase, please do not delete them!!!"
+        };
+    },
+
+    created() {
+        this.getInfo();
+    },
+    activated() {
+        this.getInfo();
+    },
+    methods: {
+        async getInfo() {
+            const loading = this.$loading({
+                lock: true,
+                text: 'Loading...',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.7)'
+            });
+            // 获取文章信息
+            await this.$api
+                .post('api/Production/getProductionDetail', { p_article_id: this.Art_Id })
+                .then(async (res) => {
+                    if (res.code == 0) {
+                        this.detailTitle = res.data.production.title
+                        this.detailMes = res.data.production;
+                        await this.getDate(loading);
+
+                        loading.close();
+                    } else {
+                        this.$message.error(res.msg);
+                        loading.close();
+                    }
+                })
+                .catch((err) => {
+                    this.$message.error(err);
+                    loading.close();
+                });
+        },
+        getWord() {
+            var htmlContent = `<h3 class="man_Title"  contenteditable="false">${this.detailTitle} </h3>`;
+            htmlContent += this.Main_List.map((item) => {
+                //批注
+                let contentHtml = '';
+                var isRemark = ``;
+                // if (item.state == 2 && item.remark && item.remark != '') {
+                //     // isRemark = `<img class="isRemark" main-id="${item.am_id}"  src="${this.remarkImageUrl}" alt="" style="width:20px;height:20px;"/>`;
+                //     isRemark = `<span class="isRemark"  main-id="${item.am_id}"><img  class="isRemarkIcon"  main-id="${item.am_id}" src="${this.remarkImageUrl}" alt="" style="width: 20px; height: 20px" />
+                       
+                //          <span class="isRemarkIcon"  main-id="${item.am_id}" > (${item.am_id})</span>
+                // </span>
+                    
+                // `;
+                // }
+                // 判断是否是图片
+                if (item.type == 1) {
+                   
+
+                    var extension = item.image.url.split('.').pop().toLowerCase();
+                    if (extension == 'tif') {
+                        contentHtml = `
+                        <p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${item.ami_id}" main-id="${
+                            item.am_id
+                        }">
+            <img src="" data-img-id="${item.ami_id}" style="width: ${item.width ? `${item.width}px` : '100%'}" />
+            <font class="font" style="width: ${item.width ? `${item.width}px` : '100%'}">${item.image.note ? item.image.note : ''}</font>
+        </p>
+                            `;
+                    } else if (['jpg', 'jpeg', 'png'].includes(extension)) {
+                        contentHtml = `
+                                <p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${
+                            item.ami_id
+                        }" main-id="${item.am_id}">
+                                    ${isRemark}
+                                    <img src="${this.mediaUrl + item.image.url}" style="width: ${
+                            item.width ? `${item.width}px` : '100%'
+                        }"  />
+                                   <font  class="font" style="width: ${item.width ? `${item.width}px` : '100%'}" >${
+                            item.image.note ? item.image.note : ''
+                        }</font>
+                                </p>
+                            `;
+                    } else {
+                        contentHtml = `
+                                <p contenteditable="false" main-state="${item.state}" class="MaxPicture pMain" data-id="${
+                            item.ami_id
+                        }" main-id="${item.am_id}">
+                                   ${isRemark}
+                                    <span
+                                            style="
+                                                text-align: center;
+                                                font-size: 30px;
+                                                display: flex;
+                                                align-items: center;
+                                                justify-content: center;
+                                            "
+                                        >
+                                        Figures ( .${item.image.url.split('.').pop().toUpperCase()})
+                                              </span>
+
+                                   <font  class="font" style="width: ${item.width ? `${item.width}px` : '100%'}" >${
+                            item.image.note ? item.image.note : ''
+                        }</font>
+                                </p>
+                            `;
+                    }
+                } else if (item.type == 2) {
+                    var tableList = JSON.parse(item.table.table_data);
+
+                    contentHtml = `
+    <div contenteditable="false" data-id="${item.amt_id}" main-state="${item.state}" main-id="${
+                        item.am_id
+                    }" class="thumbnailTableBox wordTableHtml table_Box pMain" style="width: 100%; padding: 8px 15px; box-sizing: border-box; border-radius: 4px; position: relative;">
+        ${isRemark}
+        <font  class="font tableTitle" style="width:100%" >${item.table.title ? item.table.title : ''}</font>
+                    <table border="1" style="width: auto; border-collapse: collapse; text-align: center; ">
+            ${tableList
+                .map((row) => {
+                    return `
+                    <tr>
+                        ${row
+                            .map((cell) => {
+                                return `
+                                <td colspan="${cell.colspan || 1}" rowspan="${cell.rowspan || 1}">
+                                    <span>${cell.text || ''}</span>
+                                </td>
+                            `;
+                            })
+                            .join('')} <!-- join the cells in the row -->
+                    </tr>
+                `;
+                })
+                .join('')} <!-- join the rows -->
+        </table>
+        <font  class="font" style="width:100%" >${item.table.note ? item.table.note : ''}</font>
+    </div>
+`;
+                } else {
+                    contentHtml = `<p class="pMain" main-state="${item.state}" contenteditable="false" data-id="${item.am_id}" main-id="${item.am_id}">${isRemark}${item.content}</p>`;
+                }
+
+                // 判断是否是表格类型
+
+                return contentHtml;
+            }).join('');
+            this.htmlContent = htmlContent;
+        },
+        async getDate(loading) {
+            let urlLInk = '';
+            let urlTask = {};
+            if (this.Art_Id != undefined) {
+                urlLInk = 'api/Preaccept/getArticleMains';
+                urlTask.article_id = this.detailMes.article_id;
+            }
+
+            // 获取文章信息
+            await this.$api
+                .post(urlLInk, urlTask)
+                .then(async (res) => {
+                    if (res.code == 0) {
+                        this.Main_List = res.data.list;
+                        // this.detailTitle = res.data.production.title
+                        for (let i = 0; i < this.Main_List.length; i++) {
+                            this.Main_List[i].text = this.Main_List[i].content;
+                            this.Main_List[i].getnum = 0;
+                        }
+
+                        // setTimeout(async () => {
+                        this.$nextTick(async () => {
+                            await this.getWord();
+                            loading.close();
+                        });
+                        loading.close();
+                    } else {
+                        this.$message.error(res.msg);
+                        loading.close();
+                    }
+                })
+                .catch((err) => {
+                    this.$message.error(err);
+                    loading.close();
+                });
+        }
+    }
+};
+</script>
+
+<style scoped>
+.man_Title {
+    background-color: #fff;
+    margin: 0 0 10px 0;
+    border-bottom: 1px solid #dde1eb;
+    box-shadow: 0 5px 5px -2px rgb(134 134 134);
+    padding: 12px 25px 8px 25px;
+    font-size: 16px;
+    line-height: 24px;
+    color: #333;
+    position: relative;
+}
+
+.man_Title button {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+}
+</style>

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

@@ -79,7 +79,7 @@ const tableStyle = ` b span{
                         table tr td p{
 
                            text-align:left !important;
-                            
+
                             margin:0;
                             font-family:'Charis SIL' !important;
                             font-size: 7.5000pt !important;
@@ -273,15 +273,18 @@ export default {
                 height: this.height,
                 paste_preprocess: function (plugin, args) {
                     let content = args.content;
-                    // 阻止默认的粘贴行为
+
-                    if (args.event) {
+                    // 创建一个临时 div 元素来解析粘贴的 HTML
-                        args.event.preventDefault(); // 阻止默认的粘贴处理
+                    let tempDiv = document.createElement('div');
-                        args.event.stopPropagation(); // 阻止事件冒泡，确保自定义处理优先执行
+                    tempDiv.innerHTML = content;
-                    }
+
-                    if (_this.type == 'table') {
+                    // 检查粘贴的内容是否包含 <table> 元素
-                        _this.$commonJS.parseTableToArray(content, (tableList) => {
+                    if (tempDiv.querySelector('table')) {
-                            console.log('res at line 104:', tableList);
+                        console.log('粘贴的内容包含表格');
-                            var contentHtml = `
+                        if (_this.type == 'table') {
+                            _this.$commonJS.parseTableToArray(content, (tableList) => {
+                                console.log('res at line 104:', tableList);
+                                var contentHtml = `
                             <div class="thumbnailTableBox wordTableHtml table_Box" style="">
                                 <table border="1" style="width: auto; border-collapse: collapse; text-align: center;">
                                     ${tableList
@@ -296,7 +299,7 @@ export default {
                                                         </td>
                                                     `;
                                                     })
-                                                    .join('')} 
+                                                    .join('')}
                                             </tr>
                                         `;
                                         })
@@ -305,18 +308,30 @@ export default {
                             </div>
                             `;
 
-                            const container = document.createElement('div');
+                                const container = document.createElement('div');
-                            container.innerHTML = contentHtml;
+                                container.innerHTML = contentHtml;
 
-                            // _this.updateTableStyles(container); // 根据需要应用额外的样式
+                                // _this.updateTableStyles(container); // 根据需要应用额外的样式
-                            args.content = container.innerHTML; // 更新处理后的内容
+                                args.content = container.innerHTML; // 更新处理后的内容
-                        });
+                            });
-                    } else if (_this.isAutomaticUpdate) {
+                        }
-                        args.content = _this.$commonJS.transformHtmlString(args.content); // 更新处理后的内容
+                    } else {
+                        if (_this.isAutomaticUpdate) {
+                            args.content = _this.$commonJS.transformHtmlString(args.content); // 更新处理后的内容
+                        }
+                        console.log('粘贴的内容不包含表格');
+                    }
+                    // 阻止默认的粘贴行为
+                    if (args.event) {
+                        args.event.preventDefault(); // 阻止默认的粘贴处理
+                        args.event.stopPropagation(); // 阻止事件冒泡，确保自定义处理优先执行
                     }
                 },
 
-                content_style: `${tableStyle}`,
+                content_style: `${tableStyle} table span blue {
+                        color: rgb(0, 130, 170) !important;
+                    }`,
+
                 formats: {
                     bold: { inline: 'b' },
                     italic: { inline: 'i' }
@@ -332,7 +347,6 @@ export default {
                 end_container_on_empty_block: true,
                 content_css: 'default', // 加载 TinyMCE 默认样式表
                 //设置自定义按钮 myCustomToolbarButton
-
                 setup(ed) {
                     ed.ui.registry.addButton('uploadWord', {
                         text: 'Word',
@@ -481,7 +495,6 @@ export default {
                 var tableHtml = `<html xmlns:w="urn:schemas-microsoft-com:office:word">
                                     <head>
                                         <style>
-
                                         ${tableStyle}
                                         </style>
                                     </head>

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

@@ -123,6 +123,12 @@ export default {
         id: {
             type: String
         },
+        readonly: {
+            type: Boolean,
+            default() {
+                return false;
+            }
+        },
         value: {
             type: String,
             default: ''
@@ -380,7 +386,8 @@ export default {
                 content_css: 'default',
 
                 setup(ed) {
-                    ed.on('click', function (e) {
+                    if(!_this.readonly){
+ed.on('click', function (e) {
                         // 判断点击的是否是目标元素
                         const target = e.target;
                         console.log('target at line 351:', target);
@@ -422,7 +429,6 @@ export default {
                         }
                     });
                     // 监听焦点变化并高亮当前选中的元素
-
                     ed.on('selectionChange', function () {
                         _this.updateCurrentTag(ed);
                     });
@@ -430,8 +436,7 @@ export default {
                     ed.on('mouseup', function () {
                         _this.updateCurrentTag(ed);
                     });
-
+  ed.on('blur', function () {
-                    ed.on('blur', function () {
                         console.log('_this.lastPTag at line 367:', _this.lastTag);
                         if (_this.lastTag) {
                             _this.lastTag.style.backgroundColor = ''; // 清除之前的高亮
@@ -619,11 +624,6 @@ export default {
                         // 将容器添加到页面中
                         document.body.appendChild(wordButtonContainer);
                     }
-
-                    // 获取 TinyMCE iframe 内部的 document 对象
-
-                    // 监听 TinyMCE iframe 内容区域的滚动事件
-
                     ed.on('mousedown', function (e) {
                         // 检查点击的位置是否是删除按钮或选中的 <p> 标签
                         if (!currentParagraph || (e.target !== wordButtonContainer && !currentParagraph.contains(e.target))) {
@@ -633,6 +633,9 @@ export default {
                             }
                         }
                     });
+                    }
+                    
+                  
                 },
 
                 init_instance_callback: (editor) => {

src/components/page/components/table/wordHtml.vue

@@ -36,17 +36,13 @@
                                         >Figure {{ index + 1 }}
                                         <span
                                             @click="openPreview(index, 'img')"
-                                            v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())"
+                                            
                                         >
                                             <!-- <el-tooltip class="item" effect="dark" :content="$t('commonTable.preview')" placement="top"> -->
                                             <i class="el-icon-view" style="font-size: 16px"></i>
                                             <!-- </el-tooltip> -->
                                         </span>
-                                        <a :href="mediaUrl + img.image.url" style="color: #000" v-else>
+                                        
-                                            <!-- <el-tooltip class="item" effect="dark" :content="$t('commonTable.preview')" placement="top"> -->
-                                            <i class="el-icon-download" style="font-size: 16px"></i>
-                                            <!-- </el-tooltip>  -->
-                                        </a>
                                     </span>
                                    
                                 </div>
@@ -85,38 +81,14 @@
                                 >
                                     <div style="width: 100%; height: 80px; display: flex; justify-content: center; align-items: center">
                                         <!-- 图片内容 -->
-                                        <template v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())">
+                                        <!-- <template v-if="['jpg', 'jpeg', 'png'].includes(img.image.split('.').pop().toLowerCase())"> -->
                                             <img
                                                 :data-img-id="img.article_image_id"
                                                 :src="mediaUrl + img.image"
                                                 style="width: 140px; height: 100%; object-fit: cover"
                                             />
-                                        </template>
+                                        <!-- </template> -->
-                                        <template v-else-if="img.image.split('.').pop().toLowerCase() === 'tif'">
+                                      
-                                            <img
-                                                :data-img-id="img.article_image_id"
-                                                :src="img.dataUrl"
-                                                style="width: 140px; height: 100%; object-fit: cover"
-                                            />
-                                        </template>
-                                        <template v-else>
-                                           
-                                            <div
-                                                style="
-                                                    width: 140px;
-                                                    height: 100%;
-                                                    text-align: center;
-                                                    font-size: 30px;
-                                                    display: flex;
-                                                    align-items: center;
-                                                    justify-content: center;
-                                                "
-                                            >
-                                                {{ img.image.split('.').pop().toUpperCase() }}
-                                                <!-- <i class="el-icon-download" style="margin-left: 10px; color: #75abf1"></i> -->
-                                            </div>
-                                            <!-- </a> -->
-                                        </template>
                                     </div>
                                     <!-- 输入框 -->
                                 </div>
@@ -466,42 +438,47 @@ export default {
                         list = list.map((e) => {
                             return {
                                 ...e,
-                                image: e.url,
+                                image: e.jpg_url?e.jpg_url:e.url,
                                 article_image_id: e.ami_id
                             };
                         });
                     } else {
-                        list = res.data.list;
+                        list = list.map((e) => {
+                            return {
+                                ...e,
+                                image: e.jpg_url?e.jpg_url:e.image,
+                            };
+                        });
+                      
                     }
 
                     if (list.length > 0) {
                         list.forEach((img, index) => {
-                            var extension = img.image.split('.').pop().toLowerCase();
+                            // var extension = img.image.split('.').pop().toLowerCase();
-                            if (extension === 'tif' || extension === 'jpg' || extension === 'jpeg' || extension === 'png') {
+                            // if (extension === 'tif' || extension === 'jpg' || extension === 'jpeg' || extension === 'png') {
-                                const modalContent = ['jpg', 'jpeg', 'png'].includes(extension)
+                                const modalContent = `<img  src="${this.mediaUrl + img.image}" alt="Image ${index}" style="width:100%;background:#FFF;" >`;
-                                    ? `<img  src="${this.mediaUrl + img.image}" alt="Image ${index}" style="width:100%;background:#FFF;" >`
+                                console.log('modalContent at line 487:', modalContent)
-                                    : `<canvas id="tiff-canvas-modal-${index}" ></canvas>`;
 
                                 this.$commonJS.createImageModal(index, modalContent, 'img');
-                            }
+                            // }
 
-                            if (extension === 'tif') {
+                            // if (extension === 'tif') {
-                                this.$nextTick(() => {
+                            //     this.$nextTick(() => {
-                                    this.$commonJS.renderTiffImage(
+                            //         this.$commonJS.renderTiffImage(
-                                        this.mediaUrl + img.image,
+                            //             this.mediaUrl + img.image,
-                                        `tiff-canvas-modal-${index}`,
+                            //             `tiff-canvas-modal-${index}`,
-                                        function (url) {
+                            //             function (url) {
-                                            list[index].dataUrl = url;
+                            //                 list[index].dataUrl = url;
-                                        },
+                            //             },
-                                        index,
+                            //             index,
-                                        true
+                            //             true
-                                    );
+                            //         );
-                                });
+                            //     });
-                            }
+                            // }
                         });
                     }
                     this.images = list;
-                    this.$emit('loaded');
+                    // this.$emit('loaded');
                 });
         },
         async getWordTablesList(callback) {

src/components/page/components/table/wordHtmlTypesetting.vue

@@ -86,8 +86,8 @@
 
                                 <!-- 当 isEditing 为 false 时，显示评论文本 -->
                                 <div  style="display: flex; align-items: center; justify-content: space-between">
-                                    <p  style="min-height: 20px; width: calc(100%);white-space: normal;">
+                                    <p  style="min-height: 20px; width: calc(100%);white-space: normal;" v-html="comment.remark">
-                                        {{ comment.remark }}
+                                    
                                         <!-- <span @click="editComment(index)" style="cursor: pointer; color: #007bff; margin-left: 10px;">修改</span> -->
                                     </p>
 
@@ -602,7 +602,7 @@ export default {
                 }
                 this.$forceUpdate();
                 this.isFresh = true;
-                this.$emit('loaded', this.images);
+                // this.$emit('loaded', loadedthis.images);
             });
         },
         changeDataIsHidden(val, status, type) {
@@ -678,27 +678,13 @@ export default {
                     if (list.length > 0) {
                         list.forEach((img, index) => {
                             var extension = img.image.split('.').pop().toLowerCase();
-                            if (extension === 'tif' || extension === 'jpg' || extension === 'jpeg' || extension === 'png') {
+                            // if (extension === 'tif' || extension === 'jpg' || extension === 'jpeg' || extension === 'png') {
-                                const modalContent = ['jpg', 'jpeg', 'png'].includes(extension)
+                                const modalContent = `<img src="${this.mediaUrl + img.image}" alt="Image ${index}" style="width:100%;" >`;
-                                    ? `<img src="${this.mediaUrl + img.image}" alt="Image ${index}" style="width:100%;" >`
-                                    : `<canvas id="tiff-canvas-modal-${index}" ></canvas>`;
 
                                 this.$commonJS.createImageModal(index, modalContent, 'img');
-                            }
+                            // }
 
-                            if (extension === 'tif') {
+                         
-                                this.$nextTick(() => {
-                                    this.$commonJS.renderTiffImage(
-                                        this.mediaUrl + img.image,
-                                        `tiff-canvas-modal-${index}`,
-                                        function (url) {
-                                            list[index].dataUrl = url;
-                                        },
-                                        index,
-                                        true
-                                    );
-                                });
-                            }
                         });
                     }
                     this.images = list;

src/router/index.js

@@ -173,6 +173,13 @@ export default new Router({
 				title: 'Artcile Html'
 			}
 		},
+		{
+			path: 'comArtHtmlCreatNew',
+			component: () => import('../components/page/comArtHtmlCreatNew.vue'),
+			meta: {
+				title: 'Artcile Html'
+			}
+		},
 		{
 			path: 'comArtHtmlEdit',
 			component: () => import('../components/page/comArtHtmlEdit.vue'),