tijiao

src/components/page/GenerateCharts.vue

@@ -1,34 +1,41 @@
 <template>
     <div style="height: 100%">
-        <div
+        <el-row style="margin-top: 0%; height: 100%">
-            class="container"
+            <div style="display: flex; align-items: center; height: 100%">
-            style="
+                <!-- 左侧 列表 -->
-                height: 100%;
-                min-width: calc(1000px);
-                width: calc(100%);
-                background-color: #fafafa;
-                padding: 0px 0 0 0;
-                box-sizing: border-box;
-                position: relative;
-                box-sizing: border-box;
-            "
-        >
-            <div
-                class="right-side"
-                style="
-                    width: 285px;
-                    float: left;
-                    height: 100%;
-                    background-color: #fff;
-                    box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
-                    border-radius: 4px;
-                    overflow-y: auto;
-                "
-            >
-                <!-- <p style="padding: 10px 10px; box-sizing: border-box; font-weight: bold"> -->
 
-                <!-- <b class="MaxBtn" style="right: 80px; top: 5px; padding: 0"><common-drag-word @tables="getTables"></common-drag-word></b> -->
+                <!-- 右侧 用户列表 -->
-                <!-- <b class="MaxBtn" @click="MTxtPic()" style="background-color: #13bc20; right: 40px; top: 5px">
+                <div :class="[drawer ? 'right' : 'right1']" style="height: 100%">
+                    <div
+                        class="container"
+                        style="
+                            height: 100%;
+                            min-width: calc(1000px);
+                            width: calc(100%);
+                            background-color: #fafafa;
+                            padding: 0px 0 0 0;
+                            box-sizing: border-box;
+                            position: relative;
+                            box-sizing: border-box;
+                        "
+                    >
+                        <div
+                            v-show="!drawer"
+                            class="right-side"
+                            style="
+                                width: 285px;
+                                float: left;
+                                height: 100%;
+                                background-color: #fff;
+                                box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
+                                border-radius: 4px;
+                                overflow-y: auto;
+                            "
+                        >
+                            <!-- <p style="padding: 10px 10px; box-sizing: border-box; font-weight: bold"> -->
+
+                            <!-- <b class="MaxBtn" style="right: 80px; top: 5px; padding: 0"><common-drag-word @tables="getTables"></common-drag-word></b> -->
+                            <!-- <b class="MaxBtn" @click="MTxtPic()" style="background-color: #13bc20; right: 40px; top: 5px">
                   <svg
                       t="1684978324047"
                       class="icon"
@@ -48,35 +55,39 @@
               ><b class="MaxBtn" @click="MTxtTable()" style="background-color: #e07404; right: 0px; top: 5px">
                   <i class="el-icon-document-add"></i>
               </b> -->
-                <!-- </p> -->
+                            <!-- </p> -->
 
-                <div class="unfetteredBox" style="height: 100%">
+                            <div class="unfetteredBox" style="height: 100%">
-                    <common-word-html-type-setting
+                                <common-word-html-type-setting
-                        :urlList="{
+                                    :urlList="{
-                            img: 'api/Preaccept/getMainImages',
+                                        img: 'api/Preaccept/getMainImages',
-                            table: 'api/Preaccept/getMainTables'
+                                        table: 'api/Preaccept/getMainTables'
-                        }"
+                                    }"
-                        :articleId="articleId"
+                                    :articleId="articleId"
-                        :content="ManuscirptContent"
+                                    :content="ManuscirptContent"
-                        ref="commonWordHtmlTypeSetting"
+                                    ref="commonWordHtmlTypeSetting"
-                        @onDragStart="onDragStart"
+                                    @onDragStart="onDragStart"
-                        @huifu="huifu"
+                                    @huifu="huifu"
-                        @onAddComment="onAddComment"
+                                    @onAddComment="onAddComment"
-                        @addImage="handleImageAdd"
+                                    @addImage="handleImageAdd"
-                        @addTable="handleTableAdd"
+                                    @addTable="handleTableAdd"
-                        @handlePaperclip="handlePaperclip"
+                                    @handlePaperclip="handlePaperclip"
-                        @addComment="addCommentSetting"
+                                    @addComment="addCommentSetting"
-                        @goToComment="goToComment"
+                                    @goToComment="goToComment"
-                        @edit="handleImageEdit"
+                                    @edit="handleImageEdit"
-                        @goToListComment="goToListComment"
+                                    @goToListComment="goToListComment"
-                        style="width: 100%; height: 100%; padding: 0 0px; box-sizing: border-box; background-color: #fff"
+                                    style="width: 100%; height: 100%; padding: 0 0px; box-sizing: border-box; background-color: #fff"
-                    >
+                                >
-                    </common-word-html-type-setting>
+                                </common-word-html-type-setting>
-                    <input type="file" ref="fileInput" style="display: none" @change="handleFileChange" />
+                                <input type="file" ref="fileInput" style="display: none" @change="handleFileChange" />
-                </div>
+                            </div>
-            </div>
+                        </div>
-            <div style="width: 100%; width: calc(100% - 285px); float: right; height: calc(100% - 0px); background-color: #e4e9ed">
+                        <div
-                <!-- <div class="toolbar">
+                            :style="`width: ${
+                                drawer ? '100%' : '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" />
                       <span>Add Figure </span>
