<template>
    <div style="height: 96%">
        <el-button type="primary" plain @click="goEdit()" style="width: auto; font-weight: bold; float: right;margin-bottom: 4px;">
            <i class="el-icon-document-copy" style="font-weight: bold; font-size: 14px"></i>
            Text Proofread
        </el-button>

      
   
        <common-word
        :isPreview="true"
                    :articleId="articleId"
                    v-if="htmlContent"
                    ref="commonWord"
                    :value="htmlContent"
                    :contentList="Main_List"
                    :chanFerForm="chanFerForm"
                    :comments="comments"
                    :wordStyle="wordStyle"
                    @onDrop="onDrop"
                    @onLinkUnbind="handleUnbindLink"
                    @onLinkConfirm="handleConfirmLink"
                    @saveContent="saveContent"
                    @editComment="editComment"
                    @loaded="loadedWord"
                    @onEdit="onEdit"
                    @addContent="onAddContent"
                    @changeSort="changeSort"
                    @onDelete="onDelete"
                    @onDeletes="onDeletes"
                    @refresh="onRefresh"
                    @onComment="onComment"
                    @onAddComment="onAddComment"
                    @solveComment="solveComment"
                    @cancelSolveComment="cancelSolveComment"
                    @replyComment="replyComment"
                    @deleteComment="deleteComment"
                    @editProofreading="editProofreading"
                    @revokeProofreading="revokeProofreading"
                    @executeProofreading="executeProofreading"
                    @deleteProofreading="deleteProofreading"
                    @onEditTitle="onEditTitle"
                    @onAddRow="onAddRow"
                    @changeComment="changeComment"
                    @openRefSelector="handleOpenRefSelectorFromManuscript"
                    @reorderReferencesByBody="handleReorderReferencesByBody"
                    @saveTableManuscript="saveTableManuscript"
                    @saveImageManuscript="saveImageManuscript"
                    style="width: calc(100%); height: calc(100%)"
                    :style="`100%`"
                >
                    <template slot="comment">
                        <div style="" class="commentList annotations"></div>
                    </template>
                    <template slot="refrences">
                        <edit-public-ref-table-only :isPreview="true"
                            v-if="p_article_id != null && p_article_id !== ''"
                            ref="editPublicRefTableOnly"
                            :chanFerForm="chanFerForm"
                            :chanFerFormRepeatList="chanFerFormRepeatList"
                            :ref-order-follows-body="true"
                            :p_article_id="p_article_id"
                            @ChanFerMashUp="ChanFerMashUp"
                            @refrashComp="fetchReferList"
                            @changeRefer="fetchReferList"
                        />
                    </template>
                </common-word>

     
     
    </div>
</template>

