tijiao

src/components/page/GenerateCharts.vue

@@ -137,26 +137,50 @@
                     </div>
                 </div>
                 <div :class="[drawer ? 'left' : 'left1']" style="height: 100%">
-                    <div >
+                    <div>
-                        <div style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box" v-if="currentContent&&currentContent.type == 1">Image</div>
+                        <div
-                        <div style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box" v-if="currentContent&&currentContent.type == 2">Table</div>
+                            style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box"
-                        <div style="height: 56px; background-color: #fff; padding: 20px; box-sizing: border-box" v-if="currentContent&&currentContent.type == 0">Content</div>
+                            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>
+                            <el-button type="primary" @click="handleSaveContent" style="margin-right: 20px"> Save </el-button>
                         </div>
                     </div>
-                   
                 </div>
                 <!-- 折叠展开图片-->
                 <!-- <div
@@ -1375,7 +1399,7 @@ 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;
@@ -1385,7 +1409,11 @@ export default {
             }
             this.$nextTick(() => {
                 this.drawer = true;
-                this.$refs.commonContent1.setValue();
+                if (this.currentContent.type == 0) {
+                    this.$refs.commonContent1.setValue();
+                } else if (this.currentContent.type == 2) {
+                    this.$refs.commonTable1.setValue();
+                }
             });
         },
         onAddContent(dataId) {

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:', '打开数字公式');