@@ -87,42 +98,109 @@
                   </div>
               </div> -->
 
-                <common-word
+                            <common-word
-                    :key="new Date().getTime()"
+                                :key="new Date().getTime()"
-                    v-if="htmlContent"
+                                v-if="htmlContent"
-                    ref="commonWord"
+                                ref="commonWord"
-                    :value="htmlContent"
+                                :value="htmlContent"
-                    :contentList="Main_List"
+                                :contentList="Main_List"
-                    :comments="comments"
+                                :comments="comments"
-                    :wordStyle="wordStyle"
+                                :drawer="drawer"
-                    @onDrop="onDrop"
+                                :wordStyle="wordStyle"
-                    @saveContent="saveContent"
+                                @onDrop="onDrop"
-                    @editComment="editComment"
+                                @saveContent="saveContent"
-                    @loaded="loadedWord"
+                                @editComment="editComment"
-                    @onEdit="onEdit"
+                                @loaded="loadedWord"
-                    @addContent="onAddContent"
+                                @onEdit="onEdit"
-                    @changeSort="changeSort"
+                                @addContent="onAddContent"
-                    @onDelete="onDelete"
+                                @changeSort="changeSort"
-                    @onDeletes="onDeletes"
+                                @onDelete="onDelete"
-                    @refresh="onRefresh"
+                                @onDeletes="onDeletes"
-                    @onComment="onComment"
+                                @refresh="onRefresh"
-                    @onAddComment="onAddComment"
+                                @onComment="onComment"
-                    @solveComment="solveComment"
+                                @onAddComment="onAddComment"
-                    @cancelSolveComment="cancelSolveComment"
+                                @solveComment="solveComment"
-                    @replyComment="replyComment"
+                                @cancelSolveComment="cancelSolveComment"
-                    @deleteComment="deleteComment"
+                                @replyComment="replyComment"
-                    @onEditTitle="onEditTitle"
+                                @deleteComment="deleteComment"
-                    @onAddRow="onAddRow"
+                                @onEditTitle="onEditTitle"
-                    @changeComment="changeComment"
+                                @onAddRow="onAddRow"
-                    style="width: calc(100%); height: calc(100%)"
+                                @changeComment="changeComment"
-                    :style="`100%`"
+                                style="width: calc(100%); height: calc(100%)"
-                >
+                                :style="`100%`"
-                    <template slot="comment">
+                            >
-                        <div style="" class="commentList annotations"></div>
+                                <template slot="comment">
-                    </template>
+                                    <div style="" class="commentList annotations"></div>
-                </common-word>
+                                </template>
+                            </common-word>
+                        </div>
+                    </div>
+                </div>
+                <div :class="[drawer ? 'left' : 'left1']" style="height: 100%">
+                    <div>
+                        <div
+                            style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box"
+                            v-if="currentContent && currentContent.type == 1"
+                        >
+                            Image
+                        </div>
+                        <div
+                            style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box"
+                            v-if="currentContent && currentContent.type == 2"
+                        >
+                            Table
+                        </div>
+                        <div
+                            style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box"
+                            v-if="currentContent && currentContent.type == 0"
+                        >
+                            Content
+                        </div>
+                        <div style="padding: 20px 10px; box-sizing: border-box">
+                            <common-content
+                                v-show="currentContent && currentContent.type == 0"
+                                :value="currentContent ? currentContent.content : ''"
+                                @getContent="getContent"
+                                @openLatexEditor="openLatexEditor"
+                                ref="commonContent1"
+                                height="78vh"
+                            ></common-content>
+                       
+                            <common-table
+                                v-show="currentContent && currentContent.type == 2"
+                                @getContent="getContent"
+                                height="78vh"
+                                ref="commonTable1"
+                                @openLatexEditor="openLatexEditor"
+                                :lineStyle="lineStyle"
+                            ></common-table>
+                        </div>
+
+                        <div style="float: right">
+                            <el-button @click="drawer = false"> Cancel </el-button>
+                            <el-button type="primary" @click="handleSaveContent" style="margin-right: 20px"> Save </el-button>
+                        </div>
+                    </div>
+                </div>
+                <!-- 折叠展开图片-->
+                <!-- <div
+        style="cursor: pointer; width: 5%;z-index: 9999;"
+        :class="[drawer ? 'imgright' : 'imgright1']"
+        @click="clickImg"
+      >
+        <img
+          v-show="!drawer"
+          style="height: 40px; width: 25px"
+          src=""
+        />
+        <img
+          v-show="drawer"
+          style="height: 40px; width: 25px"
+          src=""
+        />
+      </div> -->
             </div>