<script>
import bus from '@/components/common/bus';
import { del, isShallow } from 'vue';
import Tiff from 'tiff.js';
import { mediaUrl } from '@/common/js/commonJS.js'; // 引入通用逻辑
import Tinymce from '@/components/page/components/Tinymce';
import bottomTinymce from '@/components/page/components/Tinymce';
import catalogue from '@/components/page/components/table/catalogue.vue';
import editPublicRefTableOnly from './editPublicRefTableOnly.vue';
import { extractAutociteIdsFromHtmlString } from '@/utils/autociteHtml.js';
import { extractAutociteOrderFromMainList } from '@/utils/autociteMainListOrder.js';
export default {
    data() {
        return {
            detailMes: {},
            zoomNum: (window.innerWidth * 0.38) / 850,
            uploadWordTables: [],
            tablesHtmlVisible: false,
            tablesHtml: '',
            LateXInfo: {},
            isEditComment: false,
            showLateX: false,
            comments: [],
            remarkImageUrl: 'https://submission.tmrjournals.com/public/usericon/20241222/4e77ba3f29ce3cf798b36f24dc411b76.png',
            isFirstComponentLoaded: false,
            isWordComponentLoaded: false,
            currentContent: null,
            editVisible: false,
            currentId: null,
            ManuscirptContent: [],
            articleId: this.$route.query.id,
            isShowComment: false,
            urlList: {
                executeProofreading: 'api/Proofread/change',
                delete: 'api/Preaccept/delArticleMains',
                addRow: 'api/Preaccept/addBlankRow',
                addComment: 'api/Preaccept/createArticleMainCheckForEditor',
                editComment: 'api/Preaccept/editArticleMainCheck',
                solveComment: 'api/Preaccept/completeArticleMainCheckForAuthor',
                cancelSolveComment: 'api/Preaccept/rejectArticleMainCheckForEditor',
                deleteComment: 'api/Preaccept/delArticleMainCheckForEditor',
                replyComment: 'api/Preaccept/rejectArticleMainCheckForAuthor',
                content: 'api/Preaccept/getArticleMainsRecycle',
                huifuContent: 'api/Preaccept/replyArticleRecycle',
                editContent: 'api/Preaccept/editArticleMainsForAuthor',
                setPositioningTable: 'api/Preaccept/positioningTable',
                removePositioningTable: 'api/Preaccept/removeTable',
                setPositioningImage: 'api/Preaccept/positioningImage',
                removePositioningImage: 'api/Preaccept/removeImage',
                addImage: 'api/Preaccept/addMainImage',
                addTable: 'api/Preaccept/addMainTable',
                editImage: 'api/Preaccept/editMainImage',
                editTable: 'api/Preaccept/editMainTable',
                deleteImage: 'api/Articlemain/removeMainImage',
                deleteTable: 'api/Articlemain/removeMainTable'
            },
            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;
          }
          `,
            tables: [],
            htmlContent: '',

            baseUrl: this.Common.baseUrl,
            // baseUrl: 'https://submission.tmrjournals.com/',
            // mediaUrl: this.Common.mediaUrl,//暂时注释2024121601
            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: '',
            Main_List: [],
            txtStyle: {
                text: '',
                ChGtpTxt: ''
            },
            txtVisible: false,
            addContentVisible: false,
            editProofreadingContentVisible: false,
            proofreadingContent: {},
            addContent: {},
            lineStyle: {},
            lineStyle1: {},
            contentStyle: {},
            lineTable: [],
            threeVisible: false,
            picStyle: {},
            picStyle1: {},
            commentForm: {},
            commentVisible: false,
            pictVisible: false,
            typesettingType: 1,
            imagesList: [],
            exegesis: "The following contents'<b></b>,<i></i>'are necessary for the generation phase, please do not delete them!!!",
            p_article_id: null,
            chanFerForm: [],
            chanFerFormRepeatList: [],
            /** 全文 mycite 首次出现顺序（与稿面 common-word 一致），供 Edit Content 弹窗内 TinyMCE 显示 [1][2] 与重排列表 */
            articleCiteIdOrder: [],
            /** Edit Content 弹窗内当前 HTML（与保存合并逻辑一致），用于实时算出与稿面相同的 [n]，避免仅依赖防抖后的 articleCiteIdOrder */
            editModalDraftHtml: '',
            refSelectorVisible: false,
            refSelectorIsEdit: false,
            refSelectedRows: [],
            refSelectorSource: 'commonContent',
            /** 最近一次 getReferList 返回的 p_refer_id 顺序；与当前 chanFerForm 不一致时回写 batchUpdateRefer */
            _lastReferListApiOrder: null,
            /** 打开选择器时若带 currentRefIds（编辑已有引用），排序用「传值计算的顺序」；关闭后清空 */
            refSelectorContextIds: [],
            /** 选择参考文献弹窗：按 # 序号快速勾选，如 [5, 6, 10-15] */
            refSelectorQuickPick: ''
        };
    },
    components: {
        Tinymce,
        bottomTinymce,
        catalogue,
        editPublicRefTableOnly
    },
    computed: {
        /** 选择器打开时：无传值用 articleCiteIdOrder；有传值且 Edit Content 打开时用合并稿 editModalBodyCiteOrder，与 # 列、正文 [n] 一致 */
        refSelectorOrderForPreview() {
            if (!this.refSelectorVisible) {
                return Array.isArray(this.articleCiteIdOrder) ? this.articleCiteIdOrder : [];
            }
            const hasCtx = Array.isArray(this.refSelectorContextIds) && this.refSelectorContextIds.length > 0;
            if (hasCtx && this.editVisible) {
                const o = this.editModalBodyCiteOrder;
                return Array.isArray(o) && o.length > 0 ? o : this.articleCiteIdOrder || [];
            }
            return Array.isArray(this.articleCiteIdOrder) ? this.articleCiteIdOrder : [];
        },
        /** 选择器内表格行顺序：默认按正文 articleCiteIdOrder；有传值且处于编辑弹窗时按合并稿计算顺序 */
        refSelectorTableData() {
            const refs = Array.isArray(this.chanFerForm) ? [...this.chanFerForm] : [];
            if (!refs.length) return [];
            let order;
            const hasCtx = Array.isArray(this.refSelectorContextIds) && this.refSelectorContextIds.length > 0;
            if (hasCtx && this.editVisible) {
                order = this.editModalBodyCiteOrder;
            } else {
                order = this.articleCiteIdOrder;
            }
            if (!Array.isArray(order) || order.length === 0) return refs;
            return this.sortChanFerRowsByOrder(refs, order);
        },
        /** 与正文 mycite 一致：只展示已在列表中且有序号的文献，不显示「?」 */
        refPreviewLabel() {
            const refList = Array.isArray(this.chanFerForm) ? this.chanFerForm : [];
            const refMap = refList.reduce((acc, item) => {
                const key = item && item.p_refer_id != null ? String(item.p_refer_id) : '';
                if (key) acc[key] = item;
                return acc;
            }, {});

            const order = (this.refSelectorVisible ? this.refSelectorOrderForPreview : this.articleCiteIdOrder) || [];
            const citeMap = this.buildDisplayCiteMap(order);

            const ctx = Array.isArray(this.refSelectorContextIds) ? this.refSelectorContextIds.map(String) : [];
            const selectedIds = (this.refSelectedRows || [])
                .map((r) => (r && r.p_refer_id != null ? String(r.p_refer_id) : ''))
                .filter(Boolean);

            let idsForPreview = [];
            if (this.refSelectorVisible && ctx.length > 0) {
                const hasMissingInCtx = ctx.some((id) => !refMap[id]);
                if (hasMissingInCtx) {
                    idsForPreview = ctx;
                } else if (selectedIds.length > 0) {
                    idsForPreview = selectedIds;
                } else {
                    idsForPreview = ctx;
                }
            } else if (selectedIds.length > 0) {
                idsForPreview = selectedIds;
            }

            if (!idsForPreview.length) return '';

            const sortedIds = this.sortAutociteIdsByCiteNumber(idsForPreview, order);
            const parts = sortedIds.map((id) => {
                const ref = refMap[id];
                const no = ref ? citeMap[id] : null;
                const num = no != null && no !== '' ? String(no) : null;
                return { id, ref, num };
            });

            const numsForLabel = parts
                .map((p) => p.num)
                .filter((n) => n != null && n !== '')
                .map(Number);

            if (numsForLabel.length === 0) return '';
            return this.formatCiteNumbers(numsForLabel);
        },
        catalogueContent() {
            const base = Array.isArray(this.Main_List) ? this.Main_List : [];
            if (!Array.isArray(this.chanFerForm) || this.chanFerForm.length === 0) return base;
            return [
                ...base,
                {
                    am_id: 'References',
                    content: 'References',
                    is_h1: 1,
                    is_h2: 0
                }
            ];
        },
        /** 弹窗内引用角标：按 Main_List + 当前草稿段合并后的全文首次出现顺序，与保存后一致 */
        editModalBodyCiteOrder() {
            if (!this.editVisible || !this.currentContent || this.currentContent.am_id == null) {
                return this.articleCiteIdOrder;
            }
            const draft = this.editModalDraftHtml;
            if (draft == null || draft === '') {
                return this.articleCiteIdOrder;
            }
            const order = extractAutociteOrderFromMainList(this.Main_List, this.currentContent.am_id, draft);
            return order.length > 0 ? order : this.articleCiteIdOrder;
        }
    },
    watch: {
        editVisible(val) {
            if (!val) this.editModalDraftHtml = '';
        },
        // 监听计算属性
        // combinedValue(newVal, oldVal) {
        //     console.log('value1 或 value2 发生变化');
        //     console.log('新值:', newVal);
        //     console.log('旧值:', oldVal);
        //     // 处理任意一个值变化的逻辑
        //     this.updateWordTiffImage(newVal);
        // }
    },

    directives: {
        // 注册一个局部的自定义指令 v-focus
        focus: {
            // 指令的定义
            inserted: function (el) {
                // 聚焦元素
                el.querySelector('textarea').focus();
            }
        }
    },
    async created() {
        localStorage.removeItem('scrollPosition');
        this.isShowEditComment();
     
        await this.getInfo();
        
    },
    mounted() {
        document.addEventListener('copy', (event) => {
            // 获取用户选中的文本
            const selection = document.getSelection().toString();

            // 你可以修改剪贴板内容
            // event.clipboardData.setData('text/plain', selection + '\n---来自我的系统---');

            console.log('用户复制了内容:', selection);
            // 阻止默认行为（如果需要自定义复制逻辑的话）
            // event.preventDefault();
        });
    },
    async activated() {
        this.isShowEditComment();
     
        await this.getInfo();
       
    },
    beforeDestroy() {
        if (this._editModalCiteTimer) {
            clearTimeout(this._editModalCiteTimer);
            this._editModalCiteTimer = null;
        }
    },

    methods: {
        goEdit() {
            window.open(this.$router.resolve({  path: '/GenerateCharts',
                query: {
                    id: this.detailMes.article_id
                } }).href, '_blank');
            
        },
        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.loadPreacceptArticleDetail();
                        await this.fetchReferList();
                        await this.getDate();
                        await this.getCommentList();

                        loading.close();
                    } else {
                        this.$message.error(res.msg);
                        loading.close();
                    }
                })
                .catch((err) => {
                    this.$message.error(err);
                    loading.close();
                });
        },
        loadPreacceptArticleDetail() {
            // if (!this.articleId) return Promise.resolve();
            // return this.$api
            //     .post('api/Article/getPreacceptArticleDetail', { article_id: this.articleId })
            //     .then((res) => {
                
                    this.p_article_id = this.Art_Id;
                    // if (pid != null && pid !== '') {
                    //     if (!this.Art_P_Id) this.Art_P_Id = pid;
                     this.fetchReferList();
                    // }
                // })
                // .catch(() => {});
        },
        fetchReferList() {
            if (!this.p_article_id) return Promise.resolve();
            return this.$api
                .post('api/Production/getReferList', {
                    p_article_id: this.p_article_id
                })
                .then((res) => {
                    this._lastReferListApiOrder = this.referIdOrderSnapshot(res.data && res.data.refers).slice();
                    this.chanFerForm = res.data.refers;
                    this.chanFerFormRepeatList = Object.values(res.data.repeat || {});
                    for (let i = 0; i < this.chanFerForm.length; i++) {
                        this.chanFerForm[i].edit_mark = 1;
                    }
                    this.$nextTick(() => {
                        if (this.$refs.editPublicRefTableOnly) {
                            this.$refs.editPublicRefTableOnly.init();
                        }
                        if (this.editVisible && this.$refs.commonContent && this.$refs.commonContent.refreshAutociteDisplay) {
                            this.$refs.commonContent.refreshAutociteDisplay();
                        }
                        if (this.addContentVisible && this.$refs.addContent && this.$refs.addContent.refreshAutociteDisplay) {
                            this.$refs.addContent.refreshAutociteDisplay();
                        }
                        if (this.threeVisible && this.$refs.commonTable && this.$refs.commonTable.refreshAutociteDisplay) {
                            this.$refs.commonTable.refreshAutociteDisplay();
                        }
                        if (this.threeVisible && this.$refs.tinymceChildNote && this.$refs.tinymceChildNote.refreshAutociteDisplay) {
                            this.$refs.tinymceChildNote.refreshAutociteDisplay();
                        }
                        if (this.pictVisible && this.$refs.tinymceChildImgNote && this.$refs.tinymceChildImgNote.refreshAutociteDisplay) {
                            this.$refs.tinymceChildImgNote.refreshAutociteDisplay();
                        }
                        /** getReferList 会整表覆盖 chanFerForm，需再按正文首次出现顺序对齐，否则下方列表与 [n] 脱节 */
                        this.applyRefOrderAfterFetchReferList();
                        this.scheduleTryBatchSyncReferOrderIfOutOfSync();
                    });
                })
                .catch((err) => {
                    console.log(err);
                });
        },
        /** 参考文献列表接口返回后：弹窗内按合并稿重排；稿面由 word 同步正文顺序 */
        applyRefOrderAfterFetchReferList() {
            if (this.editVisible && this.currentContent && this.currentContent.am_id != null) {
                let html = this.editModalDraftHtml;
                if (html === '' || html == null) {
                    const t =
                        this.$refs.commonContent &&
                        this.$refs.commonContent.$refs &&
                        this.$refs.commonContent.$refs.tinymceChild1;
                    if (t && t.editorInstance) {
                        html = t.editorInstance.getContent({ format: 'raw' }) || '';
                    } else {
                        html = (this.currentContent && this.currentContent.content) || '';
                    }
                }
                this.flushReorderFromEditModal(html);
                return;
            }
            const w = this.$refs.commonWord;
            if (w && typeof w.syncRefOrder === 'function') {
                w.syncRefOrder();
            }
        },
        /**
         * 按 Main_List 各段正文中 mycite 首次出现顺序重排参考文献。
         * draftAmId + draftHtml：合并「当前将保存的这一段」后再扫全文（点 Save 时与保存后一致）；
         * 传 (null, null) 表示完全以 Main_List 已存 content 为准。
         */
        reorderReferencesFromMainListBody(draftAmId, draftHtml) {
            const order = extractAutociteOrderFromMainList(this.Main_List, draftAmId, draftHtml);
            if (order.length > 0) {
                this.handleReorderReferencesByBody(order);
            }
        },
        handleOpenRefSelectorFromManuscript(data) {
            this.handleOpenRefSelector(data, 'manuscriptAutocite');
        },
        onRefSelectorDialogClosed() {
            this.refSelectorContextIds = [];
            this.refSelectorQuickPick = '';
        },
        /** 仅排序展示用，不修改 chanFerForm（逻辑与 handleReorderReferencesByBody 一致） */
        sortChanFerRowsByOrder(refs, orderedIds) {
            if (!Array.isArray(orderedIds) || orderedIds.length === 0) return refs;
            const ids = orderedIds.map(String);
            const idSet = new Set(ids);
            const byId = {};
            refs.forEach((r) => {
                if (r && r.p_refer_id != null) byId[String(r.p_refer_id)] = r;
            });
            const next = [];
            ids.forEach((id) => {
                const row = byId[id];
                if (row) next.push(row);
            });
            refs.forEach((r) => {
                if (!r || r.p_refer_id == null) return;
                const id = String(r.p_refer_id);
                if (!idSet.has(id)) next.push(r);
            });
            if (refs.length > 0 && next.length === 0) return refs;
            return next;
        },
        /**
         * 与 word.vue citeMap：正文顺序中仅「当前参考文献列表里存在」的 id 依次占号，已删除/不存在的 id 不占位
         */
        buildDisplayCiteMap(orderArray) {
            const refs = Array.isArray(this.chanFerForm) ? this.chanFerForm : [];
            const refIdSet = new Set(
                refs.map((r) => (r && r.p_refer_id != null ? String(r.p_refer_id) : '')).filter(Boolean)
            );
            const map = {};
            if (!Array.isArray(orderArray) || orderArray.length === 0) {
                refs.forEach((row, idx) => {
                    const key = row && row.p_refer_id != null ? String(row.p_refer_id) : '';
                    if (key) map[key] = idx + 1;
                });
                return map;
            }
            const filtered = [];
            orderArray.forEach((id) => {
                const k = String(id);
                if (!k || !refIdSet.has(k)) return;
                if (filtered.includes(k)) return;
                filtered.push(k);
            });
            filtered.forEach((id, idx) => {
                map[id] = idx + 1;
            });
            let next = filtered.length + 1;
            refs.forEach((r) => {
                const key = r && r.p_refer_id != null ? String(r.p_refer_id) : '';
                if (!key || map[key] != null) return;
                map[key] = next++;
            });
            return map;
        },
        /** 与 word.vue sortAutociteIdsByCiteNumber：排序键使用 buildDisplayCiteMap */
        sortAutociteIdsByCiteNumber(ids, orderArray) {
            const uniq = [...new Set((ids || []).map(String))];
            const map = this.buildDisplayCiteMap(orderArray);
            return uniq.sort((a, b) => {
                const na = map[a];
                const nb = map[b];
                const ha = na != null && na !== '';
                const hb = nb != null && nb !== '';
                if (ha && hb) return Number(na) - Number(nb);
                if (ha) return -1;
                if (hb) return 1;
                return String(a).localeCompare(String(b));
            });
        },
        /** 与 word.vue：连续全局序号合并为 1–3 */
        formatCiteNumbers(nums) {
            if (!nums || !nums.length) return '';
            const sorted = [...new Set(nums)].sort((a, b) => a - b);
            const result = [];
            let i = 0;
            while (i < sorted.length) {
                let j = i;
                while (j < sorted.length - 1 && sorted[j + 1] === sorted[j] + 1) j++;
                if (j - i >= 2) {
                    result.push(`${sorted[i]}–${sorted[j]}`);
                } else {
                    for (let k = i; k <= j; k++) result.push(sorted[k]);
                }
                i = j + 1;
            }
            return result.join(', ');
        },
        /** 正文 mycite 顺序为唯一依据：按首次出现顺序重排 chanFerForm，未在正文出现的条目排在末尾 */
        handleReorderReferencesByBody(orderedIds) {
            if (!Array.isArray(orderedIds) || orderedIds.length === 0) return;
            const ids = orderedIds.map(String);
            const prevOrder = this.articleCiteIdOrder || [];
            const sameOrder =
                ids.length === prevOrder.length && ids.every((id, i) => String(id) === String(prevOrder[i]));
            if (!sameOrder) {
                this.articleCiteIdOrder = ids.slice();
            }
            const idSet = new Set(ids);
            const refs = Array.isArray(this.chanFerForm) ? [...this.chanFerForm] : [];
            const byId = {};
            refs.forEach((r) => {
                if (r && r.p_refer_id != null) byId[String(r.p_refer_id)] = r;
            });
            const next = [];
            ids.forEach((id) => {
                const row = byId[id];
                if (row) next.push(row);
            });
            refs.forEach((r) => {
                if (!r || r.p_refer_id == null) return;
                const id = String(r.p_refer_id);
                if (!idSet.has(id)) next.push(r);
            });
            /**
             * 若正文已出现引用 id，但列表尚未加载或 id 与 byId 对不上，会出现 next 为空而 refs 非空
             * （正文 id 全在 idSet 内，第二轮被跳过），此时切勿 chanFerForm=[]，否则参考文献整块消失。
             */
            if (refs.length > 0 && next.length === 0) {
                return;
            }
            const sig = (arr) => arr.map((r) => String(r.p_refer_id)).join('\0');
            if (sig(next) === sig(refs)) return;
            this.chanFerForm = next;
        },
        /**
         * 将当前 chanFerForm 全文同步到后端（顺序 + 各字段）。
         * 接口：api/References/batchUpdateRefer：p_article_id + list（JSON 字符串，文献对象数组）
         */
        syncBatchReferenceOrderToServer() {
            const pid = this.p_article_id;
            if (pid == null || pid === '') return Promise.resolve();
            const refs = Array.isArray(this.chanFerForm) ? this.chanFerForm : [];
            if (refs.length === 0) return Promise.resolve();
            let listJson;
            try {
                listJson = JSON.stringify(JSON.parse(JSON.stringify(refs)));
            } catch (e) {
                return Promise.resolve();
            }
            return this.$api
                .post('api/References/batchUpdateRefer', {
                    p_article_id: String(pid),
                    list: listJson
                })
                .then((res) => {
                    const ok = res && (res.code === 0 || res.code === 1 || res.status === 1);
                    if (ok) {
                        this._lastReferListApiOrder = this.referIdOrderSnapshot(this.chanFerForm).slice();
                    }
                    if (!ok && res && (res.msg || res.message)) {
                        console.warn('[batchUpdateRefer]', res.msg || res.message);
                    }
                    return res;
                })
                .catch((err) => {
                    console.warn('[batchUpdateRefer] request failed', err);
                });
        },
        referIdOrderSnapshot(refs) {
            return (Array.isArray(refs) ? refs : [])
                .map((r) => (r && r.p_refer_id != null ? String(r.p_refer_id) : ''))
                .filter(Boolean);
        },
        tryBatchSyncReferOrderIfOutOfSync() {
            if (this._lastReferListApiOrder == null) return;
            const track = this._lastReferListApiOrder.map(String);
            const cur = this.referIdOrderSnapshot(this.chanFerForm);
            if (cur.length === 0) return;
            const same = track.length === cur.length && track.every((id, i) => id === cur[i]);
            if (!same) {
                this.syncBatchReferenceOrderToServer();
            }
        },
        scheduleTryBatchSyncReferOrderIfOutOfSync() {
            this.$nextTick(() => {
                this.$nextTick(() => {
                    this.$nextTick(() => {
                        this.tryBatchSyncReferOrderIfOutOfSync();
                    });
                });
            });
        },
        /** 编辑弹窗内正文一变立即按全文合并稿重排参考文献（不再防抖，选中/输入后列表马上跟正文一致） */
        scheduleReorderFromEditModal(html) {
            if (!this.editVisible || !this.currentContent || this.currentContent.am_id == null) return;
            this.$nextTick(() => {
                this.flushReorderFromEditModal(html);
            });
        },
        /** 立即按全文合并稿重排参考文献顺序（插入引用后调用，避免编号长期停留在列表序号 [8]） */
        flushReorderFromEditModal(html) {
            if (!this.editVisible || !this.currentContent || this.currentContent.am_id == null) return;
            let order = extractAutociteOrderFromMainList(this.Main_List, this.currentContent.am_id, html);
            if (order.length === 0 && html && /mycite/i.test(html)) {
                order = extractAutociteIdsFromHtmlString(html);
            }
            if (order.length > 0) {
                this.handleReorderReferencesByBody(order);
            }
        },
        /**
         * 插入引用前先把新 p_refer_id 并入 articleCiteIdOrder，避免子组件 citeMap 缺键显示 [?]；
         * 随后 flush 会按全文首次出现顺序覆盖为准确值。
         */
        ensureArticleCiteOrderIncludesIds(newIds) {
            const add = (newIds || []).map(String).filter(Boolean);
            if (!add.length) return;
            let order = Array.isArray(this.articleCiteIdOrder) ? [...this.articleCiteIdOrder.map(String)] : [];
            add.forEach((id) => {
                if (!order.includes(id)) order.push(id);
            });
            this.articleCiteIdOrder = order;
        },
        onEditModalEditorInput(html) {
            this.editModalDraftHtml = html || '';
            this.flushReorderFromEditModal(html);
        },
        handleOpenRefSelector(data, sourceOverride) {
            const currentIds = data && Array.isArray(data.currentRefIds) ? data.currentRefIds : [];
            this.refSelectorContextIds = currentIds.map(String);
            this.refSelectorIsEdit = currentIds.length > 0;
            this.refSelectedRows = [];
            if (sourceOverride === 'manuscriptAutocite' || (data && data.source === 'manuscript')) {
                this.refSelectorSource = 'manuscriptAutocite';
            } else if (
                typeof sourceOverride === 'string' &&
                sourceOverride &&
                (sourceOverride === 'tinymceChildNote' || sourceOverride === 'tinymceChildImgNote') &&
                this.$refs[sourceOverride]
            ) {
                /** 表格 Note / 图片说明 独立编辑器，勿与 commonTable 混淆 */
                this.refSelectorSource = sourceOverride;
            } else if (this.threeVisible) {
                /** Edit Table 主表格区 */
                this.refSelectorSource = 'commonTable';
            } else if (this.editVisible) {
                this.refSelectorSource = 'commonContent';
            } else if (this.addContentVisible) {
                this.refSelectorSource = 'addContent';
            }
            this.refSelectorVisible = true;
            this.$nextTick(() => {
                const table = this.$refs.refSelectorTable;
                if (table) {
                    table.clearSelection();
                    if (currentIds.length > 0) {
                        const idSet = new Set(currentIds.map(String));
                        this.chanFerForm.forEach((row) => {
                            if (idSet.has(String(row.p_refer_id))) {
                                table.toggleRowSelection(row, true);
                            }
                        });
                    }
                }
            });
        },
        handleRefSelectionChange(rows) {
            this.refSelectedRows = rows;
        },
        parseQuickPickNumbers(input) {
            const s = String(input || '').trim();
            if (!s) return [];
            let t = s.replace(/^\s*\[/, '').replace(/\]\s*$/, '');
            t = t.replace(/[，]/g, ',');
            const parts = t.split(',').map((x) => x.trim()).filter(Boolean);
            const out = new Set();
            parts.forEach((p) => {
                const m = p.match(/^(\d+)\s*[-–—]\s*(\d+)$/);
                if (m) {
                    const a = Number(m[1]);
                    const b = Number(m[2]);
                    if (!Number.isNaN(a) && !Number.isNaN(b)) {
                        const lo = Math.min(a, b);
                        const hi = Math.max(a, b);
                        for (let i = lo; i <= hi; i++) out.add(i);
                    }
                    return;
                }
                const n = parseInt(p, 10);
                if (!Number.isNaN(n)) out.add(n);
            });
            return Array.from(out).sort((a, b) => a - b);
        },
        clearRefSelectorSelection() {
            const table = this.$refs.refSelectorTable;
            if (table && typeof table.clearSelection === 'function') {
                table.clearSelection();
            }
            this.refSelectedRows = [];
        },
        applyRefSelectorQuickPick() {
            const table = this.$refs.refSelectorTable;
            if (!table) return;
            const nums = this.parseQuickPickNumbers(this.refSelectorQuickPick);
            if (!nums.length) {
                this.clearRefSelectorSelection();
                return;
            }
            table.clearSelection();
            const data = Array.isArray(this.refSelectorTableData) ? this.refSelectorTableData : [];
            nums.forEach((n) => {
                const idx = n - 1;
                if (idx < 0 || idx >= data.length) return;
                table.toggleRowSelection(data[idx], true);
            });
        },
        /** 点击整行切换勾选（与点复选框一致）；点链接或点复选框本身时不处理，避免重复或误触 */
        handleRefSelectorRowClick(row, column, event) {
            if (column && column.type === 'selection') return;
            if (event && event.target && typeof event.target.closest === 'function') {
                if (event.target.closest('.el-checkbox') || event.target.closest('a[href]')) return;
            }
            const table = this.$refs.refSelectorTable;
            if (!table || !row) return;
            const isSelected = (this.refSelectedRows || []).some(
                (r) => r && String(r.p_refer_id) === String(row.p_refer_id)
            );
            table.toggleRowSelection(row, !isSelected);
        },
        handleConfirmRefCite() {
            if (this.refSelectedRows.length === 0) return;
            const ids = this.refSelectedRows.map((r) => r.p_refer_id);
            if (this.refSelectorSource === 'manuscriptAutocite') {
                const w = this.$refs.commonWord;
                if (w && typeof w.applyManuscriptAutocite === 'function') {
                    w.applyManuscriptAutocite(ids);
                }
                this.refSelectorVisible = false;
                this.refSelectedRows = [];
                this.$nextTick(() => {
                    if (w && typeof w.syncRefOrder === 'function') {
                        w.syncRefOrder();
                    }
                });
                return;
            }
            this.ensureArticleCiteOrderIncludesIds(ids);
            this.$nextTick(() => {
                const ref = this.$refs[this.refSelectorSource];
                if (ref) {
                    ref.insertAutocite(ids);
                }
                this.refSelectorVisible = false;
                this.refSelectedRows = [];
                this.$nextTick(() => {
                    if (this.editVisible && this.$refs.commonContent) {
                        const t = this.$refs.commonContent.$refs && this.$refs.commonContent.$refs.tinymceChild1;
                        if (t && t.editorInstance) {
                            const html = t.editorInstance.getContent({ format: 'raw' });
                            this.editModalDraftHtml = html || '';
                            this.flushReorderFromEditModal(html);
                        }
                        if (typeof this.$refs.commonContent.refreshAutociteDisplay === 'function') {
                            this.$refs.commonContent.refreshAutociteDisplay();
                        }
                    }
                    if (this.addContentVisible && this.$refs.addContent && typeof this.$refs.addContent.refreshAutociteDisplay === 'function') {
                        this.$refs.addContent.refreshAutociteDisplay();
                    }
                    if (this.threeVisible && this.$refs.commonTable && typeof this.$refs.commonTable.refreshAutociteDisplay === 'function') {
                        this.$refs.commonTable.refreshAutociteDisplay();
                    }
                    if (this.threeVisible && this.$refs.tinymceChildNote && typeof this.$refs.tinymceChildNote.refreshAutociteDisplay === 'function') {
                        this.$refs.tinymceChildNote.refreshAutociteDisplay();
                    }
                    if (this.pictVisible && this.$refs.tinymceChildImgNote && typeof this.$refs.tinymceChildImgNote.refreshAutociteDisplay === 'function') {
                        this.$refs.tinymceChildImgNote.refreshAutociteDisplay();
                    }
                });
            });
        },
        handleRemoveRefCite() {
            const idsToStrip = (this.refSelectedRows || []).map((r) => r.p_refer_id);
            if (this.refSelectorSource === 'manuscriptAutocite') {
                const w = this.$refs.commonWord;
                if (w && typeof w.stripManuscriptAutociteIds === 'function') {
                    w.stripManuscriptAutociteIds(idsToStrip);
                }
                this.refSelectorVisible = false;
                this.refSelectedRows = [];
                return;
            }
            const ref = this.$refs[this.refSelectorSource];
            if (ref && typeof ref.stripAutociteIds === 'function') {
                ref.stripAutociteIds(idsToStrip);
            } else if (ref) {
                ref.removeAutocite();
            }
            this.refSelectorVisible = false;
            this.refSelectedRows = [];
        },
        ChanFerMashUp(e) {
            this.$api
                .post('api/Production/referHB', e)
                .then((res) => {
                    if (res.code == 0) {
                        this.fetchReferList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err);
                });
        },
        openAddTable(content) {
            this.editVisible = false;
            this.threeVisible = true;
            this.$forceUpdate();
        },
        async copyArray(data) {
            try {
                // 将数组内容转换为字符串，使用换行符分隔
                const textToCopy = JSON.stringify(data);

                // 使用 Clipboard API 复制文本
                await navigator.clipboard.writeText(textToCopy);
                alert('数组内容已复制到剪贴板!');
            } catch (err) {
                console.error('复制失败:', err);
                alert('复制失败，请重试!');
            }
        },
        openLatexEditor(data) {
            this.showLateX = true;
            this.LateXInfo = data;
        },
        isShowEditComment() {
            if (localStorage.getItem('U_role')) {
                var identity = localStorage.getItem('U_role');
                if (identity.includes('editor')) {
                    this.isEditComment = true;
                } else {
                    this.isEditComment = false;
                }
            }
        },

        loadedWord() {
            this.isWordComponentLoaded = true;
            this.$nextTick(() => {
                if (this.$refs.editPublicRefTableOnly) {
                    this.$refs.editPublicRefTableOnly.init();
                }
            });
        },
        // 监听第一个兄弟组件加载完毕
        // onFirstComponentLoaded(imagesList) {
        //     this.imagesList = [...imagesList];
        //     this.isFirstComponentLoaded = true;
        // },
        // updateWordTiffImage(data) {
        //     console.log('updateWordTiffImage at line 423:', data);

        //     if (this.isFirstComponentLoaded && this.isWordComponentLoaded) {
        //         this.imagesList.forEach((e) => {
        //             if (e.dataUrl) {
        //                 this.$nextTick(() => {
        //                     this.$refs.commonWord.replacePlaceholderImage(e.ami_id, e.dataUrl);
        //                 });
        //             }
        //         });
        //     }
        // },
        handleSaveContent() {
            this.$refs.commonContent.getTinymceContent('content');
        },
        handleMatchBracketRefsInAddContent() {
            const ref = this.$refs.addContent;
            if (!ref || typeof ref.convertBracketRefsToAutocite !== 'function') return;
            const { replaced } = ref.convertBracketRefsToAutocite();
            if (replaced > 0) {
                this.$message.success(this.$t('wordCite.matchBracketRefsDone', { n: replaced }));
            } else {
                this.$message.info(this.$t('wordCite.matchBracketRefsNone'));
            }
        },
        handleSaveAddContent() {
            this.$refs.addContent.getTinymceContent('addcontent');
        },
        handleSaveEditProofreadingContent() {
            this.$refs.addContent.getTinymceContent('addcontent');
        },

        async getContent(type, content) {
            if (type == 'content') {
                content = this.$commonJS.transformHtmlString(content);

                var div = document.createElement('div');
                div.innerHTML = content; // 将 HTML 字符串加载到 div 中
                // 替换所有 <strong> 为 <b>
                var strongTags = div.getElementsByTagName('strong');
                for (var i = 0; i < strongTags.length; i++) {
                    var bTag = document.createElement('b');
                    bTag.innerHTML = strongTags[i].innerHTML; // 保留内容
                    strongTags[i].parentNode.replaceChild(bTag, strongTags[i]);
                }
                // 替换所有 <em> 为 <i>
                var emTags = div.getElementsByTagName('em');
                for (var i = 0; i < emTags.length; i++) {
                    var iTag = document.createElement('i');
                    iTag.innerHTML = emTags[i].innerHTML; // 保留内容
                    emTags[i].parentNode.replaceChild(iTag, emTags[i]);
                }

                // 获取最终修改后的 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);
                

                this.saveContentList(list, this.currentId);
            } else if (type == 'table') {
                this.saveTable(content);
            } else if (type == 'comment') {
                this.addComment(content);
            }
        },
        handleUnbindLink(data) {
            const { label, mainId, index, content } = data;

            const unwrapTag = (str) => {
                return str.replace(/<(myfigure|mytable)[^>]*>([\s\S]*?)<\/\1>/gi, '$2');
            };

            // 2. 执行替换
            // 我们只针对传入的这个特定的 label 进行剥壳
            const strippedLabel = unwrapTag(label);

            // 3. 将 content 中的原标签替换为剥壳后的文字
            // 使用 split/join 或者是精准 replace，确保只替换这一处
            const newContent = content.replace(label, strippedLabel);
            this.saveContent(newContent, mainId);
        },
        handleConfirmLink(selectedMedia) {
            const targetId = selectedMedia.select.amt_id || selectedMedia.select.ami_id;
            const type = selectedMedia.type;
            const tagName = `my${type}`;
            let originalContent = selectedMedia.linkData.content;
            const label = selectedMedia.linkData.label;
            if (!label || !originalContent) return;
            const isAlreadyTagged = label.startsWith('<my') && label.endsWith('>');
            let newContent = '';
            if (isAlreadyTagged) {
                const updatedTag = label
                    .replace(/<my(figure|table)/, `<${tagName}`)
                    .replace(/data-id=".*?"/, `data-id="${targetId}"`)
                    .replace(/<\/my(figure|table)>$/, `</${tagName}>`);

                newContent = originalContent.replace(label, updatedTag);
            } else {
                const replacement = `<${tagName} data-id="${targetId}">${label}</${tagName}>`;
                newContent = originalContent.replace(label, replacement);
            }
            this.saveContent(newContent, selectedMedia.linkData.mainId);
        },

        async saveContent(content, am_id) {
          

            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            var that = this;
            var str = content.replace(/^<p>\s*(.*?)\s*<\/p>$/, '$1').trim();

                str = str.replace(/<br\s*\/?>/gi, '');
                
            str = await that.$commonJS.decodeHtml(str);

            /** 点 Save 立即按将写入的正文重排下方列表（不等待接口），与弹窗内 [n] 一致 */
            this.reorderReferencesFromMainListBody(am_id, str);

            await that.$api
                .post(that.urlList.editContent, {
                    am_id: am_id,
                    content: str
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        loading.close();
                        this.editVisible = false;
                        this.refreshCurrentContent('content', am_id, res.data);
                        this.getCommentList();
                        /** 以接口回写后的 Main_List 再对齐一次；稿面 word 会由 contentList 监听触发 syncRefOrder */
                        this.$nextTick(() => {
                            this.reorderReferencesFromMainListBody(null, null);
                            this.$nextTick(() => {
                                this.syncBatchReferenceOrderToServer();
                            });
                        });
                    } else {
                        loading.close();
                        this.$message.error(res.msg);
                        this.reorderReferencesFromMainListBody(null, null);
                    }
                })
                .catch((err) => {
                    loading.close();
                    this.$message.error(err);
                    this.reorderReferencesFromMainListBody(null, null);
                });
        },
        async saveContentList(content, am_id) {
            if (content.length == 0) {
                this.$message({
                    type: 'warning',
                    message: 'Please enter the content!'
                });
            }
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });

            content = content.map((str) => {
                // 逻辑：去掉所有换行符后，如果剩下的内容是空的
                if (str.replace(/<br\s*\/?>/gi, '').trim() === '') {
                    return ''; // 变成真正的空字符串
                }
                return str; // 如果有文字，保留原样
            });
            await this.$api
                .post('api/Preaccept/addMoreRow', {
                    article_id: this.articleId,
                    am_id: am_id,
                    rows: content
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        loading.close();
                        this.addContentVisible = false;
                        this.refreshCurrentContent('addMoreRow', am_id, res.data);
                        this.getCommentList();
                    } else {
                        loading.close();
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    loading.close();
                    this.$message.error(err);
                });
        },
        isHeaderRow(rowIndex, table) {
            var table = table;

            var head = table[0];

            return rowIndex < head[0].rowspan; // 假设前两行是表头
        },
        deleteComment(comment, index) {
            if (this.isEditComment) {
                this.$confirm(this.$t('commonTable.removeAnnotations'), 'Prompt', {
                    confirmButtonText: 'Submit',
                    cancelButtonText: 'Cancel',
                    type: 'warning'
                })
                    .then(() => {
                        this.$api
                            .post(this.urlList.deleteComment, {
                                amc_id: comment.amc_id
                            })
                            .then((res) => {
                                if (res.code == 0) {
                                    this.getDate();
                                    this.getCommentList();
                                } else {
                                    this.$message.error(res.msg);
                                }
                            });
                        // this.comments.splice(index, 1); // 删除评论
                    })
                    .catch(() => {});
            }
        },
        saveLateX(data) {
          
            // 1. 从 data 中解构出 wrap (或者你命名的模式变量)
            const { editorId, wmathId, latex, wrap } = data;
            const newLatex = latex ? latex.trim() : '';

            if (!editorId || !wmathId) return;

            const targetEditor = tinymce.get(editorId);
            if (!targetEditor) return;

            // 2. 找到编辑器中现有的 wmath 标签
            const targetWmath = targetEditor.dom.select(`wmath[data-id="${wmathId}"]`, targetEditor.getBody())[0];

            if (targetWmath) {
                if (!newLatex) {
                    // ❌ 删除公式
                    targetEditor.dom.remove(targetWmath);
                } else {
                    // ✅ 更新公式
                    // 保持属性纯净：同时更新 latex 内容和 wrap 属性
                    targetWmath.setAttribute('data-latex', newLatex);

                    // 如果 data 中传了 wrap 模式就更新它，否则可以保留原样或设为默认
                    if (wrap) {
                        targetWmath.setAttribute('data-wrap', wrap);
                    }

                    // 内部只放纯 latex 文本，不包裹 $ 符号
                    targetWmath.innerHTML = newLatex;

                    setTimeout(() => {
                        if (typeof renderMathJax === 'function') {
                            // 重新渲染该编辑器内的数学公式
                            renderMathJax(editorId);
                        }
                    }, 10);
                }
            }
        },
        async huifu(id) {
            var that = this;
            await this.$confirm(this.$t('commonTable.reContent'), 'Prompt', {
                confirmButtonText: 'Submit',
                cancelButtonText: 'Cancel',
                type: 'warning'
            })
                .then(async () => {
                    var that = this;
                    await that.$api
                        .post(that.urlList.huifuContent, {
                            am_id: id
                        })
                        .then(async (res) => {
                            if (res.code == 0) {
                                this.getDate();
                            }
                        });
                })
                .catch((err) => {
                    console.log('err at line 466:', err);
                });
        },
        async getManuscirptContent() {
            var that = this;
            await that.$api
                .post(that.urlList.content, {
                    article_id: this.articleId
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        this.ManuscirptContent = res.data.list;
                        // this.$refs.commonWordHtmlTypeSetting.getCommentList();
                    }
                });
        },
        changeComment() {
            this.isShowComment = !this.isShowComment;
        },

        // 编辑评论，显示文本框
        goToListComment(id, type) {
            var am_id;
            if (type == 'img') {
                am_id = this.Main_List.find((item) => item.ami_id == id).am_id;
            } else if (type == 'table') {
                am_id = this.Main_List.find((item) => item.amt_id == id).am_id;
            } else {
                am_id = id;
            }
            if (am_id) {
                this.goToComment(am_id);
            }
        },
        goToComment(mainId) {
            this.$nextTick(() => {
                this.$refs.commonWord.goToComment(mainId);
            });
        },
        getTables(tables, html) {
            this.tables = data.map((e, i) => ({ ...e, p_main_table_id: 2141 + i, p_article_id: 2141 }));
            this.tablesHtml = html;
        },
        onDragStart(event, image, index, type) {
            if (type == 'img') {
                event.dataTransfer.setData('image', JSON.stringify({ ...image }));
                event.dataTransfer.setData('imageIndex', index);
            } else {
                event.dataTransfer.setData('table', JSON.stringify({ table: image.table, amt_id: image.amt_id, title: image.title }));
                event.dataTransfer.setData('tableIndex', index);
            }
        },
        async onDelete(dataId) {
            var that = this;
            var dataInfo = this.Main_List.find((item) => item.am_id == dataId);
            var dataIndex = this.Main_List.indexOf(dataInfo);

            var type = '';
            if (dataInfo.type == 1) {
                type = 'img';
            } else if (dataInfo.type == 2) {
                type = 'table';
            } else if (dataInfo.type == 0) {
                type = 'content';
            }
            var url = '';
            switch (type) {
                case 'table':
                    url = that.urlList.removePositioningTable;
                    break;
                case 'img':
                    url = that.urlList.removePositioningImage;
                    break;
                case 'content':
                    url = that.urlList.delete;
                    break;
            }
            if (dataInfo.type == 0 && dataInfo.content == '') {
                await that.$api
                    .post(url, {
                        am_id: dataId
                    })
                    .then(async (res) => {
                        if (res.code == 0) {
                            setTimeout(() => {
                                that.Main_List.splice(dataIndex, 1);

                                that.getCommentList();
                                that.$forceUpdate();
                            });
                        } else {
                            this.$message.error(res.msg);
                        }
                    })
                    .catch((err) => {
                        this.$message.error(err);
                    });
            } else {
                await this.$confirm(this.$t('commonTable.removeContent'), 'Prompt', {
                    confirmButtonText: 'Submit',
                    cancelButtonText: 'Cancel',
                    type: 'warning'
                })
                    .then(async () => {
                        await that.$api
                            .post(url, {
                                am_id: dataId
                            })
                            .then(async (res) => {
                                if (res.code == 0) {
                                    setTimeout(() => {
                                        that.Main_List.splice(dataIndex, 1);
                                        that.$forceUpdate();
                                        if (type == 'img') {
                                            that.$refs.commonWordHtmlTypeSetting.refresh('removeImg', { ami_id: dataInfo.ami_id });
                                        } else if (type == 'table') {
                                            that.$refs.commonWordHtmlTypeSetting.refresh('removeTable', { amt_id: dataInfo.amt_id });
                                        }
                                        that.getCommentList();

                                        that.$forceUpdate();
                                    });
                                }
                            });
                    })
                    .catch((err) => {
                        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.reload();

                                    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;
            const index = this.Main_List.findIndex((item) => item.am_id == id);
            if (type == 'up' && index == 0) {
                return;
            }
            if (type == 'down' && index == this.Main_List.length - 1) {
                return;
            }
            const load = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            await that.$api
                .post(type == 'up' ? '/api/Preaccept/upArticleMain' : '/api/Preaccept/downArticleMain', {
                    am_id: id
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        load.close();
                        await this.refreshCurrentContent(`${type}ArticleMain`, id);
                        that.$forceUpdate();
                    } else {
                        load.close();
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    load.close();
                    this.$message.error(err);
                });
        },
        async addCommentSetting(content) {
           
            await this.$api
                .post(this.urlList.addComment, {
                    am_id: content.am_id,
                    remark: content.remark
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        this.$forceUpdate();
                        // this.commentVisible = false;
                        // this.getDate()
                        this.$nextTick(() => {
                            this.$refs.commonWordHtmlTypeSetting.getCommentList();
                        });
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },
        async addComment(content) {
       
          var str=    this.$commonJS.transformHtmlString(content)
   str=str.replace(/<br\s*\/?>/gi, '');
          console.log("🚀 ~ addComment ~ content:", str);
            if (str == '') {
                this.$message({
                    type: 'warning',
                    message: 'Please enter the Comment!'
                });
                return;
            }

            if (this.commentForm.type == 'user') {
                await this.$api
                    .post(this.urlList.replyComment, {
                        amc_id: this.commentForm.amc_id,
                        author_remark: str
                    })
                    .then(async (res) => {
                        if (res.code == 0) {
                            this.$forceUpdate();
                            this.commentVisible = false;
                            this.getDate();
                            this.getCommentList();
                            this.$nextTick(() => {});
                        } else {
                            this.$message.error(res.msg);
                        }
                    })
                    .catch((err) => {
                        this.$message.error(err.msg);
                    });
            } else {
                var data = {};
                if (this.commentForm.amc_id) {
                    data = {
                        amc_id: this.commentForm.amc_id,

                        remark: str
                    };
                } else {
                    data = {
                        article_id: this.articleId,
                        am_id: this.commentForm.am_id,
                        content: this.commentForm.content,
                        remark: str
                    };
                }
                await this.$api
                    .post(this.commentForm.amc_id ? this.urlList.editComment : this.urlList.addComment, { ...data })
                    .then(async (res) => {
                        if (res.code == 0) {
                            this.$forceUpdate();
                            this.commentVisible = false;
                            this.getDate();
                            this.getCommentList();
                            this.$nextTick(() => {});
                        } else {
                            this.$message.error(res.msg);
                        }
                    })
                    .catch((err) => {
                        this.$message.error(err.msg);
                    });
            }
        },
        async onComment(dataId) {
            var data = this.Main_List.find((item) => item.am_id == dataId);
            if (data && data.remark) {
                this.$alert(
                    `<p style="display:flex;"><img   src="${this.remarkImageUrl}" alt="" style="width:20px;height:20px;margin-right:10px;"/><span style=" overflow-wrap: break-word;width:calc(100% - 50px)"> ${data.remark}</span></p>`,
                    'Comments',
                    {
                        confirmButtonText: 'OK',
                        dangerouslyUseHTMLString: true, // 启用 HTML 渲染
                        callback: (action) => {}
                    }
                );
            }
        },
        onRefresh() {
            this.getDate();
            this.getCommentList();
        },
        editComment(comment, type) {
          
            this.commentForm = {
                ...comment,
                type: type,
                remark: type == 'user' ? comment.author_remark : comment.remark
            };
          
            this.commentVisible = true;
        },
        async onAddComment(data) {
            var form = this.Main_List.find((item) => item.am_id == data.mainId);
            this.commentForm = {
                ...form,
                content: data.label ? data.label : '',
                remark: '',
                type: 'add',
                role: 'editor'
            };
            this.commentVisible = true;
        },
        async replyComment(data) {
            this.commentForm = {
                ...data,
                remark: data.author_remark,
                type: 'user'
            };
            this.commentVisible = true;
        },
        async onEditTitle(data) {
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            var url;
            switch (data.value) {
                case 0:
                    url = 'api/Preaccept/changeNormal';
                    break;
                case 1:
                    url = 'api/Preaccept/changeH1';
                    break;
                case 2:
                    url = 'api/Preaccept/changeH2';
                    break;
                case 3:
                    url = 'api/Preaccept/changeH3';
                    break;
            }

            await this.$api
                .post(url, {
                    am_id: data.mainId
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        await this.refreshCurrentContent('content', data.mainId, res.data);
                        loading.close();
                        this.getCommentList();
                    }
                })
                .catch((err) => {
                    loading.close();
                    this.$message.error(err.msg);
                });
        },
        async refreshCurrentContent(type, mainId, resData) {
            const index = this.Main_List.findIndex((item) => item.am_id == mainId);
            if (type == 'upArticleMain') {
                if (index == 0) {
                    return;
                }
                const item = this.Main_List[index];
                // 2. 从原位置删除
                this.Main_List.splice(index, 1);
                // 3. 插入到前一个位置
                this.Main_List.splice(index - 1, 0, item);
                return;
            }
            if (type == 'downArticleMain') {
                if (index == this.Main_List.length - 1) {
                    return;
                }
                const item = this.Main_List[index];
                // 2. 从原位置删除
                this.Main_List.splice(index, 1);
                // 3. 插入到前一个位置
                this.Main_List.splice(index + 1, 0, item);
                return;
            }
            if (index !== -1 && resData) {
                var newData = Array.isArray(resData) ? resData : resData ? [resData] : [];
                const updatedItems = newData.map((item) => ({
                    ...item,
                    checked: false,
                    getnum: 0
                }));
                if (type == 'addRow') {
                    this.Main_List.splice(index + 1, 0, updatedItems[0]);
                } else if (type == 'addMoreRow') {
                    this.Main_List.splice(index + 1, 0, ...updatedItems);
                } else if (type == 'positioningImg' || type == 'positioningTable') {
                    this.Main_List.splice(index + 1, 0, ...updatedItems);
                } else {
                    this.$set(this.Main_List, index, updatedItems[0]);
                }
            } else {
                console.warn(`Item with am_id ${mainId} not found.`);
            }
            this.$forceUpdate();
        },
        handlePaperclip() {
            this.uploadWordTables = [];
            this.$refs.fileInput.click();
        },
        handleFileChange(event) {
            var that = this;
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            // 处理文件上传并传递回调函数
            this.$commonJS.handleFileUpload(event, function (tables) {
              
                if (tables.length == 0) {
                    loading.close();
                    that.$message({
                        type: 'warning',
                        message: 'No table found!'
                    });
                    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: '' });
                            });
                        });
                    })
                )
                    .then((result) => {
                        // 所有表格的解析完成后，处理结果
                        that.uploadWordTables = result;
                        loading.close();
                        that.tablesHtmlVisible = true;
                    })
                    .catch((error) => {
                        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,
                    article_id: this.articleId
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        this.refreshCurrentContent('addRow', mainId, res.data);
                        this.getCommentList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },
        async solveComment(data) {
            await this.$api
                .post(this.urlList.solveComment, {
                    amc_id: data.amc_id
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        this.getDate();
                        this.getCommentList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },

        async executeProofreading(data) {
            await this.$api
                .post(this.urlList.executeProofreading, {
                    am_id: data.am_id,
                    record_id: data.id,
                    state: 1,
                    article_id: this.$route.query.id
                })
                .then(async (res) => {
                    if (res.status == 1) {
                        this.getDate();
                        this.getCommentList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },
        async revokeProofreading(data) {
            await this.$api
                .post(this.urlList.executeProofreading, {
                    am_id: data.am_id,
                    record_id: data.id,
                    state: 2,
                    article_id: this.$route.query.id
                })
                .then(async (res) => {
                    if (res.status == 1) {
                        this.getDate();
                        this.getCommentList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },
        async editProofreading(data) {},
        deleteProofreading(data, index) {},

        async cancelSolveComment(data) {
            await this.$api
                .post(this.urlList.cancelSolveComment, {
                    amc_id: data.amc_id
                })
                .then(async (res) => {
                    if (res.code == 0) {
                        this.getDate();
                        this.getCommentList();
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err.msg);
                });
        },
        clearButton() {
            var deleteButtons = document.querySelectorAll('.wordButtonContainer');
            deleteButtons.forEach(function (button) {
                button.remove(); // 移除每个 wordButtonContainer 按钮
            });
        },
        handleImageAdd(type) {
            this.picStyle = { note: '', picUrl: '', title: '' };
            this.picStyle1 = { note: '', picUrl: '', title: '' };
            this.picStyle.visiTitle = 'Add Figure';
            this.pictVisible = true;
        },
        handleTableAdd(type) {
            this.lineStyle = { note: '', table_data: '', html_data: '' };
            this.lineStyle1 = { note: '', table_data: '', html_data: '' };
            this.lineStyle.visiTitle = 'Add Table';
            this.threeVisible = true;
        },
        addUploadWordTable(data) {
            this.lineStyle = { note: '', table: data.table_data, html_data: data.html_data };
            this.lineStyle1 = { note: '', table: data.table_data, html_data: data.html_data };

            this.lineStyle.visiTitle = 'Add Table';
            this.threeVisible = true;
        },

        async handleFigureAndTableDelete(data, type) {
            await this.$confirm(this.$t('commonTable.remove' + type), 'Prompt', {
                confirmButtonText: 'Submit',
                cancelButtonText: 'Cancel',
                type: 'warning'
            })
                .then(async (res) => {
                    const loading = this.$loading({
                        lock: true,
                        text: 'Loading...',
                        spinner: 'el-icon-loading',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    if (type == 'img') {
                        this.$api
                            .post(this.urlList.deleteImage, {
                                ami_id: data.ami_id,

                                article_id: this.articleId
                            })
                            .then(async (res) => {
                                if (res.status == 1) {
                                    loading.close();
                                    this.$message.success(res.msg);
                                    this.$refs.commonWordHtmlTypeSetting.replacement('img', data.ami_id);
                                } else {
                                    loading.close();
                                    this.$message.error(res.msg);
                                }
                            })
                            .catch((err) => {
                                loading.close();
                                this.$message.error(err.msg);
                            });
                    }
                    if (type == 'table') {
                        this.$api
                            .post(this.urlList.deleteTable, {
                                amt_id: data.amt_id,

                                article_id: this.articleId
                            })
                            .then(async (res) => {
                                if (res.status == 1) {
                                    loading.close();
                                    this.$refs.commonWordHtmlTypeSetting.replacement('table', data.amt_id);
                                } else {
                                    loading.close();
                                    this.$message.error(res.msg);
                                }
                            })
                            .catch((err) => {
                                loading.close();
                                this.$message.error(err.msg);
                            });
                    }
                })
                .catch((err) => {
                    // this.$message.error(err.msg);
                });
        },
        handleFigureAndTableEdit(data, type) {
            if (type == 'img') {
                var extension = data.url.split('.').pop().toLowerCase();
                this.picStyle = {};
                this.picStyle = { ...data, extension: extension, picUrl: data.url };
                this.picStyle.visiTitle = 'Edit Figure';
                this.pictVisible = true;
            } else if (type == 'table') {
                this.lineStyle = {};
                this.lineStyle1 = {};
                // 1. 提取处理逻辑
                const formattedData = {
                    ...data,
                    table: JSON.parse(data.table_data)
                };

                // 2. 统一赋值
                this.lineStyle = formattedData;
                this.lineStyle1 = { ...formattedData }; // 使用浅拷贝确保两个变量指向不同引用（如果需要独立修改）
                this.lineStyle.visiTitle = 'Edit Table';
                this.threeVisible = true;
            }
        },
        updateChange(content, type) {
         
            var str = this.$commonJS.transformHtmlString(content);
            if (type == 'imgNote') {
                this.picStyle1.note = str;
            } else if (type == 'imgTitle') {
                this.picStyle1.title = str;
            } else {
                this.lineStyle1[type] = str;
            }
        },
        onEdit(dataId) {
            this.currentContent = {};
            this.picStyle = {};
            this.lineStyle = {};
            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') {
                    const imgElement = document.querySelector(`[data-img-id="${data.ami_id}"]`);
                    if (imgElement) {
                        // 获取图片的 src
                        data.dataUrl = imgElement.src;
                    }
                } else if (['jpg', 'jpeg', 'png'].includes(extension)) {
                } else {
                }
                this.currentContent = { ...data, extension: extension };
                this.picStyle = { ...data, extension: extension, picUrl: data.image.url, note: data.image.note, title: data.image.title };
                this.picStyle.visiTitle = 'Edit Figure';
                this.pictVisible = true;
            } else if (data.type == 2) {
                this.currentContent = { ...data };
                this.lineStyle = {
                    ...data,
                    table: JSON.parse(data.table.table_data),
                    html_data: data.table.html_data,
                    note: data.table.note,
                    title: data.table.title
                };
                this.lineStyle.visiTitle = 'Edit Table';
                this.threeVisible = true;
            } else {
                data.content = data.content.replace(/<span[^>]*>/g, '').replace(/<\/span>/g, ''); // 去除span标签
                this.editModalDraftHtml = data.content || '';
                this.currentContent = data;

                this.editVisible = true;
                this.currentId = dataId;
                if (this.p_article_id) {
                    this.fetchReferList();
                }
                this.$nextTick(() => {
                    this.$nextTick(() => {
                        if (this.$refs.commonContent && this.$refs.commonContent.refreshAutociteDisplay) {
                            this.$refs.commonContent.refreshAutociteDisplay();
                        }
                        const draft = this.currentContent && this.currentContent.content;
                        if (draft != null) {
                            this.flushReorderFromEditModal(draft);
                        }
                    });
                });
            }
        },
        onAddContent(dataId) {
            this.addContentVisible = true;
            this.addContent = {};

            this.currentId = dataId;
        },

        async onDrop(event, dataId) {
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            if (event.dataTransfer.getData('image')) {
                const draggedImage = JSON.parse(event.dataTransfer.getData('image'));
                const draggedImageIndex = JSON.parse(event.dataTransfer.getData('imageIndex'));
                this.$nextTick(async () => {
                    await this.$api
                        .post(this.urlList.setPositioningImage, {
                            am_id: dataId,
                            ami_id: draggedImage.ami_id
                        })
                        .then(async (res) => {
                            if (res.code == 0) {
                                loading.close();
                                this.refreshCurrentContent('positioningImg', dataId, res.data);
                                this.$nextTick(() => {
                                    this.$refs.commonWordHtmlTypeSetting.refresh('positioningImg', res.data);
                                });
                                this.$forceUpdate();
                            } else {
                                loading.close();
                                this.$message.error(res.msg);
                            }
                        })
                        .catch((err) => {
                            loading.close();
                            this.$message.error(err.msg);
                        });
                });
            } else {
                const draggedtable = JSON.parse(event.dataTransfer.getData('table'));

                this.$nextTick(async () => {
                    await this.$api
                        .post(this.urlList.setPositioningTable, {
                            am_id: dataId,
                            amt_id: draggedtable.amt_id
                        })
                        .then(async (res) => {
                            if (res.code == 0) {
                                loading.close();
                                this.refreshCurrentContent('positioningTable', dataId, res.data);
                                this.$nextTick(() => {
                                    this.$refs.commonWordHtmlTypeSetting.refresh('positioningTable', res.data);
                                });
                                this.$forceUpdate();
                            } else {
                                loading.close();
                                this.$message.error(res.msg);
                            }
                        })
                        .catch((err) => {
                            loading.close();
                            this.$message.error(err.msg);
                        });
                });
            }
        },
        getCommentList() {
            this.$api
                .post('api/Preaccept/getArticleMainCheckList', {
                    article_id: this.articleId
                })
                .then((res) => {
                    this.comments = res.data.list;
                    // this.positionAnnotations();
                });
        },
        getWord() {
            this.htmlContent = 'true';
        },
        // 获取数据
        async getDate() {
            this.imagesList = [];
            let urlLInk = '';
            let urlTask = {};
            if (this.Art_Id != undefined) {
                urlLInk = 'api/Preaccept/getArticleMains';
                urlTask.article_id = this.detailMes.article_id;
            }
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });

            // 获取文章信息
            await this.$api
                .post(urlLInk, urlTask)
                .then(async (res) => {
                    if (res.code == 0) {
                        this.Main_List = res.data.list.map((e) => {
                            e.checked = false;
                            return e;
                        });
                        this.getManuscirptContent();
                        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;
                        }
                        this.$nextTick(async () => {
                            await this.getWord();
                            if (this.$refs.catalogue) {
                                await this.$refs.catalogue.getCatalogueList();
                            }
                            this.$nextTick(() => {
                                this.reorderReferencesFromMainListBody(null, null);
                                this.scheduleTryBatchSyncReferOrderIfOutOfSync();
                            });
                            loading.close();
                        });
                        // }, 1000);
                    } else {
                        this.$message.error(res.msg);
                        loading.close();
                    }
                })
                .catch((err) => {
                    this.$message.error(err);
                    loading.close();
                });
        },

        // 修改段落/图片
        MTxtEdit(val, num) {
            this.picStyle = JSON.parse(JSON.stringify(val));
            this.picStyle.picUrl = this.picStyle.content;
            this.picStyle.imageUrl = this.baseUrl + 'public/mainimg/' + this.picStyle.content;
            this.picStyle.visiTitle = 'Edit Figure';
            this.pictVisible = true;
        },

        // 转化为gpt标准格式
        trsanGtp() {
            if (this.btnDisble) {
                this.btnDisble = false;
                this.$api
                    .post('api/Production/mainGptcheck', {
                        p_main_id: this.txtStyle.p_main_id
                    })
                    .then((res) => {
                        if (res.code == 0) {
                            this.txtStyle.ChGtpTxt = res.data.content;
                            this.btnDisble = true;
                            // this.$forceUpdate()
                            this.$message.success('Converting success!');
                        } else {
                            this.btnDisble = true;
                            this.$message.error('Converting fail!');
                        }
                    })
                    .catch((err) => {
                        this.btnDisble = true;
                        this.$message.error('Converting fail!');
                    });
            } else {
                this.$message.warning('Converting, please wait!');
            }
        },

        // 替换Gtp生成的内容
        replceChGpr(val) {
            this.txtStyle.text = JSON.parse(JSON.stringify(this.txtStyle.ChGtpTxt));
        },

        // 确定保存段落修改
        saveTxt() {
            this.$api
                .post('api/Production/editProductionMain', {
                    p_main_id: this.txtStyle.p_main_id,
                    content: this.txtStyle.text
                })
                .then((res) => {
                    if (res.code == 0) {
                        this.$message.success('Successfully edit text!');
                        this.txtVisible = false;
                        this.getDate();
                        // this.Main_List[this.txtStyle.index].text = JSON.parse(JSON.stringify(this.txtStyle.text))
                    } else {
                        this.$message.error(res.msg);
                    }
                })
                .catch((err) => {
                    this.$message.error(err);
                });
        },

        // 图片段落
        MTxtPic(val, num) {
            this.picStyle.pre_type = 'img';
            // this.picStyle.body = val.p_main_img_id;

            this.picStyle.p_article_id = this.Art_P_Id;
            this.picStyle.titleBot = '';
            this.picStyle.note = '';
            this.picStyle.width = '500';
            this.picStyle.picUrl = '';
            this.picStyle.imageUrl = '';
            this.picStyle.visiTitle = 'Insert Picture Backward';
            this.pictVisible = true;
        },

        // 确定保存图片
        async savePic() {
            var str = this.picStyle1.note ? await this.$commonJS.decodeHtml(this.picStyle1.note) : '';
         
            

            var titleStr = this.picStyle1.title ? await this.$commonJS.decodeHtml(this.picStyle1.title) : '';

            if (!this.picStyle.picUrl) {
                this.$message.error('Please upload a picture');
                return;
            }
            if (!titleStr) {
                this.$message.error('Please enter a title');
                return;
            }
            str = str.replace(/<br\s*\/?>/gi, '');
            titleStr = titleStr.replace(/<br\s*\/?>/gi, '');
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            if (this.picStyle.visiTitle == 'Edit Figure') {
                this.$api
                    .post(this.urlList.editImage, {
                        ami_id: this.picStyle.ami_id,
                        url: this.picStyle.picUrl,
                        note: str,
                        title: titleStr
                    })
                    .then((res) => {
                        if (res.code == 0) {
                            loading.close();
                            this.$message.success('Successfully edit Figure!');
                            this.pictVisible = false;
                            this.$refs.commonWordHtmlTypeSetting.refresh(
                                'editImg',
                                res.data.image ? { ...res.data.image, has_selected: 1 } : res.data
                            );
                            this.refreshCurrentContent('editImg', res.data.am_id, res.data);
                            this.$nextTick(() => {
                                this.getCommentList();
                                this.$forceUpdate();
                            });
                        } else {
                            loading.close();
                            this.$message.error(res.msg);
                        }
                    })
                    .catch((err) => {
                        loading.close();
                        this.$message.error(err);
                    });
            } else {
                this.$api
                    .post(this.urlList.addImage, {
                        article_id: this.articleId,
                        url: this.picStyle.picUrl,
                        note: str,
                        title: titleStr
                    })
                    .then((res) => {
                        if (res.code == 0) {
                            loading.close();
                            this.$message.success('Successfully Add Figure!');
                            this.pictVisible = false;

                            this.$refs.commonWordHtmlTypeSetting.refresh('addImg', res.data);
                        } else {
                            loading.close();
                            this.$message.error(res.msg);
                        }
                    })
                    .catch((err) => {
                        loading.close();
                        this.$message.error(err);
                    });
            }
        },
        handleSaveTable() {
            this.$nextTick(() => {
                this.$refs.commonTable.getTableContent('table');
            });
        },
        handleSaveComment() {
            this.$nextTick(() => {
                this.$refs.tinymceChildComment.getContent('comment');
            });
        },
        /** 稿面图片说明/标题内修改/移除 mycite 后，走 editImage 写回 */
        async saveImageManuscript(payload) {
            if (!payload || payload.ami_id == null) return;
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            let strNote = payload.note || '';
            let strTitle = payload.title || '';
            if (strNote !== '') {
                strNote = await this.$commonJS.decodeHtml(strNote);
            }
            if (strTitle !== '') {
                strTitle = await this.$commonJS.decodeHtml(strTitle);
            }
            strNote = strNote.replace(/<br\s*\/?>/gi, '');
            strTitle = strTitle.replace(/<br\s*\/?>/gi, '');
            try {
                const res = await this.$api.post(this.urlList.editImage, {
                    ami_id: payload.ami_id,
                    url: payload.url || '',
                    note: strNote,
                    title: strTitle
                });
                loading.close();
                if (res.code == 0) {
                    this.$message.success('Successfully updated.');
                    if (this.$refs.commonWordHtmlTypeSetting && this.$refs.commonWordHtmlTypeSetting.refresh) {
                        this.$refs.commonWordHtmlTypeSetting.refresh(
                            'editImg',
                            res.data.image ? { ...res.data.image, has_selected: 1 } : res.data
                        );
                    }
                    this.refreshCurrentContent('editImg', res.data.am_id, res.data);
                    this.getCommentList();
                    this.$nextTick(() => {
                        const w = this.$refs.commonWord;
                        if (w && typeof w.syncRefOrder === 'function') {
                            w.syncRefOrder();
                        }
                        this.$nextTick(() => {
                            this.syncBatchReferenceOrderToServer();
                        });
                    });
                } else {
                    this.$message.error(res.msg);
                }
            } catch (err) {
                loading.close();
                this.$message.error(err && err.message ? err.message : String(err));
            }
        },
        /** 稿面表格单元格内修改/移除 mycite 后，走 editMainTable 写回 */
        async saveTableManuscript(payload) {
            if (!payload || payload.amt_id == null) return;
            const loading = this.$loading({
                lock: true,
                text: 'Loading...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
            let strTitle = payload.title || '';
            let strNote = payload.note || '';
            if (strNote !== '') {
                strNote = await this.$commonJS.decodeHtml(strNote);
            }
            if (strTitle !== '') {
                strTitle = await this.$commonJS.decodeHtml(strTitle);
            }
            strNote = strNote.replace(/<br\s*\/?>/gi, '');
            strTitle = strTitle.replace(/<br\s*\/?>/gi, '');
            try {
                const res = await this.$api.post(this.urlList.editTable, {
                    amt_id: payload.amt_id,
                    table_data: payload.table_data,
                    html_data: payload.html_data || '',
                    note: strNote,
                    title: strTitle
                });
                loading.close();
                if (res.code == 0) {
                    this.$message.success('Successfully updated.');
                    if (this.$refs.commonWordHtmlTypeSetting && this.$refs.commonWordHtmlTypeSetting.refresh) {
                        this.$refs.commonWordHtmlTypeSetting.refresh(
                            'editTable',
                            res.data.table ? { ...res.data.table, has_selected: 1 } : res.data
                        );
                    }
                    this.refreshCurrentContent('editTable', res.data.am_id, res.data);
                    this.getCommentList();
                    this.$nextTick(() => {
                        const w = this.$refs.commonWord;
                        if (w && typeof w.syncRefOrder === 'function') {
                            w.syncRefOrder();
                        }
                        this.$nextTick(() => {
                            this.syncBatchReferenceOrderToServer();
                        });
                    });
                } else {
                    this.$message.error(res.msg);
                }
            } catch (err) {
                loading.close();
                this.$message.error(err && err.message ? err.message : String(err));
            }
        },
        async saveTable(content) {
          
            const cleanTableData = (tableList) => {
    if (tableList.length == 0) {
        return [];
    } else {
        // 定义清理函数：去掉所有 br 标签和 TinyMCE 占位符
        const cleanText = (text) => {
            if (!text) return "";
            // return text.replace(/<br\s*\/?>/gi, '').trim();
            return text
        };

        // 1. 获取处理后的干净表头
        const header = tableList[0].map(cell => ({
            ...cell,
            text: cleanText(cell.text)
        }));

        // 2. 过滤逻辑
        const cleanedTable = tableList.map((row) => {
            // 首先：把每一行里的每个 cell.text 里的 <br> 都去掉
            return row.map(cell => ({
                ...cell,
                text: cleanText(cell.text)
            }));
        }).filter((row, index) => {
            if (index === 0) return true;

            // 3. 此时比较的就是没有 <br> 的文本了
            const isHeaderRow = row.every((cell, cellIndex) => {
                return cell.text === header[cellIndex].text;
            });

            return !isHeaderRow;
        });

        return cleanedTable;
    }
};
            var cleanedTableList = content.table ? content.table : [];

            cleanedTableList = cleanTableData(content.table);
            var strTitle = this.lineStyle1.title ? this.lineStyle1.title : '';

            var strNote = this.lineStyle1.note ? this.lineStyle1.note : '';
            if (strNote != '') {
                strNote = await this.$commonJS.decodeHtml(strNote);
            }
            if (strTitle != '') {
                strTitle = await this.$commonJS.decodeHtml(strTitle);
            } else {
                this.$message.error('Please enter a title');
                return;
            }

            if (content && cleanedTableList && cleanedTableList.length > 0) {
                const loading = this.$loading({
                    lock: true,
                    text: 'Loading...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                strNote = strNote.replace(/<br\s*\/?>/gi, '');
                strTitle = strTitle.replace(/<br\s*\/?>/gi, '');
                var tableStr=JSON.stringify(cleanedTableList)
          
                if (this.lineStyle.visiTitle == 'Edit Table') {
                    this.$api
                        .post(this.urlList.editTable, {
                            amt_id: this.lineStyle.amt_id,
                            table_data: tableStr,
                            html_data: content.html_data,
                            note: strNote,
                            title: strTitle
                        })
                        .then((res) => {
                            if (res.code == 0) {
                                loading.close();
                                this.$message.success('Successfully edit Table!');
                                this.threeVisible = false;
                                setTimeout(() => {
                                    this.$refs.commonWordHtmlTypeSetting.refresh(
                                        'editTable',
                                        res.data.table ? { ...res.data.table, has_selected: 1 } : res.data
                                    );
                                    this.refreshCurrentContent('editTable', res.data.am_id, res.data);
                                    this.getCommentList();
                                });
                            } else {
                                loading.close();
                                this.$message.error(res.msg);
                            }
                        })
                        .catch((err) => {
                            loading.close();
                            this.$message.error(err);
                        });
                } else {
                    this.$api
                        .post(this.urlList.addTable, {
                            article_id: this.articleId,
                            table_data: JSON.stringify(cleanedTableList),
                            html_data: content.html_data,
                            note: strNote,
                            title: strTitle
                        })
                        .then((res) => {
                            if (res.code == 0) {
                                loading.close();
                                this.$message.success('Successfully Add Table!');
                                this.threeVisible = false;

                                this.$refs.commonWordHtmlTypeSetting.refresh('addTable', res.data);
                            } else {
                                loading.close();
                                this.$message.error(res.msg);
                            }
                        })
                        .catch((err) => {
                            this.$message.error(err);
                            loading.close();
                        });
                }
            } else {
                this.$message.error('Please fill in the table content!');
                loading.close();
            }
        },
        async removeEvent(row) {
            //   const type = await VXETable.modal.confirm('您确定要删除该数据?')
            const $table = this.$refs.xTable;
            //   if (type === 'confirm') {
            $table.remove(row);
            //   }
        },
        async insertEvent(row) {
            const $table = this.$refs.xTable;
            const record = {};
            const { row: newRow } = await $table.insertAt(record, row);
            await $table.setEditCell(newRow, 'name');
        },
        // 表格段落
        MTxtTable(val, num) {
            this.lineStyle.textarea = '';
            this.lineStyle.titleCon = '';
            this.lineTable = [];
            this.lineStyle = {};
            this.threeVisible = true;

            this.$forceUpdate();
        },

        // 表格转化
        CopyExcelToTable() {
            if (this.lineStyle.textarea == '') {
                this.$message.error('Please fill in the table content!');
                return;
            }

            let txtRows = this.lineStyle.textarea.split('\n');
            let txtColum = [];
            for (let i = 0; i < txtRows.length; i++) {
                if (txtRows[i] != '') {
                    let columns = txtRows[i].split('\t');
                    let dataone = [];
                    for (let j = 0; j < columns.length; j++) {
                        dataone.push(columns[j]);
                    }
                    txtColum.push(dataone);
                }
            }
            let arrwithNumer = Math.floor(100 / txtColum[0].length) - 2;
            this.lineStyle.arrwith = [];
            for (let i = 0; i < txtColum[0].length; i++) {
                this.lineStyle.arrwith.push(arrwithNumer);
            }
            this.lineTable = txtColum;
        },

        // 推送
        pushOnline() {
            // 二次确认
            this.$confirm('Are you sure you want to push it to the official website?', 'Tips', {
                type: 'warning'
            })
                .then(() => {
                    this.$api
                        .post('api/Production/pushMainToWeb', {
                            article_id: this.Art_web_Id,
                            p_article_id: this.Art_P_Id
                        })
                        .then((res) => {
                            if (res.code == 0) {
                                this.$message.success('Successfully push!');
                                this.getDate();
                                if (this.Art_Doi != undefined) {
                                    this.$router.push({
                                        path: 'comArtHtmlEdit',
                                        query: {
                                            artID: this.Art_web_Id
                                        }
                                    });
                                }
                            } else {
                                this.$message.error(res.msg);
                            }
                        })
                        .catch((err) => {
                            this.$message.error(err);
                        });
                })
                .catch(() => {});
        },

        // 上传图片
        handleAvatarSuccess(res, file) {
            if (res.code == 0) {
                this.picStyle.picUrl = res.data.upurl;

                this.$forceUpdate();
            } else {
                this.$message.error(res.msg);
            }
            this.picStyle.imageUrl = URL.createObjectURL(file.raw);
        },
        handleAvatarError(res, file) {},
        beforeAvatarUpload(file) {
            const isLt2M = file.size / 1024 / 1024 < 20;
            if (!isLt2M) {
                this.$message.error('Picture size cannot exceed 20M!');
                return false;
            }

            const isValidFormat = ['image/jpeg', 'image/png', 'image/tiff'].includes(file.type);
            if (!isValidFormat) {
                this.$message.error(this.$t('commonTable.uploadImageInfo'));
            }
            return isValidFormat; // 返回false将阻止文件上传
        },
        positionAnnotations() {
            this.$nextTick(() => {
                this.comments.forEach((item) => {
                    const contentElement = document.querySelector('[remark-main-id="' + item.am_id + '"]');
                    const annotationElement = document.querySelector('[data-target="main-' + item.am_id + '"]');
                    if (contentElement && annotationElement) {
                        const rect = contentElement.getBoundingClientRect();
                        annotationElement.style.position = 'absolute';
                        annotationElement.style.top = `${rect.top}px`;
                    }
                });
            });
        }
    }
};
</script>

<style scoped>
.lineStyle {
    border-top: 1px solid #0066994d;
    padding: 20px 20px 40px 20px;
}

.lineStyle > div {
}

.lineStyle > div span.title {
    font-size: 14px;
    color: #606266;
    margin: 0px 10px 0px 0px;
}

.lineStyle > div font.mark {
    font-size: 14px;
    color: #606266;
    margin: 0px 0px 0px 10px;
}

.lineStyle .styArry {
    display: inline-block;
    margin: 15px 40px 0 0;
}

.lineStyle .styArry:nth-last-child(1) {
    margin-right: 0;
}

.lineAll {
    margin: 0 auto;
}

.lineAll .lineTit {
    padding: 0 0 20px 0;
    font-size: 14px;
}

.lineAll .lineTit:nth-child(1) {
    border-top: 2px solid #333333;
    border-bottom: 1px solid #333333;
    padding: 10px 0;
    font-weight: bold;
}

.lineAll .lineTit:nth-child(2) {
    padding-top: 20px;
}

.lineAll .lineTit:nth-last-child(1) {
    border-bottom: 2px solid #333333;
}

.lineAll .lineTit > div {
    line-height: 22px;
    vertical-align: middle;
    display: inline-block;
    padding: 0 1%;
}

.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;
}

.type_MTxt {
    background-color: #fff;
    padding: 0 10px 10px 10px;
    box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
    position: relative;
}

.type_MTxt > div {
    position: relative;
    padding: 8px 15px;
    min-height: 22px;
    border: 2px dashed red;
    border-radius: 5px;
    color: #606266;
}
.type_MTxt > div:hover {
    background-color: rgb(0 102 153 / 10%);
    border: 2px dashed rgb(0 102 153 / 50%);
}
/* .type_MTxt > .imgBox:hover {
  background-color: rgb(0 102 153 / 10%);
  border: 2px dashed rgb(0 102 153 / 50%);
} */

.type_MTxt > div > p {
    font-size: 14px;
    line-height: 22px;
}

.type_MTxt > .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;
}

.type_MTxt > div .MaxPicture {
    text-align: center;
}

.type_MTxt > div .MaxPicture > img {
    margin-bottom: 10px;
}

.type_MTxt > div .MaxPicture > font {
    display: block;
    margin: 0 auto;
    font-size: 13px;
}

.MaxBtn {
    position: absolute;
    right: 0;
    top: -1px;
    color: #fff;
    border-radius: 50px;
    font-size: 15.5px;
    padding: 6px 7px;
    display: none;
    opacity: 0.75;
}

.MaxBtn {
    display: block;
}

.MaxBtn:hover {
    opacity: 1;
    cursor: pointer;
}

.type_Gbtn {
    color: #fff;
    border-color: #006699;
    background: #006699;
    width: 30%;
    text-align: center;
    padding: 8px 0;
    font-size: 14px;
    border-radius: 8px;
    font-weight: 500;
    margin: 0 auto;
}

.type_Gbtn:hover {
    box-shadow: 0 4px 14px rgb(0 102 153 / 30%);
    cursor: pointer;
}

.type_CHar {
    position: relative;
    border-left: 4px solid rgba(0 102 153 / 20%);
    border-radius: 5px;
    padding: 20px 25px 15px 20px;
    background-color: #fff;
    margin: 20px 0 0 0;
    font-size: 14px;
    line-height: 22px;
    box-shadow: 0 1px 10px rgb(0 102 153 / 20%);
}

.type_CHar .chReple {
    position: absolute;
    top: -1px;
    right: 1px;
    border-radius: 3px;
    font-size: 10px;
    background-color: rgb(223 109 11);
    opacity: 0.85;
    color: #fff;
    padding: 1px 10px;
}

.type_CHar .chReple:hover {
    opacity: 1;
    cursor: pointer;
}

.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    width: 100px;
    height: 100px;
}

.avatar-uploader_small {
    height: 100px;
}

.avatar-uploader .el-upload:hover {
    border-color: #409eff;
}

.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: center;
}

.avatar-uploader_small .el-upload {
    width: 80px;
    height: 80px;
}

.avatar-uploader_small .avatar-uploader-icon {
    line-height: 80px;
    margin-left: -30px;
}

.avatar {
    width: 120px;
    height: 120px;
    display: block;
}
.unfetteredBox {
    display: flex;
    flex-wrap: wrap;

    padding: 0;
    box-sizing: border-box;
}
.unfetteredBox .image {
    margin-top: 10px;
    box-shadow: rgba(16, 17, 19, 0.5) 0px 1px 3px;
    margin-right: 10px;
    height: 60px;
    width: 60px;
    border-radius: 4px;

    overflow: hidden;
}

::v-deep .wordTableHtml table span blue {
    color: rgb(0, 130, 170) !important;
}
::v-deep .wordTableHtml table span blue sup {
    color: rgb(0, 130, 170) !important;
}
::v-deep .wordTableHtml table span blue sub {
    color: rgb(0, 130, 170) !important;
}
.toolbar {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: #fff;
    border-bottom: none;
    box-shadow: 0 2px 2px -2px rgba(34, 47, 62, 0.1), 0 8px 8px -4px rgba(34, 47, 62, 0.07);
    padding: 4px 0;
    height: 50px;
    box-sizing: border-box;
    transition: box-shadow 0.5s;

    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 2;
}
.toolbar .toolbar_item {
    width: auto;
    color: #767c82;
    font-size: 14px;
    padding: 0 11px 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    line-height: 24px;
    background-color: #fff;
}

.toolbar .toolbar_item img {
    width: 24px;
    height: 24px;
    margin-right: 6px;
    margin-top: -2px;
}
::v-deep .el-dialog__body {
    padding: 10px 20px !important;
}
.editFormPizhu {
    display: flex;
    margin-bottom: 20px;
}
.editFormPizhu img {
    margin-right: 10px;
}
.go-content-box {
    background-color: #f2f3f5;
}
.commentList {
    width: 350px !important;

    padding: 15px;
    position: relative;
    box-sizing: border-box;
    /* background-color: #fafafa; */
    background-color: #fafafa;
    box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
}

/* 为整个页面的滚动条设置样式 */
::-webkit-scrollbar {
    width: 8px; /* 垂直滚动条的宽度 */
    height: 8px; /* 水平滚动条的高度 */
}

/* 滚动条轨道样式 */
::-webkit-scrollbar-track {
    background: #f1f1f1; /* 滚动条轨道颜色 */
    border-radius: 10px; /* 轨道圆角 */
}

/* 滚动条滑块样式 */
::-webkit-scrollbar-thumb {
    background: #888; /* 滚动条滑块颜色 */
    border-radius: 10px; /* 滑块圆角 */
}

/* 滑块在悬停时的样式 */
::-webkit-scrollbar-thumb:hover {
    background: #555; /* 滑块悬停时的颜色 */
}
.uploadWordTableBox {
    width: 38vw;
    position: relative;
    height: auto;
    overflow: hidden;
    padding: 10px;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px 0px;
}
::v-deep .el-drawer__header {
    margin-bottom: 0;
    padding: 15px;
}
.uploadWordTableBox .insertTable {
    /* display: none; */
    position: absolute;
    right: 10px;
}
.uploadWordTableBox:hover {
    background-color: #0066990d;
    /* display: block !important; */
}
wmath[data-wrap='inline'] {
    display: inline-block !important;
    width: auto !important;
}
</style>