-        </div>
+        </el-row>
 
         <!--添加/修改图片 -->
         <el-dialog :title="picStyle.visiTitle" :visible.sync="pictVisible" width="1200px" :close-on-click-modal="false">
@@ -269,16 +347,22 @@
         >
             <div style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: start">
                 <div v-for="(item, i) in uploadWordTables" class="uploadWordTableBox">
-                    <el-button @click="addUploadWordTable(item)" size="mini"  class="insertTable"> 插入 </el-button>
+                    <el-button @click="addUploadWordTable(item)" size="mini" class="insertTable"> 插入 </el-button>
                     <div class="thumbnailTableBox wordTableHtml table_Box pMain myeditabledivTable drop-target">
-                        <p style="font-size: 12px;padding: 10px;box-sizing: border-box;">Table {{ i + 1 }}</p>
+                        <p style="font-size: 12px; padding: 10px; box-sizing: border-box">Table {{ i + 1 }}</p>
                         <table border="1" :style="`width: 800px;zoom:${zoomNum};border-collapse: collapse; text-align: center`">
                             <tr
                                 v-for="(row, i) in item.table_data"
                                 :key="i"
                                 :class="{ 'table-header-row': isHeaderRow(i, item.table_data) }"
                             >
-                                <td style="font-size: 20px;"v-for="(cell, i1) in row" :key="i1" :colspan="`${cell.colspan || 1}`" :rowspan="`${cell.rowspan || 1}`">
+                                <td
+                                    style="font-size: 20px"
+                                    v-for="(cell, i1) in row"
+                                    :key="i1"
+                                    :colspan="`${cell.colspan || 1}`"
+                                    :rowspan="`${cell.rowspan || 1}`"
+                                >
                                     <span v-html="cell.text"></span>
                                 </td>
                             </tr>
@@ -407,7 +491,8 @@ import bottomTinymce from '@/components/page/components/Tinymce';
 export default {
     data() {
         return {
-            zoomNum:(window.innerWidth * 0.38) / 850,
+            drawer: false,
+            zoomNum: (window.innerWidth * 0.38) / 850,
             uploadWordTables: [],
             tablesHtmlVisible: false,
             tablesHtml: '',
@@ -570,7 +655,9 @@ export default {
     },
 
     methods: {
-       
+        clickImg() {
+            this.drawer = !this.drawer;
+        },
         async copyArray(data) {
             try {
                 // 将数组内容转换为字符串，使用换行符分隔
@@ -585,7 +672,7 @@ export default {
             }
         },
         openLatexEditor(data) {
-                this.showLateX = true;
+            this.showLateX = true;
             this.LateXInfo = data;
         },
         isShowEditComment() {
@@ -621,7 +708,7 @@ export default {
         //     }
         // },
         handleSaveContent() {
-            this.$refs.commonContent.getTinymceContent('content');
+            this.$refs.commonContent1.getTinymceContent('content');
         },
         handleSaveAddContent() {
             this.$refs.addContent.getTinymceContent('addcontent');
@@ -1136,24 +1223,22 @@ export default {
             });
             // 处理文件上传并传递回调函数
             this.$commonJS.handleFileUpload(event, function (tables) {
-            	console.log('tables at line 1138:', tables)
+                console.log('tables at line 1138:', tables);
-                if(tables.length == 0){
+                if (tables.length == 0) {
-                    loading.close()
+                    loading.close();
                     that.$message({
                         type: 'warning',
                         message: 'No table found!'
-                    }); 
+                    });
-                    return false
+                    return false;
                 }
-              
+
                 // 使用 Promise.all 等待所有表格解析完成
                 Promise.all(
                     tables.map((table) => {
                         return new Promise((resolve, reject) => {
                             // 解析每个表格
                             that.$commonJS.parseTableToArray(table, (tableList) => {
-                               
-
                                 resolve({ table_data: tableList, html_data: '' });
                             });
                         });
@@ -1162,25 +1247,24 @@ export default {
                     .then((result) => {
                         // 所有表格的解析完成后，处理结果
                         that.uploadWordTables = result;
-                        loading.close()
+                        loading.close();
                         that.tablesHtmlVisible = true;
-                         })
+                    })
                     .catch((error) => {
-                        loading.close()
+                        loading.close();
                         console.error('Error processing tables:', error);
                     });
             });
             const file = event.target.files[0];
             if (file) {
                 // 处理文件逻辑
-                 }
+            }
 
             // 关键：重置 input 的值
             event.target.value = '';
         },
 
         async onAddRow(mainId) {
-          
             await this.$api
                 .post(this.urlList.addRow, {
                     am_id: mainId,
@@ -1289,7 +1373,7 @@ export default {
             this.currentId = null;
             this.clearButton();
             var data = this.Main_List.find((item) => item.am_id == dataId);
-            // console.log('data at line 667:', data);
+
             if (data.type == 1) {
                 var extension = data.image.url.split('.').pop().toLowerCase();
                 if (extension == 'tif') {
@@ -1315,14 +1399,22 @@ export default {
                     title: data.table.title
                 };
                 this.lineStyle.visiTitle = 'Edit Table';
-                this.threeVisible = true;
+                // this.threeVisible = true;
             } else {
                 data.content = data.content.replace(/<span[^>]*>/g, '').replace(/<\/span>/g, ''); // 去除span标签
                 this.currentContent = data;
 
-                this.editVisible = true;
+                // this.editVisible = true;
                 this.currentId = dataId;
             }
+            this.$nextTick(() => {
+                this.drawer = true;
+                if (this.currentContent.type == 0) {
+                    this.$refs.commonContent1.setValue();
+                } else if (this.currentContent.type == 2) {
+                    this.$refs.commonTable1.setValue();
+                }
+            });
         },
         onAddContent(dataId) {
             this.addContentVisible = true;
@@ -1534,6 +1626,7 @@ export default {
                 .post(urlLInk, urlTask)
                 .then(async (res) => {
                     if (res.code == 0) {
+                        this.drawer = false;
                         // res.data.list.forEach((data) => {
                         //     if (data.amt_id) {
                         //         try {
@@ -1737,7 +1830,7 @@ export default {
                 }
             };
             var cleanedTableList = content.table ? content.table : [];
-          
+
             cleanedTableList = cleanTableData(content.table);
             var strTitle = this.lineStyle1.title ? this.lineStyle1.title : '';
 
@@ -2204,10 +2297,10 @@ export default {
 ::v-deep .wordTableHtml table span blue {
     color: rgb(0, 130, 170) !important;
 }
-::v-deep .wordTableHtml table span blue sup{
+::v-deep .wordTableHtml table span blue sup {
     color: rgb(0, 130, 170) !important;
 }
-::v-deep .wordTableHtml table span blue sub{
+::v-deep .wordTableHtml table span blue sub {
     color: rgb(0, 130, 170) !important;
 }
 .toolbar {
@@ -2295,7 +2388,7 @@ export default {
     width: 38vw;
     position: relative;
     height: auto;
-overflow: hidden;
+    overflow: hidden;
     padding: 10px;
     box-sizing: border-box;
     box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px 0px;
@@ -2304,13 +2397,33 @@ overflow: hidden;
     margin-bottom: 0;
     padding: 15px;
 }
-.uploadWordTableBox .insertTable{
+.uploadWordTableBox .insertTable {
-   /* display: none; */
+    /* display: none; */
-   position: absolute;
+    position: absolute;
-   right: 10px;
+    right: 10px;
 }
 .uploadWordTableBox:hover {
     background-color: #0066990d;
-   /* display: block !important; */
+    /* display: block !important; */
+}
+.left {
+    width: 50vw;
+    background-color: #f5f5f5;
+    z-index: 10;
+
+    box-sizing: border-box;
+    /* transition: all 0.2s; */
+}
+.left1 {
+    width: 0%;
+    /* transition: all 0.2s; */
+}
+.right {
+    width: 50vw;
+    /* transition: all 0.2s; */
+}
+.right1 {
+    width: 100%;
+    /* transition: all 0.2s; */
 }
 </style>

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

@@ -692,6 +692,14 @@ export default {
         //设置内容
         setContent(value) {
             window.tinymce.get(this.tinymceId).setContent(value);
+            
+        },
+        setContent2(value) {
+            window.tinymce.get(this.tinymceId).setContent(value);
+            setTimeout(() => {
+                        window.renderMathJax(this.tinymceId);
+                    }, 10);
+            
         },
         //获取内容
         async getContent(type) {

src/components/page/components/table/WordListItem.vue

@@ -0,0 +1,200 @@
+<template>
+        <div >
+                    <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"
+                            src="@/assets/img/isRemark.png"
+                            alt=""
+                            style="width: 15px; height: 15px; margin-right: 6px; margin-left: -14px"
+                        />
+
+                        <span>{{ item.am_id }}</span>
+                    </span>
+                    <div
+                        :class="
+                            !isPreview
+                                ? item.is_h1
+                                    ? 'isTitleH1'
+                                    : item.is_h2
+                                    ? 'isTitleH2'
+                                    : item.is_h3
+                                    ? 'isTitleH3'
+                                    : ''
+                                : item.is_h1
+                                ? 'Ptitle'
+                                : ''
+                        "
+                        style="line-height: 24px"
+                    >
+                        <template v-if="!isPreview">
+                            <span class="Htitle Htitle1" v-if="item.is_h1 == 1">H1</span>
+                            <span class="Htitle Htitle2" v-else-if="item.is_h2 == 1">H2</span>
+                            <span class="Htitle Htitle3" v-else-if="item.is_h3 == 1">H3</span></template
+                        >
+
+                        <div :class="currentId == item.am_id ? 'glowing-border' : ''" style="position: relative">
+                            <div
+                                v-if="currentId == item.am_id"
+                                style="background-color: #fff; z-index: 100; position: absolute; right: 0px; top: -40px"
+                            >
+                                <!-- <el-button
+                                    v-if="currentId == item.am_id"
+                                    style="background-color: #006699d1; font-weight: bold; color: #fff; font-size: 16px !important"
+                                    :style="index == 0 ? ' opacity: 0.2;' : ' opacity: 1;'"
+                                    size="mini"
+                                    plain
+                                    :disabled="index != 0 ? false : true"
+                                    @click="changeSort('up')"
+                                    >↑</el-button
+                                >
+                                <el-button
+                                    v-if="currentId == item.am_id"
+                                    style="background-color: #006699d1; font-weight: bold; color: #fff; font-size: 16px !important"
+                                    size="mini"
+                                    :style="index == wordList.length - 1 ? ' opacity: 0.2;' : ' opacity: 1;'"
+                                    plain
+                                    :disabled="index == wordList.length - 1 ? true : false"
+                                    @click="changeSort('down')"
+                                    >↓</el-button
+                                > -->
+                            </div>
+
+                            <div
+                                @dblclick="dblclickEdit(item.am_id, 'img', item, index)"
+                                :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.stop="initializeEditor($event, 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"
+                                @contextmenu.prevent="openMenu($event, 'img', item.am_id, item, index)"
+                                :id="'editor' + item.am_id"
+                            >
+                                <img :src="`${mediaUrl + item.image.url}`" />
+
+                                <font class="font imageTitle" :style="`width: ${item.width ? `${item.width}px` : '100%'}`">
+                                    <span
+                                        v-html="item.image.title ? highlightText(item.image.title, item.checks ? item.checks : []) : ''"
+                                    ></span>
+                                </font>
+                                <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
+                                @dblclick="dblclickEdit(item.am_id, 'table', item, index)"
+                                id="drop-target"
+                                @dragover="handleDragOver"
+                                @dragenter="handleDragEnter"
+                                @dragleave="handleDragLeave"
+                                @drop="handleDrop"
+                                @click.stop="initializeEditor($event, 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"
+                                @contextmenu.prevent="openMenu($event, 'table', item.am_id, item, index)"
+                            >
+                                <!-- 标题部分 -->
+                                <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) }"
+                                    >
+                                        <td
+                                            v-for="(cell, i1) in row"
+                                            :key="i1"
+                                            :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%'}`">
+                                    <span v-html="highlightText(item.table.note || '', item.checks ? item.checks : [])"></span>
+                                </font>
+                            </div>
+
+                            <div
+                                @contextmenu.prevent="openMenu($event, 'content', item.am_id, item, index)"
+                                @dblclick="dblclickEdit(item.am_id, 'text', item, index)"
+                                v-else
+                                id="drop-target"
+                                @dragover="handleDragOver"
+                                @dragenter="handleDragEnter"
+                                @dragleave="handleDragLeave"
+                                @drop="handleDrop"
+                                @click.stop="initializeEditor($event, 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>
+                </div>
+</template>
+<script>
+export default {
+  props: {
+    item: Object,
+    isPreview: Boolean,
+    readonly: Boolean,
+    currentId: String,
+    mediaUrl: String,
+   
+    isHeaderRow: Function,
+    highlightImgCommentId: Function,
+    highlightImg: Function,
+    highlightText: Function,
+    dblclickEdit: Function,
+    updateUniqueIds: Function,
+    handleDragOver: Function,
+    handleDragEnter: Function,
+    handleDragLeave: Function,
+    handleDrop: Function,
+    initializeEditor: Function,
+    openMenu: Function,
+  },
+  methods: {
+   
+  },
+};
+</script>

src/components/page/components/table/content.vue

@@ -20,7 +20,7 @@
                 style="
                     /* white-space: pre-line; */
                     line-height: 12px;
-                    max-height: 60vh;
+                 
                     overflow: auto;
                     font-size: 12px;
                     font-size: 14px; /* 字体大小 */
@@ -74,6 +74,11 @@ export default {
         }
     },
     methods: {
+        setValue(){
+// 假设编辑器的 ID 是 'editor-id'
+this.$refs.tinymceChild1.setContent2(this.value);
+
+        },
         openLatexEditor(data) {
             this.$emit('openLatexEditor',data)
             console.log('at line 254:', '打开数字公式');

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

@@ -9,7 +9,7 @@
                 :wordStyle="wordStyle"
                 @getContent="getContent"
                 @openLatexEditor="openLatexEditor"
-                :height="calcDynamicWidth()"
+                :height="height?height:calcDynamicWidth()"
                 :value="updatedHtml"
                 :typesettingType="typesettingType"
                 class="paste-area text-container"
@@ -33,7 +33,7 @@
 <script>
 import Tinymce from '@/components/page/components/Tinymce';
 export default {
-    props: ['lineStyle'],
+    props: ['lineStyle','height'],
     components: {
         Tinymce
     },
@@ -102,6 +102,47 @@ export default {
         }
     },
     methods: {
+        setValue(){ console.log('this.lineStyle at line 107:', this.lineStyle)
+            this.typesettingType = 1;
+        if (this.lineStyle) {
+       
+            // console.log('newVal at line 37:', this.lineStyle);
+            if (this.lineStyle.table) {
+                this.tableData = [...this.lineStyle.table];
+                var modalContent = `
+                            <div class="wordTableHtml" >
+                                <table
+                                    border="1"
+                                    style="
+                                        border-collapse: collapse;
+                                        width: 100%;
+                                        text-align: center;
+                                        table-layout: auto;"
+                                >`;
+                this.tableData.forEach((row,i) => {
+                    modalContent += `<tr class="${this.isHeaderRow(i,this.tableData)?'table-header-row':''}">`;
+                    row.forEach((cell) => {
+                        modalContent += `
+                                        <td
+                                            colspan="${cell.colspan || 1}"
+                                            rowspan="${cell.rowspan || 1}"
+                                            style=""
+                                        >
+                                            <span>${cell.text}</span>
+                                        </td>`;
+                    });
+                    modalContent += `</tr>`;
+                });
+                modalContent += `</table></div>`;
+                // console.log('modalContent at line 91:', modalContent);
+                this.updatedHtml = modalContent;
+            }
+            // this.updatedHtml = newVal.html_data;
+        } else {
+            this.updatedHtml = '';
+        }
+        this.$refs.tinymceChild1.setContent2(this.updatedHtml);
+        },
         openLatexEditor(data) {
             this.$emit('openLatexEditor',data)
             console.log('at line 254:', '打开数字公式');

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

@@ -20,14 +20,14 @@
         >
             <div
                 v-if="!isPreview"
-                style="
+                :style="
-                    border-bottom: 2px solid #c7cdcf;
+                    `border-bottom: 2px solid #c7cdcf;
                     background-color: #fff;
                     position: fixed;
                     top: 60px;
-                    left: 285px;
+                    left: ${drawer?'0px':'285px'};
                     z-index: 10;
-                    right: 330px;
+                    right: ${drawer?'50vw':'330px'};
                     height: 46px;
                     display: flex;
                     align-items: center;
@@ -35,45 +35,10 @@
                     padding: 0 10px;
                     box-sizing: border-box;
                     overflow: hidden;
-                    width: calc(100% - 285px - 330px);
+                    width:${drawer?'50w':'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="padding: 0 0px; float: right">
                     <ul class="operateBox">
@@ -216,7 +181,7 @@
                                 :data-id="item.ami_id"
                                 :type="item.type"
                                 :main-id="item.am_id"
-                                @contextmenu.prevent="openMenu($event, 'img', item.am_id, item, index)"
+                               
                                 :id="'editor' + item.am_id"
                             >
                                 <img :src="`${mediaUrl + item.image.url}`" />
@@ -248,7 +213,7 @@
                                 :type="item.type"
                                 :id="'editor' + item.am_id"
                                 :main-id="item.am_id"
-                                @contextmenu.prevent="openMenu($event, 'table', item.am_id, item, index)"
+                                
                             >
                                 <!-- 标题部分 -->
                                 <font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`" style="text-align: center">
@@ -280,7 +245,7 @@
                             </div>
 
                             <div
-                                @contextmenu.prevent="openMenu($event, 'content', item.am_id, item, index)"
+                             
                                 @dblclick="dblclickEdit(item.am_id, 'text', item, index)"
                                 v-else
                                 id="drop-target"
@@ -306,15 +271,16 @@
 
             <div
                 v-if="!isPreview"
-                style="
+                v-show="drawer"
+                :style="`
                     width: 310px;
                     position: fixed;
                     top: 70px;
                     box-sizing: border-box;
-                    right: 10px;
+                    right:10px;
                     bottom: 0;
 
-                    overflow-y: auto;
+                    overflow-y: auto;`
                 "
                 class="commentList"
             >
@@ -731,6 +697,9 @@ export default {
         isShowArtWorkButton: {
             default: false
         },
+        drawer: {
+            default: false
+        },
         wordStyle: {
             type: String,
             default: ''
@@ -1441,6 +1410,7 @@ export default {
             }
         },
         dblclickEdit(id, type, data, index) {
+        console.log('id at line 1443:', id)
             if (!this.isPreview) {
                 this.currentId = id;
                 this.currentIndex = index;