Merge branch 'master' of https://git.nuttyreading.com/wangjinlei/tougao_web into Editorial-Board

src/api/index.js

@@ -19,8 +19,8 @@ const service = axios.create({
 	// baseURL: 'https://submission.tmrjournals.com/', //正式 记得切换
 	// baseURL: 'http://www.tougao.com/', //测试本地 记得切换
 	// baseURL: 'http://192.168.110.110/tougao/public/index.php/',
-	// baseURL: '/api', //本地
-	baseURL: '/', //正式
+	baseURL: '/api', //本地
+	// baseURL: '/', //正式
 
 });
 

src/common/js/commonJS.js

@@ -243,7 +243,9 @@ export default {
             str = str.replace(regex, function (match) {
                 // 提取出方括号中的内容，并进行匹配
                 const content = match.slice(1, match.length - 1);  // 去掉方括号
-
+                // 这个需要程序去判断所以需要告诉我满足哪些条件的标蓝
+                // 上标中 只有 * # & 纯数字 纯数字逗号 纯数字逗号和空格 ỻ  标蓝
+                
                 // 判断是否符合条件，纯数字、逗号后有空格、连字符
                 if (/^\d+$/.test(content) || /, ?/.test(content) || /–/.test(content)) {
                     return `<blue>${match}</blue>`; // 如果符合条件则加上蓝色标签

src/components/common/Header2.vue

@@ -113,7 +113,8 @@ export default {
             day: '0',
             hour: '00',
             min: '00',
-            second: '00'
+            second: '00',
+           
         };
     },
     created() {

src/components/common/Home.vue

@@ -22,7 +22,7 @@
             </template>
             <template v-else>
                 <v-head2 :home="true"></v-head2>
-                <div style="width: 100%; height: calc(100% - 42px); overflow: hidden">
+                <div style="width: 100%; height: calc(100% - 42px); overflow: hidden" :style="{background: bgColor}">
                     <div class="content" style="padding: 0; overflow: hidden">
                         <!-- <transition name="move" mode="out-in"> -->
                         <!-- <keep-alive :include="tagsList"> -->
@@ -56,6 +56,7 @@ import bus from './bus';
 export default {
     data() {
         return {
+            bgColor: this.$route.meta.bgColor || '#fff',
             tagsList: [],
             collapse: false
         };

src/components/common/common.vue

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

src/components/page/Complete_profile.vue

@@ -156,11 +156,14 @@
                     >
                 </h4>
                 <p style="color: #505050; font-size: 14px; padding: 20px; box-sizing: border-box">
-                    <i class="el-icon-warning" style="color: #517fd5; margin-right: 8px"></i> A total of
-                    <i class="tip">{{ Ainfo.refer_state.num }}</i> references in this manuscript is identified.
+                    <template v-if="Ainfo.refer_state.num==0">
+                        <i class="el-icon-warning" style="color:  #e6a23c; margin-right: 8px"></i>Please wait patiently while the Editorial Office processes the references.
+                    </template>
+                    <template v-else>  <i class="el-icon-warning" style="color: #517fd5; margin-right: 8px"></i> Please review and revise the reference formatting.</template>
+                  
                 </p>
 
-                <p style="color: #505050; font-size: 14px; padding: 0 20px 20px; box-sizing: border-box">
+                <p style="color: #505050; font-size: 14px; padding: 0 20px 20px; box-sizing: border-box" v-if="Ainfo.refer_state.num>0" >
                     <el-button @click="goAddReferences(thisArtcleId)" icon="el-icon-edit" type="text">Edit</el-button>
                 </p>
                 <!-- <div v-else style="padding: 20px; box-sizing: border-box"></div> -->

src/components/page/OnlineProofreading.vue

@@ -19,7 +19,7 @@
                         ref="commonWordHtmlTypeSetting"
                         @onDragStart="onDragStart"
                         @huifu="huifu"
-                        :catalogueList="catalogueList"
+                        :catalogueList="tableData"
                         @onAddComment="onAddComment"
                         @addImage="handleImageAdd"
                         @addTable="handleTableAdd"
@@ -35,11 +35,13 @@
                 </div>
             </div>
             <div style="" class="right-content-box">
-                <!-- title -->
-                <div v-for="(item, index) in catalogueList" :key="index">
-                    <h1 :class="`title${item.key}`">{{ item.title }}</h1>
-                    
-                </div>
+          
+                    <common-reference 
+                        
+                        ref="commonReference1"
+                        :tableData="tableData"
+                       
+                        ></common-reference>
                 <!-- <common-word
                     v-if="htmlContent"
                     ref="commonWord"
@@ -361,6 +363,7 @@
 
 <script>
 import commonCatalogue from '@/components/page/components/OnlineProofreading/catalogue.vue';
+import commonReference from '@/components/page/components/OnlineProofreading/reference.vue';
 
 import bus from '@/components/common/bus';
 import { del, isShallow } from 'vue';
@@ -371,15 +374,15 @@ import bottomTinymce from '@/components/page/components/Tinymce';
 export default {
     data() {
         return {
-            catalogueList: [
-                { title: 'Title ', key: '1' },
-                { title: 'Author name', key: '2' },
-                { title: 'Affialition', key: '3' },
-                { title: 'Abstract & Keywords', key: '4' },
-                { title: 'Main text', key: '5' },
-                { title: 'Back Matter', key: '6' },
-                { title: 'Editorial inforation', key: '7' },
-                { title: 'Reference ', key: '8' },
+            tableData: [
+                // { title: 'Title ', key: '1' },
+                // { title: 'Author name', key: '2' },
+                // { title: 'Affialition', key: '3' },
+                // { title: 'Abstract & Keywords', key: '4' },
+                // { title: 'Main text', key: '5' },
+                // { title: 'Back Matter', key: '6' },
+                // { title: 'Editorial inforation', key: '7' },
+                // { title: 'Reference ', key: '8' },
             ],
             zoomNum: (window.innerWidth * 0.38) / 850,
             uploadWordTables: [],
@@ -504,7 +507,8 @@ export default {
     components: {
         Tinymce,
         bottomTinymce,
-        commonCatalogue
+        commonCatalogue,
+        commonReference
     },
     computed: {
         combinedValue() {
@@ -537,6 +541,7 @@ export default {
         localStorage.removeItem('scrollPosition');
         this.isShowEditComment();
         this.getDate();
+        this.getRefData();
         this.getCommentList();
         // this.loadDictionary().catch(console.error);
     },
@@ -545,10 +550,26 @@ export default {
        
         this.isShowEditComment();
         this.getDate();
+        this.getRefData();
         this.getCommentList();
     },
 
     methods: {
+          // 获取引用文献信息
+          getRefData() {
+            this.$api
+                .post('api/Preaccept/getArticleReferences', { article_id: this.$route.query.id })
+                .then((res) => {
+                    console.log(res);
+                    if (res.code == 0 && res.data.refers.length > 0) {
+                        this.tableData = res.data.refers;
+                    }
+                  
+                })
+                .catch((err) => {
+                    console.log(err);
+                });
+        },
         async copyArray(data) {
             try {
                
@@ -793,19 +814,14 @@ export default {
 
         // 编辑评论，显示文本框
         goToListComment(id, type) {
-            var am_id;
-            if (type == 'img') {
-                am_id = this.Main_List.find((item) => item.ami_id == id).am_id;
-            } else {
-                am_id = this.Main_List.find((item) => item.amt_id == id).am_id;
-            }
-            if (am_id) {
-                this.goToComment(am_id);
-            }
+       
+           
+                this.goToComment(id);
+    
         },
         goToComment(mainId) {
             this.$nextTick(() => {
-                this.$refs.commonWord.goToComment(mainId);
+                this.$refs.commonReference1.goToComment(mainId);
             });
         },
         getTables(tables, html) {
@@ -1866,7 +1882,7 @@ export default {
                 box-sizing: border-box;
 }
 .right-side{
-    width: 240px;
+    width: 280px;
                     float: left;
                     height: 100%;
                     background-color: #fff;
@@ -1875,7 +1891,7 @@ export default {
                     overflow-y: auto;
 }
 .right-content-box{
-    width: 100%; width: calc(100% - 245px); float: right; height: calc(100% - 0px); background-color: #e4e9ed
+    width: 100%; width: calc(100% - 285px); float: right; height: calc(100% - 0px); background-color: #e4e9ed
 }
 .lineStyle {
     border-top: 1px solid #0066994d;

src/components/page/PreIngestedEditor.vue

@@ -1,8 +1,6 @@
 <template>
-    <div>
+    <div style="width: 100%; height: 100%">
         <div class="tab_post">
-           
-    
             <div v-for="(item, index) in tabsList" @click="jumpTab(index, item)" :class="tabName == item.refName ? 'P_style' : ''">
                 <h5>
                     <span>{{ index + 1 }}</span>
@@ -59,262 +57,73 @@
             </div>
         </div>
 
-        <div
-            class="scroll-content guanSty"
-            @scroll="onScroll"
-            :style="'overflow-x: hidden; overflow-y: auto;height:' + contentStyleObj.height"
-        >
-            <!-- 基本信息 -->
-
-            <!-- 作者列表 -->
-
-            <!-- 文件上传 -->
-
-            <!-- 文章正文 -->
-
-            <!-- 参考文献 -->
+        <div class="scroll-content guanSty" @scroll="onScroll" :style="'height: calc(100%);overflow: auto;'">
             <div :ref="tabsList[0].refName" class="scroll-item">
-                <div class="bor_style_onli" style="height: auto;max-height: 700px;">
+                <div class="bor_style_onli" style="height: auto; overflow: hidden">
                     <h4>{{ tabsList[0].name }}</h4>
                     <div style="" class="payment_info_box">
-               
-                   
-                    <div class="payment_info" style="width: 100%"
-                                ><el-table :data="tableData" style="width: 100%" align="center">
-                                    <el-table-column prop="fee" :label="$t('pendingPayment.total')" width="150px">
-                                        <template slot-scope="scope"> {{ scope.row.original_price }} USD </template>
-                                    </el-table-column>
-                                    <el-table-column :label="$t('pendingPayment.discountprice')" width="200px">
-                                        <template slot-scope="scope"> {{ scope.row.fee }} USD <span style="cursor: pointer;color:#006699;margin-left: 10px;" v-if="feeStatus == 0"  @click="handleEditFee"><i class="el-icon-edit"></i> Edit</span></template>
-                                    </el-table-column>
-                                    <!-- <el-table-column prop="name" :label="$t('pendingPayment.Paymentamount')">
-                                        <template slot-scope="scope"> 
-                                            
-                                            </template>
-                                    </el-table-column> -->
-                                    <el-table-column :label="$t('pendingPayment.youhuiremark')">
-                                        <template slot-scope="scope"> 
-                                            <p > <span class="remark">{{ article_pay_info.fee_remark }}</span>
-                           </p>
-                                            </template>
-                                    </el-table-column>
+                        <div class="payment_info" style="width: 100%">
+                            <el-table :data="tableData" style="width: 100%" align="center">
+                                <el-table-column prop="fee" :label="$t('pendingPayment.total')" width="150px">
+                                    <template slot-scope="scope"> {{ scope.row.original_price }} USD </template>
+                                </el-table-column>
+                                <el-table-column :label="$t('pendingPayment.discountprice')" width="200px">
+                                    <template slot-scope="scope">
+                                        {{ scope.row.fee }} USD
+                                        <span
+                                            style="cursor: pointer; color: #006699; margin-left: 10px"
+                                            v-if="feeStatus == 0"
+                                            @click="handleEditFee"
+                                            ><i class="el-icon-edit"></i> Edit</span
+                                        ></template
+                                    >
+                                </el-table-column>
 
-                                    <el-table-column prop="" :label="$t('pendingPayment.Paymentstatus')">
-                                        <template slot-scope="scope">
-                                            <span v-if="feeStatus == 0" style="color: #f56c6c"
-                                                ><b>Manuscript unpaid</b></span
-                                            >
-                                            <span v-if="feeStatus == 1" style="color: #67c23a"
-                                                ><b>Paid already</b></span
-                                            >
-                                            <span v-if="feeStatus == 2" style="color: #67c23a"
-                                                ><b>No payment required</b></span
-                                            >
-                                          
-                                               </template>
-                                    </el-table-column>
-                                    <el-table-column prop="" :label="$t('pendingPayment.Paymentamount')"  v-if="feeStatus == 1">
-                                        <template slot-scope="scope">
-                                            
-                                            <p v-if="article_pay_info.paystation_fee"> <span class="price">{{ formatAmount(Number(article_pay_info.paystation_fee / 100)) }}</span>
-                            {{ article_pay_info.paystation_currency }}</p>
-                                        
-                                               </template>
-                                    </el-table-column>
-                                    <el-table-column prop="" :label="$t('pendingPayment.time')" v-if="feeStatus == 1">
-                                        <template slot-scope="scope">
-                                            
-                                         
-                                          <p><span style="color: #888">{{ article_pay_info.paystation_time ? article_pay_info.paystation_time : 'unknown' }}</span>
-                                     </p>
-                                               </template>
-                                    </el-table-column>
-                                </el-table>
-                              </div
-                            >
-                
-               
-            </div>
+                                <el-table-column :label="$t('pendingPayment.youhuiremark')">
+                                    <template slot-scope="scope">
+                                        <p>
+                                            <span class="remark">{{ article_pay_info.fee_remark }}</span>
+                                        </p>
+                                    </template>
+                                </el-table-column>
+
+                                <el-table-column prop="" :label="$t('pendingPayment.Paymentstatus')">
+                                    <template slot-scope="scope">
+                                        <span v-if="feeStatus == 0" style="color: #f56c6c"><b>Manuscript unpaid</b></span>
+                                        <span v-if="feeStatus == 1" style="color: #67c23a"><b>Paid already</b></span>
+                                        <span v-if="feeStatus == 2" style="color: #67c23a"><b>No payment required</b></span>
+                                    </template>
+                                </el-table-column>
+                                <el-table-column prop="" :label="$t('pendingPayment.Paymentamount')" v-if="feeStatus == 1">
+                                    <template slot-scope="scope">
+                                        <p v-if="article_pay_info.paystation_fee">
+                                            <span class="price">{{ formatAmount(Number(article_pay_info.paystation_fee / 100)) }}</span>
+                                            {{ article_pay_info.paystation_currency }}
+                                        </p>
+                                    </template>
+                                </el-table-column>
+                                <el-table-column prop="" :label="$t('pendingPayment.time')" v-if="feeStatus == 1">
+                                    <template slot-scope="scope">
+                                        <p>
+                                            <span style="color: #888">{{
+                                                article_pay_info.paystation_time ? article_pay_info.paystation_time : 'unknown'
+                                            }}</span>
+                                        </p>
+                                    </template>
+                                </el-table-column>
+                            </el-table>
+                        </div>
+                    </div>
                 </div>
             </div>
             <div :ref="tabsList[1].refName" class="scroll-item">
-                <div class="bor_style_onli">
+                <div class="bor_style_onli bor_style_onli_ref">
                     <h4>{{ tabsList[1].name }}</h4>
-                    <div class="liter_ture" v-if="0 == 2">
-                        <div class="chanSelLef">
-                            <!-- 1 -->
-                            <div :class="showB_step == 1 ? 'C_style' : ''">
-                                <h3><span>1</span>Check References and Doi</h3>
-                                <div v-if="showB_step == 1">
-                                    <p>
-                                        You need to click
-                                        <el-button
-                                            type="warning"
-                                            @click="StepBOper(1)"
-                                            size="mini"
-                                            style="padding: 5px 8px; font-size: 12px; margin: 0 5px"
-                                        >
-                                            <i class="el-icon-edit-outline"></i>
-                                            Crossref
-                                        </el-button>
-                                         to open the website, then paste the references part of the
-                                        <a :href="mediaUrl + this.gridData" target="_blank">
-                                            <el-button type="text" size="mini" style="font-size: 12px; margin: 0 5px; font-weight: bold">
-                                                <i class="el-icon-download" style="font-weight: bold"></i>
-                                                manuscript
-                                            </el-button>
-                                        </a>
-
-                                        to get the new references part, please paste the new one into the input box.
-                                    </p>
-                                    <el-button
-                                        @click="StepBNext(2)"
-                                        plain
-                                        type="primary"
-                                        style="width: 85%; margin: 15px 0px 0px 30px; position: relative"
-                                    >
-                                        <i class="el-icon-right" style="font-size: 18px; position: absolute; right: 8px; top: 5px"></i>
-                                        Next Step
-                                    </el-button>
-                                </div>
-                            </div>
-
-                            <!-- 2 -->
-                            <div :class="showB_step == 2 ? 'C_style' : ''">
-                                <h3><span>2</span>Check Standard</h3>
-                                <div v-if="showB_step == 2">
-                                    <p>Convert to standard format.</p>
-                                    <p style="background-color: #fdf3e3; padding: 10px; margin: 10px 0 0 30px">
-                                        The references with yellow background are problematic, so you can check and correct them yourself.
-                                    </p>
-                                    <el-button
-                                        @click="StepBNext(1)"
-                                        type="primary"
-                                        plain
-                                        style="width: 85%; margin: 15px 0px 0px 30px; position: relative"
-                                    >
-                                        <i
-                                            class="el-icon-back"
-                                            style="font-size: 18px; margin: 0; position: absolute; left: 8px; top: 5px"
-                                        ></i>
-                                        Back Step and Reset
-                                    </el-button>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="chanFerAll">
-                            <div v-if="showB_step == 1">
-                                <el-input
-                                    v-model="refAarray"
-                                    type="textarea"
-                                    rows="20"
-                                    style="width: 100%"
-                                    :placeholder="placeRef"
-                                ></el-input>
-                                <el-button type="primary" @click="StepBOper(2)" style="width: 250px; margin: 20px 0 0 0; float: right">
-                                    <i class="el-icon-document-checked"></i>
-                                    Complete and conversion
-                                </el-button>
-                                <br clear="both" />
-                            </div>
-
-                            <div v-for="(item, index) in this.chanFerForm" v-if="showB_step == 2" class="ref_list">
-                                <div>
-                                    <span style="float: left; margin: 3px 10px 0 0; width: 80px; text-align: right; font-size: 14px"
-                                        >DOI :</span
-                                    >
-                                    <p style="float: left; font-size: 14px; color: #555">{{ item.refer_doi }}</p>
-                                    <br clear="both" />
-                                </div>
-                                <div v-if="item.cs == 1 && item.edit_mark != 0" style="margin-bottom: 0">
-                                    <span style="float: left; margin: 0 12px 0 0; width: 80px; text-align: right; font-size: 14px"
-                                        >Standard :</span
-                                    >
-                                    <p
-                                        v-if="item.author == ''"
-                                        style="float: left; width: 74.5%; font-size: 14px; color: #555; line-height: 20px"
-                                    >
-                                        {{ item.refer_frag }}
-                                    </p>
-                                    <p
-                                        v-if="item.author != ''"
-                                        style="float: left; width: 74.5%; font-size: 14px; color: #555; line-height: 20px"
-                                    >
-                                        {{ item.author }} {{ item.title }} {{ item.joura }}{{ item.dateno }}. Available at:
-                                        {{ item.doilink }}
-                                    </p>
-                                    <br clear="both" />
-                                </div>
-                                <div
-                                    v-if="item.cs == 0 || item.edit_mark == 0"
-                                    :class="item.cs == 0 ? 'BG_yell' : ''"
-                                    style="margin-bottom: 0"
-                                >
-                                    <span style="float: left; margin: 0 12px 0 0; width: 80px; text-align: right; font-size: 14px"
-                                        >Standard :</span
-                                    >
-                                    <el-input
-                                        type="textarea"
-                                        v-model="item.refer_frag"
-                                        autosize
-                                        style="width: 60%; display: inline-block"
-                                    ></el-input>
-
-                                    <div style="display: inline-block; width: 50px; vertical-align: top">
-                                        <el-button
-                                            @click="ChanFerEditFrag(item, index)"
-                                            type="primary"
-                                            icon="el-icon-check"
-                                            size="mini"
-                                            style="margin: 0 5px 0 15px"
-                                        >
-                                        </el-button>
-                                        <el-button
-                                            @click="ChanFerMashUp(item)"
-                                            type="warning"
-                                            size="mini"
-                                            style="margin: 10px 5px 0 15px"
-                                            v-if="index != 0"
-                                            >Up</el-button
-                                        >
-                                    </div>
-                                </div>
-                                <b>{{ index + 1 }}</b>
-                                <i
-                                    class="el-icon-edit-outline"
-                                    @click="referMark(index)"
-                                    v-if="item.edit_mark == 1 && item.cs != 0 && item.author == ''"
-                                ></i>
-                                <i
-                                    class="el-icon-top"
-                                    @click="ChanFerMashUp(item)"
-                                    v-if="index != 0 && item.edit_mark == 1 && item.cs != 0"
-                                    style="right: 40px; font-size: 10px"
-                                    >up</i
-                                >
-                            </div>
-                        </div>
-                        <br clear="both" />
-                        <!-- <p v-if="this.chanFerForm==''" style="text-align: center;color: #999;margin-top: 50px;">No references</p> -->
-                        <!-- 进度条 -->
-                        <div v-if="refProcess == 1" class="RefProBar">
-                            <div>
-                                <el-progress
-                                    :text-inside="true"
-                                    :stroke-width="24"
-                                    :percentage="refReal"
-                                    :color="customColorMethod"
-                                ></el-progress>
-                                <p>
-                                    <img src="../../assets/img/Ip_spinner.gif" />
-                                    <span>{{ this.refReal }}%</span> completed, please wait...
-                                </p>
-                            </div>
-                        </div>
-                    </div>
+                    
                     <editPublicRefRdit
                         ref="editPublicRefRdit"
                         :chanFerForm="chanFerForm"
+                        :chanFerFormRepeatList="chanFerFormRepeatList"
                         :gridData="gridData"
                         :p_article_id="p_article_id"
                         @ChanFerMashUp="ChanFerMashUp"
@@ -433,11 +242,10 @@
             </div>
         </el-dialog>
         <el-dialog :title="`Edit`" :visible.sync="finalFeeVisible" width="600px" :close-on-click-modal="false">
-            <el-form ref="finalFee"   :rules="rules" :model="finalFeeData" label-width="180px">
-                
+            <el-form ref="finalFee" :rules="rules" :model="finalFeeData" label-width="180px">
                 <el-form-item :label="$t('pendingPayment.discountprice')" prop="fee" clearable>
                     <!-- <commonRemarkList :list="remark.contentList" @load="(e) => (this.remark.contentList = e)"></commonRemarkList> -->
-                    <el-input  v-model="finalFeeData.fee"> <span slot="suffix" >USD</span></el-input>
+                    <el-input v-model="finalFeeData.fee"> <span slot="suffix">USD</span></el-input>
                 </el-form-item>
                 <el-form-item :label="$t('pendingPayment.youhuiremark')" prop="fee_remark">
                     <!-- <commonRemarkList :list="remark.contentList" @load="(e) => (this.remark.contentList = e)"></commonRemarkList> -->
@@ -449,7 +257,6 @@
                 <el-button type="primary" @click="saveFinalFee">Save</el-button>
             </span>
         </el-dialog>
-     
     </div>
 </template>
 
@@ -465,9 +272,7 @@ export default {
     props: ['type'],
     data() {
         return {
-            finalFeeData:{
-
-            },
+            finalFeeData: {},
             article_pay_info: {},
             feeStatus: null,
             isShowCommit: false,
@@ -710,6 +515,7 @@ export default {
             editFomschool: {},
 
             chanFerForm: [],
+            chanFerFormRepeatList: [],
             refProcess: 0,
             refReal: 0,
             refAarray: '',
@@ -753,16 +559,20 @@ export default {
             deAuthorYul: {},
             deMesYul: {},
             rules: {
-                fee: [{
-						required: true,
-						message: 'Please enter the final price after discount',
-						trigger: 'blur'
-					}],
-                fee_remark: [{
-						required: true,
-						message: 'Please enter the discount description',
-						trigger: 'blur'
-					}],
+                fee: [
+                    {
+                        required: true,
+                        message: 'Please enter the final price after discount',
+                        trigger: 'blur'
+                    }
+                ],
+                fee_remark: [
+                    {
+                        required: true,
+                        message: 'Please enter the discount description',
+                        trigger: 'blur'
+                    }
+                ]
             }
         };
     },
@@ -774,18 +584,21 @@ export default {
         // this.getData();
         this.getArtcleDetails();
         this.getTalkList();
-        // this.getAuthorJG();
-        // this.getCount();
-        // this.getWorldPdf();
+      
     },
     activated() {
+        this.opMedical = this.$commonJS.opMedicalList();
         this.getPreacceptPayment();
+        this.getHight();
+        window.addEventListener('resize', this.getHight);
+        // this.getData();
+        this.getArtcleDetails();
+        this.getTalkList();
     },
     methods: {
-        saveFinalFee(){
+        saveFinalFee() {
             this.$refs.finalFee.validate((valid) => {
                 if (valid) {
-
                     const integerRegex = /^-?\d+$/;
                     if (!integerRegex.test(this.finalFeeData.fee)) {
                         this.$message.error('Please enter a valid integer for the final price after discount');
@@ -793,47 +606,45 @@ export default {
                     }
 
                     const load = this.$loading({
-                lock: true,
-                text: 'Loading...',
-                spinner: 'el-icon-loading',
-                background: 'rgba(0, 0, 0, 0.7)'
-            }); 
+                        lock: true,
+                        text: 'Loading...',
+                        spinner: 'el-icon-loading',
+                        background: 'rgba(0, 0, 0, 0.7)'
+                    });
                     this.$api
-                .post('api/Order/changePrice', {
-                    article_id: this.$route.query.id,
-                    editor_id: localStorage.getItem('U_id'),
-                    fee: Number(this.finalFeeData.fee).toFixed(2),
-                    fee_remark: this.finalFeeData.fee_remark,
-                })
-                .then((res) => { load.close()
-                	
-                    if(res.code==0){
-                        this.finalFeeVisible=false
-                   this.getPreacceptPayment()
-                    }else{
-                        this.$message.error(res.msg)
-                    }
-                   
-                })
-                .catch((err) => {
-                    load.close()
-                    console.log(err);
-                });
-                }else{
-                    return false
+                        .post('api/Order/changePrice', {
+                            article_id: this.$route.query.id,
+                            editor_id: localStorage.getItem('U_id'),
+                            fee: Number(this.finalFeeData.fee).toFixed(2),
+                            fee_remark: this.finalFeeData.fee_remark
+                        })
+                        .then((res) => {
+                            load.close();
+
+                            if (res.code == 0) {
+                                this.finalFeeVisible = false;
+                                this.getPreacceptPayment();
+                            } else {
+                                this.$message.error(res.msg);
+                            }
+                        })
+                        .catch((err) => {
+                            load.close();
+                            console.log(err);
+                        });
+                } else {
+                    return false;
                 }
-            })
+            });
         },
-        handleEditFee(){
+        handleEditFee() {
             this.finalFeeVisible = true;
-           this.finalFeeData={
-            fee:this.article_pay_info.fee?Number(this.article_pay_info.fee).toFixed(0):0,
-            fee_remark:this.article_pay_info.fee_remark
-           }
-          
-           
+            this.finalFeeData = {
+                fee: this.article_pay_info.fee ? Number(this.article_pay_info.fee).toFixed(0) : 0,
+                fee_remark: this.article_pay_info.fee_remark
+            };
         },
-       
+
         formatAmount(amount) {
             return amount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
         },
@@ -910,27 +721,26 @@ export default {
                     console.log('res at line 191:', res);
                     if (res.code == 0) {
                         this.article_pay_info = {
-                            fee: res.data.article.fee,
-                            is_buy: res.data.article.is_buy,
-                            original_price: res.data.journal.fee,
-                            fee_remark: res.data.article.fee_remark,
+                            fee: res.data.article ? res.data.article.fee : 0,
+                            is_buy: res.data.article ? res.data.article.is_buy : 0,
+                            original_price: res.data.journal ? res.data.journal.fee : 0,
+                            fee_remark: res.data.article ? res.data.article.fee_remark : '',
                             order: res.data.order,
-                            paystation_fee: res.data.order&&res.data.order.paystation ? res.data.order.paystation.amount : '',
-                            paystation_time: res.data.order&&res.data.order.paystation ? res.data.order.paystation.request_time : '',
-                            paystation_currency: res.data.order&&res.data.order.paystation ? res.data.order.paystation.currency : ''
+                            paystation_fee: res.data.order && res.data.order.paystation ? res.data.order.paystation.amount : '',
+                            paystation_time: res.data.order && res.data.order.paystation ? res.data.order.paystation.request_time : '',
+                            paystation_currency: res.data.order && res.data.order.paystation ? res.data.order.paystation.currency : ''
                         };
-                        
+
                         if (this.article_pay_info.is_buy == 1) {
-                           
-                            if (this.article_pay_info.fee == 0) {
+                            if (Number(this.article_pay_info.fee) == 0) {
                                 this.feeStatus = 2;
-                            }else{
+                            } else {
                                 this.feeStatus = 1;
                             }
                         } else {
                             this.feeStatus = 0;
                         }
-this.tableData=[{...this.article_pay_info}]
+                        this.tableData = [{ ...this.article_pay_info }];
                         this.feeStatus = res.data.state;
                         this.isShowCommit = res.data.state == 1 ? true : false;
                         console.log(this.isShowCommit);
@@ -993,20 +803,7 @@ this.tableData=[{...this.article_pay_info}]
                             this.fileL_Icm[0].url = this.mediaUrl + 'articleCDF/' + res.data.production.file_cdf;
                         }
 
-                        // if (this.detailMes.main != '') {
-                        // 	this.detailMes.main = JSON.parse(this.detailMes.main)
-                        // 	if (typeof(this.detailMes.main) != 'object') {
-                        // 		this.detailMes.main = eval("(" + this.detailMes.main + ")")
-                        // 	}
-                        // }
-
-                        // this.Main_List = []
-                        // for (let i = 0; i < this.detailMes.main.length; i++) {
-                        // 	this.Main_List.push({
-                        // 		name: this.detailMes.main[i],
-                        // 		value: i,
-                        // 	})
-                        // }
+                      
 
                         this.CSonline();
 
@@ -1039,7 +836,7 @@ this.tableData=[{...this.article_pay_info}]
                                 console.log(err);
                             });
 
-                        loading.close();
+                       
                     } else {
                         this.$message.error(res.msg);
                         loading.close();
@@ -1049,14 +846,16 @@ this.tableData=[{...this.article_pay_info}]
                     this.$message.error(err);
                     loading.close();
                 });
-
+             
             // 获取参考文献
             this.$api
                 .post('api/Production/getReferList', {
                     p_article_id: this.p_article_id
                 })
-                .then((res) => {
+                .then((res) => { loading.close();
                     this.chanFerForm = res.data.refers;
+                    this.chanFerFormRepeatList = Object.values(res.data.repeat);
+                    
                     for (var i = 0; i < this.chanFerForm.length; i++) {
                         this.chanFerForm[i].edit_mark = 1;
                         if (this.chanFerForm[i].refer_frag != '') {
@@ -1065,10 +864,14 @@ this.tableData=[{...this.article_pay_info}]
                     }
                     this.$nextTick(() => {
                         // 更新引用列表
-                        this.$refs.editPublicRefRdit.init(this.chanFerForm);
+                        if(this.$refs.editPublicRefRdit){
+                               this.$refs.editPublicRefRdit.init(this.chanFerForm);
+                        }
+                     
                     });
                 })
                 .catch((err) => {
+                    loading.close();
                     console.log(err);
                 });
 
@@ -1478,12 +1281,13 @@ this.tableData=[{...this.article_pay_info}]
         //5----按钮每一步操作
         StepBOper(e) {
             if (e == 1) {
+                window.open(`/References`, '_blank', 'width=1000,height=800,scrollbars=no,resizable=no');
                 // 弹出新的页面粘贴DOI
-                window.open(
-                    'https://apps.crossref.org/SimpleTextQuery',
-                    '_blank',
-                    'width=900,height=600,toolbar=no,scrollbars=no,menubar=no,screenX=240,screenY=100'
-                );
+                // window.open(
+                //     'https://apps.crossref.org/SimpleTextQuery',
+                //     '_blank',
+                //     'width=900,height=600,toolbar=no,scrollbars=no,menubar=no,screenX=240,screenY=100'
+                // );
             } else if (e == 2) {
                 // 发送转化为标准格式
                 let refAarray_list = [];
@@ -1563,6 +1367,7 @@ this.tableData=[{...this.article_pay_info}]
                 })
                 .then((res) => {
                     this.chanFerForm = res.data.refers;
+                    this.chanFerFormRepeatList = Object.values(res.data.repeat);
                     for (var i = 0; i < this.chanFerForm.length; i++) {
                         this.chanFerForm[i].edit_mark = 1;
                     }
@@ -2142,37 +1947,37 @@ this.tableData=[{...this.article_pay_info}]
             //     type: 'warning'
             // })
             //     .then(() => {
-                    const load = this.$loading({
-                        lock: true,
-                        text: 'Loading...',
-                        spinner: 'el-icon-loading',
-                        background: 'rgba(0, 0, 0, 0.7)'
-                    });
-                    this.$api
-                        .post('api/Preaccept/beginProduce', {
-                            article_id: this.$route.query.id
-                        })
-                        .then((res) => {
-                            if (res.code == 0) {
-                                load.close();
-                                // this.$message.success('successed!');
-                                // setTimeout(() => {
-                                //     localStorage.setItem('U_point', 2);
-                                //     this.$router.push({
-                                //         path: 'articleListEditor'
-                                //     });
-                                // }, 1000);
-                            } else {
-                                load.close();
-                                this.$message.error(res.msg);
-                            }
-                        })
-                        .catch((err) => {
-                            load.close();
-                            this.$message.error(err);
-                        });
-                // })
-                // .catch(() => {});
+            const load = this.$loading({
+                lock: true,
+                text: 'Loading...',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.7)'
+            });
+            this.$api
+                .post('api/Preaccept/beginProduce', {
+                    article_id: this.$route.query.id
+                })
+                .then((res) => {
+                    if (res.code == 0) {
+                        load.close();
+                        // this.$message.success('successed!');
+                        // setTimeout(() => {
+                        //     localStorage.setItem('U_point', 2);
+                        //     this.$router.push({
+                        //         path: 'articleListEditor'
+                        //     });
+                        // }, 1000);
+                    } else {
+                        load.close();
+                        this.$message.error(res.msg);
+                    }
+                })
+                .catch((err) => {
+                    load.close();
+                    this.$message.error(err);
+                });
+            // })
+            // .catch(() => {});
         },
         // 点击开始上线显示
         pushOnline(detailMes) {
@@ -2351,7 +2156,7 @@ this.tableData=[{...this.article_pay_info}]
     width: 260px !important;
 }
 .scroll-item {
-    margin: 0 30px 50px 276px;
+    margin: 10px 20px 20px 280px;
 }
 .payment_info_box {
     margin-bottom: 10px;
@@ -2403,10 +2208,11 @@ this.tableData=[{...this.article_pay_info}]
 
     color: #333 !important;
 }
-::v-deep .box-card  .el-table td.el-table__cell,
-::v-deep .box-card  .el-table th.el-table__cell.is-leaf {
+::v-deep .box-card .el-table td.el-table__cell,
+::v-deep .box-card .el-table th.el-table__cell.is-leaf {
     /* border-bottom: 1px solid #b0b0b0 !important; */
 }
+
 </style>
 <style>
 .talkDialog {
@@ -2439,8 +2245,8 @@ this.tableData=[{...this.article_pay_info}]
 .tab_post {
     background-color: #fafafa;
     position: absolute;
-    left: 25px;
-    top: 40px;
+    left: 15px;
+    top: 60px;
     /* width: 220px; */
     z-index: 50;
 }
@@ -2513,13 +2319,16 @@ this.tableData=[{...this.article_pay_info}]
 
 .bor_style_onli {
     height: 700px;
-    overflow-y: scroll;
+
     border: 2px solid #0066991a;
     background-color: #fff;
     border-radius: 5px;
     padding: 20px;
 }
-
+.bor_style_onli_ref {
+    height: auto;
+    min-height: calc(100vh - 40px - 270px);
+}
 .bor_style_onli > h4 {
     margin: 0 0 20px 0;
     letter-spacing: -0.5px;
@@ -2644,9 +2453,7 @@ this.tableData=[{...this.article_pay_info}]
 }
 
 .chanSelLef {
-    float: left;
-    width: 30%;
-    margin: 0 50px 0 0;
+    width: 100% !important;
 }
 
 .chanSelLef > p {
@@ -2692,12 +2499,6 @@ this.tableData=[{...this.article_pay_info}]
     background-color: #006699;
 }
 
-.chanFerAll {
-    float: left;
-    position: relative;
-    width: 61.5%;
-}
-
 .chanFerAll .chanFerBtn {
     cursor: pointer;
 }

src/components/page/PreIngestedEditorProduce.vue

@@ -179,6 +179,7 @@
                     <editPublicRefRdit
                         ref="editPublicRefRdit"
                         :chanFerForm="chanFerForm"
+                        :chanFerFormRepeatList="chanFerFormRepeatList"
                         :gridData="gridData"
                         :p_article_id="p_article_id"
                         @ChanFerMashUp="ChanFerMashUp"
@@ -540,6 +541,7 @@ export default {
             editFomschool: {},
 
             chanFerForm: [],
+            chanFerFormRepeatList: [],
             refProcess: 0,
             refReal: 0,
             refAarray: '',
@@ -958,6 +960,7 @@ export default {
                 })
                 .then((res) => {
                     this.chanFerForm = res.data.refers;
+                    this.chanFerFormRepeatList = Object.values(res.data.repeat);
                     for (var i = 0; i < this.chanFerForm.length; i++) {
                         this.chanFerForm[i].edit_mark = 1;
                         if (this.chanFerForm[i].refer_frag != '') {
@@ -1464,6 +1467,7 @@ export default {
                 })
                 .then((res) => {
                     this.chanFerForm = res.data.refers;
+                    this.chanFerFormRepeatList = Object.values(res.data.repeat);
                     for (var i = 0; i < this.chanFerForm.length; i++) {
                         this.chanFerForm[i].edit_mark = 1;
                     }

src/components/page/ReferenceEditor.vue

@@ -1,110 +1,27 @@
 <template>
     <div v-loading.fullscreen.lock="holeLoading">
         <div class="container" v-loading="importIoading" element-loading-text="In the process of importing, please wait">
-            <div v-if="tableData.length == 0">
-                <!-- 没有引用时 -->
-                <!-- <div class="noneData">            
-            <img src="../../assets/img/noneData.png" alt="" class="icon_img">
-            <p class="nodatatext">TMR did not identify an available article citation in your latest uploaded document</p>             
-          </div> -->
-                <el-row :gutter="20">
-                    <!-- 教程 -->
-                    <el-col>
-                        <div class="whoDo mt20">
-                            <div>
-                                <h2>
-                                    What should I do
-                                    <el-tooltip class="item" effect="light" content="click for more help" placement="right">
-                                        <span class="el-icon-warning-outline help" @click="showHelp"></span>
-                                    </el-tooltip>
-                                </h2>
-                                <p class="mt10 c666">you can add a citation in the following way.</p>
-                                <ul>
-                                    <!-- 文件上传的形式 -->
-                                    <li>
-                                        <div class="mt20">
-                                            <h4>
-                                                Add in bulk by uploading excel files &nbsp;&nbsp;
-                                                <!-- <el-button class="inlinebutton" type="primary" plain size="mini" @click="showUpload">Add</el-button> -->
-                                            </h4>
-                                            <p class="mt10 c666">
-                                                Before uploading the file, you need to download the template file,
-                                                <a
-                                                    href="https://submission.tmrjournals.com/public/system/refer.xlsx"
-                                                    download="refer"
-                                                    target="_blank"
-                                                    class="downloadbtn"
-                                                    >click download</a
-                                                >
-                                                ,to add your references to the template file, and upload it.
-                                            </p>
-                                            <div v-if="uploadVisible">
-                                                <div class="uploadBox">
-                                                    <el-upload
-                                                        ref="uploadFile"
-                                                        class="upload-demo up_newstyle mt10"
-                                                        :action="upload_manuscirpt"
-                                                        accept=".xlsx"
-                                                        name="referFile"
-                                                        :before-upload="beforeupload_manuscirpt"
-                                                        :on-error="uperr_coverLetter"
-                                                        :on-success="upSuccess_manuscirpt"
-                                                        :limit="1"
-                                                        :on-exceed="alertlimit"
-                                                        :on-remove="removefilemanuscirpt"
-                                                        :file-list="fileL_manuscirpt"
-                                                    >
-                                                        <div class="el-upload__text" @click="clearUploadedFile">
-                                                            <em>Upload</em>
-                                                        </div>
-                                                    </el-upload>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </li>
-                                    <!-- 文本域 -->
-                                    <!-- <li>
-                        <div class="mt20">
-                            <h4>Add in bulk by text field &nbsp;&nbsp;&nbsp;<el-button @click="addText" class="inlinebutton" type="primary" plain size="mini">Add</el-button></h4> 
-                            <div v-if="textareaVisible">
-                                <el-input class="textarea mt10"
-                                type="textarea"
-                                :rows="3"
-                                placeholder="Put your reference entry here"
-                                v-model="textarea">
-                                </el-input>
-                                <el-button class="mt10" icon="el-icon-check" type="primary" size="mini" @click="importText()">Import</el-button>
-                            </div>
-                        </div> 
-                    </li> -->
-                                </ul>
-                            </div>
-                        </div>
-                    </el-col>
-                </el-row>
-            </div>
-            <!-- 有引用数据-->
-            <div v-else>
-                <div class="topInfo">
+            <div v-if="tableData.length > 0">
+                <div class="topInfo operation1">
                     <h3>Dear {{ user_name }}</h3>
-                    <p class="mt10">Please check and modify the reference’s information on this page with the following instructions:</p>
+                    <p class="mt10">Please check and revise the reference’s information on this page with the following instructions:</p>
                     <ul class="mt20">
                         <li>
                             <p>
-                                - Please modify the reference in the
-                                <span class="status warn float"><i class="el-icon-warning-outline"></i></span>
-                                status, moving the reference information from
-                                <span class="status warn float"><i class="el-icon-warning-outline"></i></span> status to
-                                <span class="status ok float"><i class="el-icon-circle-check"></i></span> status.
+                                - Please revise the references marked with the
+                                <span class="status warn float"><i class="el-icon-warning-outline"></i></span> the status , check the
+                                reference marked with <span style="position: relative"><i class="itemChanged"></i> </span> the
+                                status(revised by editor)&nbsp;,&nbsp; and update them until they are marked with
+                                <span class="status ok float"><i class="el-icon-circle-check"></i></span> the status.
                             </p>
                         </li>
                         <li>
                             <p>
-                                - If you find the number of reference is disorder for technical reason, please click the
+                                - Please use the
                                 <el-button type="warning" size="mini" plain>↑</el-button>
-                                and
-                                <el-button type="warning" size="mini" plain>↓</el-button> behind each piece of information to adjust the
-                                order of the data.
+                                <span style="margin: 0 5px">and</span>
+                                <el-button type="warning" size="mini" plain>↓</el-button>
+                                <span style="margin: 0 5px">buttons to adjust the order of the reference.</span>
                             </p>
                         </li>
                         <li>
@@ -113,12 +30,12 @@
                                 information after this row.
                             </p>
                         </li>
-                        <li>
+                        <!-- <li>
                             <p>
                                 - If you want to discard all references and import a new batch of reference information, please click
                                 <el-button type="text" @click="removeAll">Delete and re-import</el-button>.
                             </p>
-                        </li>
+                        </li> -->
                         <li>
                             <p style="display: flex; align-items: center">
                                 - Please note that if this status exists,
@@ -129,126 +46,50 @@
                                         style="width: 24px; height: 24px; margin-left: 5px; margin-right: 5px"
                                     />
                                 </span>
-                                it indicates that the current reference is duplicated .
+                                it indicates that the current reference is duplicated.
                             </p>
                         </li>
                         <li>
                             <p>
                                 - Please do not forget to recheck all references in the
-                                <span class="status ok float"><i class="el-icon-circle-check"></i></span> status,especially abbreviated
+                                <span class="status ok float"><i class="el-icon-circle-check"></i></span> status, especially abbreviated
                                 journal title.
                             </p>
                         </li>
                     </ul>
+                    <div class="template-info">
+                        <span class="template-title">Article from a Journal (General format)</span> <br />
+                        Author(s) Last Name First Initial.&nbsp;Title of article.&nbsp;<i>Abbreviated Journal Title</i>.&nbsp;Year;Volume(issue):Inclusive page
+                        numbers.<br />
+                        <br />
+                        <span class="template-title">For example:</span><br />
+                        Article with More than Six Authors<br />
+                        Crompton J, Imms C, McCoy AT, et al. Group-based taskrelated training for children with cerebral palsy: a pilot
+                        study.&nbsp;<i>Phys Occup Ther Pediatr.</i>&nbsp;2007;27:43-65.<br />
+                        Special note: If the number of authors is 6 or fewer, all authors should be listed.
+                    </div>
                 </div>
                 <div class="refenceCentent mt20">
-                    <el-table
-                        :data="tableData"
-                        ref="multipleTable"
-                        :row-style="tableRowStyle"
-                        empty-text="New messages (0)"
-                        :show-header="false"
-                        :stripe="false"
-                        :highlight-current-row="false"
-                    >
-                        <el-table-column type="index" label="No." width="60" align="center">
-                            <template slot-scope="scope">
-                                <el-tooltip class="item" effect="dark" content="Duplicate references" placement="top">
-                                <img
-                                    src="../../assets/img/repeat.png"
-                                    v-if="scope.row.is_repeat == 1"
-                                    alt=""
-                                    style="width: 24px; height: 24px; float: left"
-                                />
-                                </el-tooltip>
-                                <span>{{ scope.$index + 1 }}</span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="state" width="55" align="center">
-                            <template slot-scope="scope">
-                                <span
-                                    class="status ok"
-                                    v-if="
-                                        (scope.row.refer_type == 'journal' && scope.row.doilink != '') ||
-                                        (scope.row.refer_type == 'book' && scope.row.isbn != '')
-                                    "
-                                >
-                                    <i class="el-icon-circle-check"></i>
-                                </span>
-                                <span class="status warn" v-else>
-                                    <i class="el-icon-warning-outline"></i>
-                                </span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="Title" align="left">
-                            <template slot-scope="scope">
-                                <!-- journal 形式 -->
-                                <div style="text-align: left" v-if="scope.row.refer_type == 'journal'">
-                                    <p>
-                                        {{ scope.row.author }}&nbsp;{{ scope.row.title }}.&nbsp;<em>{{ scope.row.joura }}</em
-                                        >&nbsp;{{ scope.row.dateno }}.<br />
-                                    </p>
-                                    <a class="doiLink" :href="scope.row.doilink" target="_blank">{{ scope.row.doilink }}</a>
-                                </div>
-                                <!-- book 形式 -->
-                                <div style="text-align: left" v-if="scope.row.refer_type == 'book'">
-                                    <p>{{ scope.row.author }}&nbsp;{{ scope.row.title }}.&nbsp;{{ scope.row.dateno }}.&nbsp;<br /></p>
-                                    <a class="doiLink" :href="scope.row.isbn" target="_blank">{{ scope.row.isbn }}</a>
-                                </div>
-                                <!-- other 形式 -->
-                                <p class="wrongLine" style="text-align: left" v-if="scope.row.refer_type == 'other'">
-                                    {{ scope.row.refer_frag }}
-                                </p>
-                            </template>
-                        </el-table-column>
-                        <el-table-column align="center" width="360">
-                            <div slot-scope="scope">
-                                <el-button
-                                    style="margin-left: 10px"
-                                    @click="change(scope.row, 'Edit')"
-                                    plain
-                                    type="primary"
-                                    size="mini"
-                                    icon="el-icon-edit"
-                                    >edit</el-button
-                                >
-                                <el-tooltip
-                                    popper-class="tps"
-                                    class="item"
-                                    effect="light"
-                                    content="Add one under this line"
-                                    placement="top"
-                                >
-                                    <el-button @click="addLine(scope.row, 'Add')" type="success" size="mini" plain>Add</el-button>
-                                </el-tooltip>
-                                <el-button
-                                    type="warning"
-                                    size="mini"
-                                    plain
-                                    :disabled="scope.$index != 0 ? false : true"
-                                    @click="changeOrder(scope.row, 'up')"
-                                    >↑</el-button
-                                >
-                                <el-button
-                                    type="warning"
-                                    size="mini"
-                                    plain
-                                    :disabled="scope.$index == tableData.length - 1 ? true : false"
-                                    @click="changeOrder(scope.row, 'down')"
-                                    >↓</el-button
-                                >
-                                <el-button
-                                    type="danger"
-                                    icon="el-icon-delete"
-                                    size="mini"
-                                    style="float: right"
-                                    plain
-                                    @click="deleteLine(scope.row)"
-                                    >delete</el-button
-                                >
-                            </div>
-                        </el-table-column>
-                    </el-table>
+                    <div>
+                        <editPublicRefRdit
+                            ref="editPublicRefRdit"
+                            :chanFerForm="tableData"
+                            :chanFerFormRepeatList="chanFerFormRepeatList"
+                            role="user"
+                            p_article_id=""
+                            @refrashComp="refrashComp"
+                            @changeRefer="changeRefer"
+                        ></editPublicRefRdit>
+                    </div>
+                </div>
+            </div>
+            <div v-else>
+                <div class="topInfo operation1">
+                    <h3>Dear {{ user_name }}</h3>
+                    <p class="mt10">
+                        <i class="el-icon-warning" style="color: #e6a23c; margin-right: 8px"></i>Please wait patiently while the Editorial
+                        Office processes the references.
+                    </p>
                 </div>
             </div>
         </div>
@@ -258,7 +99,8 @@
             :title="dialogTitle + ' References'"
             :visible.sync="editboxVisible"
             width="800px"
-            @close="cancelSave" :close-on-click-modal="false"
+            @close="cancelSave"
+            :close-on-click-modal="false"
         >
             <p class="yinyongPre c888">
                 Now you are starting to add or modify this reference. If this reference has a DOI, you can directly copy it into the DOI
@@ -350,25 +192,6 @@
                     </el-form-item>
                 </div>
             </el-form>
-            <!-- <el-form  :model="refenceLinkForm" :rules="refenceLinkFormrules" ref="refenceLinkForm" label-width="80px" class="editForm mt10">                     
-                    <el-form-item label="Author(s):" required prop="author" >
-                        <el-input  v-model="refenceLinkForm.author" placeholder=""></el-input>
-                    </el-form-item> 
-                    <span>Six or less authors are required to list all authors while more than six authors are required to list three of them with “et al”</span>
-                    <el-form-item label="title:" required prop="title" >
-                        <el-input  v-model="refenceLinkForm.title" placeholder="eg: Tradit Med Res"></el-input>
-                    </el-form-item> 
-                    <el-form-item label="Source:" required prop="joura" >
-                        <el-input  v-model="refenceLinkForm.joura" placeholder="eg:Healthcare (Basel)."></el-input>
-                    </el-form-item>
-                    <el-form-item label="Publication Details:" required prop="dateno" >
-                        <el-input  v-model="refenceLinkForm.dateno" placeholder="eg: 2023;8(9):49-62"></el-input>
-                    </el-form-item>
-                    <span>Year;Volume(issue):Inclusive page numbers.</span>
-                    <el-form-item label="doilink:" required prop="doilink" >
-                        <el-input  v-model="refenceLinkForm.doilink" placeholder="eg:https://doi.org/10.1002/cncr.30667"></el-input>
-                    </el-form-item>
-                </el-form>             -->
             <span slot="footer" class="dialog-footer">
                 <el-button @click="cancelSave">Cancel</el-button>
                 <el-button type="primary" @click="saveChange" v-if="dialogTitle == 'Edit'">Save</el-button>
@@ -388,12 +211,16 @@
             </span>
         </el-dialog>
         <!-- 临时引用信息 -->
-        <el-dialog title="Reference List" :visible.sync="linVisible" width="800px" :close-on-click-modal="false">
+        <el-dialog title="Reference List" :visible.sync="linVisible" width="1200px" :close-on-click-modal="false" class="reference-dialog">
+            <div class="newpro">
+                <el-progress v-if="isUpload" :stroke-width="15" :percentage="progressPercent" style="width: 100%"></el-progress>
+            </div>
+
             <div class="refenceCentent mt20" v-if="Tempredable.length > 0">
                 <el-table
                     :data="Tempredable"
                     ref="tempredableTable"
-                    max-height="400px"
+                    max-height="600px"
                     empty-text="New messages (0)"
                     :show-header="false"
                     :stripe="false"
@@ -402,33 +229,61 @@
                     <el-table-column type="index" label="No." width="55" align="center"></el-table-column>
                     <el-table-column label="Title" align="left">
                         <template slot-scope="scope">
-                            <p style="text-align: left">
-                                <!-- <el-badge is-dot :hidden="scope.row.author_act==1?false:true" class="item"> -->
+                            <p style="text-align: left; line-height: 18px" v-if="!parseVisible">
                                 {{ scope.row.content }}<br /><el-link type="primary">{{ scope.row.doi }}</el-link>
-                                <!-- </el-badge> -->
                             </p>
+                            <p style="text-align: left; line-height: 18px" v-if="parseVisible">
+                                {{ scope.row.refer_content }}<br /><el-link type="primary">{{ scope.row.refer_doi }}</el-link>
+                            </p>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="Status" align="center" width="55" v-if="parseVisible">
+                        <template slot-scope="scope">
+                            <i class="el-icon-loading" style="font-size: 24px; color: #606266" v-if="scope.row.is_deal == 2"></i>
+
+                            <i class="el-icon-success" style="font-size: 24px; color: #2ac95c" v-if="scope.row.is_deal == 1"></i>
                         </template>
                     </el-table-column>
                 </el-table>
                 <div class="shuoming mt20">
                     <p class="c888">
-                        <i class="el-icon-message-solid"></i>&nbsp;&nbsp;The above is the citation data identified according to your
-                        uploaded file, you can choose to import, or discard this data and upload again.
+                        <i class="el-icon-message-solid"></i>&nbsp;&nbsp;<span v-if="!parseVisible"
+                            >The above is the citation data identified according to your uploaded file, you can choose to import, or discard
+                            this data and upload again.</span
+                        >
+                        <span v-if="parseVisible">We are currently identifying the citation data you uploaded. Please be patient.</span>
                     </p>
                 </div>
             </div>
             <span slot="footer" class="dialog-footer">
-                <el-button @click="abandon">Abandon and Reimport</el-button>
-                <el-button type="primary" @click="importText">Import</el-button>
+                <div v-if="!parseVisible">
+                    <el-button @click="abandon">Abandon and Reimport</el-button>
+                    <el-button type="primary" @click="handleparse">Import</el-button>
+                </div>
+                <div v-if="parseVisible">
+                    <el-button
+                        @click="
+                            parseVisible = false;
+                            linVisible = false;
+                        "
+                        >Cancel</el-button
+                    >
+                </div>
             </span>
         </el-dialog>
     </div>
 </template>
 
 <script>
+import editPublicRefRdit from './editPublicRefRdit'; // 公共引用编辑页面
 export default {
     data() {
         return {
+            chanFerFormRepeatList: [],
+            uploadTimer: null, //调取进度条的轮询定时器
+            isUpload: false, //文件是否上传中
+            progressPercent: 0, //进度条当前进度
+            curPercentage: 0,
             user_name: localStorage.getItem('U_relname'),
             holeLoading: false, // 进入页面的loading
             importIoading: false,
@@ -453,6 +308,7 @@ export default {
             tableData: [],
             // 临时引用列表
             Tempredable: [],
+            parseVisible: false,
             editboxVisible: false,
             helpVisible: false,
             uploadVisible: true,
@@ -522,9 +378,60 @@ export default {
     created() {
         this.openFullScreen1();
         this.getRefData();
-        this.holeLoading = true;
+    },
+    components: {
+        editPublicRefRdit
+    },
+    beforeDestroy() {
+        clearInterval(this.uploadTimer);
     },
     methods: {
+        changeRefer(val) {
+            this.getRefData();
+        },
+        refrashComp() {
+            this.$refs.editPublicRefRdit.$forceUpdate();
+            console.log('editPublicRefRdit');
+        },
+        async getProgress() {
+            var that = this;
+            this.getRefData();
+            var progress = 0;
+
+            this.$api.post('api/Preaccept/getReferState', { article_id: this.$route.query.id }).then(async (res) => {
+                if (res.status == 1) {
+                    progress = Number(res.data.processed_total);
+                    this.TempredableNew = res.data.refer;
+                }
+                //percent是后端返回的进度
+
+                if (progress == res.data.total) {
+                    this.isUpload = false;
+                    clearInterval(this.uploadTimer);
+                    that.uploadTimer = null;
+
+                    this.$forceUpdate();
+                }
+            });
+
+            return progress;
+        },
+
+        // 删除部分引用
+        deleteSomeRefs() {
+            var ids = [];
+            ids = this.tableData.map((item) => {
+                return item.p_refer_id;
+            });
+            console.log('ids at line 570:', ids);
+
+            this.$api
+                .post('api/Preaccept/delRefers', {
+                    ids: ids
+                })
+                .then((res) => {})
+                .catch((err) => {});
+        },
         tableRowStyle({ row }) {
             if (row.is_repeat === 1) {
                 return { backgroundColor: '#ffecec' }; // 浅红色
@@ -535,7 +442,6 @@ export default {
         gotoFormate() {
             // this.$refs['refenceForm'].validateField('doi', (callback)=>{
             if (this.refenceForm.doi != '') {
-                this.holeLoading = true;
                 this.$api
                     .post('/api/Preaccept/searchDoi', { doi: this.refenceForm.doi })
                     .then((res) => {
@@ -555,7 +461,6 @@ export default {
                     })
                     .catch((e) => {
                         this.$message.error(e.msg);
-                        this.holeLoading = false;
                     });
             } else {
                 this.$message.error('The Doi cannot be empty!');
@@ -563,21 +468,27 @@ export default {
             // })
         },
         // 全页面加载动画
-        openFullScreen1() {
-            this.holeLoading = true;
-        },
+        openFullScreen1() {},
         // 获取引用文献信息
         getRefData() {
+            const loading = this.$loading({
+                lock: true,
+                text: 'Loading...',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.7)'
+            });
             this.$api
                 .post('api/Preaccept/getArticleReferences', { article_id: this.$route.query.id })
                 .then((res) => {
                     console.log(res);
                     if (res.code == 0 && res.data.refers.length > 0) {
                         this.tableData = res.data.refers;
+                        this.chanFerFormRepeatList = Object.values(res.data.repeat);
                     }
-                    this.holeLoading = false;
+                    loading.close();
                 })
                 .catch((err) => {
+                    loading.close();
                     console.log(err);
                 });
         },
@@ -592,28 +503,43 @@ export default {
         showHelp() {
             this.helpVisible = true;
         },
-        // 导入文本域
-        importText() {
+        // handleparse() {
+        //     // this.linVisible = false;
+        //     // setTimeout(() => {
+        //         this.getParseData();
+        //     // }, 1000);
+        // },
+        // 获取解析数据
+        getParseData() {
             this.linVisible = false;
-            this.importIoading = true;
+            this.parseVisible = true;
+            this.isUpload = true;
+        },
+        // 导入文本域
+        handleparse() {
+            const loading = this.$loading({
+                lock: true,
+                text: 'Loading...',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.7)'
+            });
             //console.log(this.form.referFile,'referFile')
             this.$api
-                .post('api/Preaccept/addRefersByExcel', {
+                .post('api/Preaccept/addRefersByExcelNew', {
                     article_id: this.$route.query.id,
                     referFile: this.form.referFile
                 })
                 .then((res) => {
+                    loading.close();
                     if (res.code == 0) {
-                        this.$message.success('Import succeeded');
-                        this.linVisible = false;
-                        this.Tempredable = [];
-                        this.importIoading = false;
-                        // 有可以可用的文献数据，刷新当前页面
-                        // location.reload() // 刷新本页面
-                        this.getRefData();
+                        this.getParseData();
+                    } else {
+                        loading.close();
+                        this.$message.error(res.msg);
                     }
                 })
                 .catch((err) => {
+                    loading.close();
                     console.log(err);
                 });
         },
@@ -1015,6 +941,7 @@ export default {
             return this.baseUrl + 'api/Preaccept/up_refer_file';
         }
     },
+
     watch: {
         SourceType: {
             handler(newVal, oldVal) {
@@ -1027,6 +954,21 @@ export default {
             },
             // immediate: true,
             deep: true // 可以深度检测到 person 对象的属性值的变化
+        },
+        //监听文件是否上传
+        isUpload: {
+            handler(val, oldVal) {
+                if (this.isUpload) {
+                    this.uploadTimer = setInterval(async () => {
+                        //需要定时执行的代码
+                        this.progressPercent = await this.getProgress();
+                    }, 1000);
+                } else {
+                    clearInterval(this.uploadTimer);
+                    this.currentFile = {};
+                }
+            },
+            deep: true
         }
     }
 };
@@ -1067,11 +1009,11 @@ export default {
 }
 .status {
     display: block;
-    width: 40px;
-    height: 40px;
-    border-radius: 40px;
+    width: 36px;
+    height: 36px;
+    border-radius: 36px;
     font-size: 22px;
-    line-height: 40px;
+    line-height: 36px;
     color: #fff;
     text-align: center;
 }
@@ -1085,7 +1027,9 @@ export default {
     display: inline-block;
 }
 .topInfo {
-    padding: 20px;
+    padding: 0px;
+    margin-top: -10px;
+    margin-bottom: 30px;
 }
 .topInfo ul {
     padding-left: 30px;
@@ -1115,7 +1059,7 @@ export default {
     font-size: 26px;
 }
 .mt20 {
-    margin-top: 20px;
+    margin-top: 14px;
 }
 .content_box {
     padding: 15px 10px;
@@ -1129,7 +1073,7 @@ p {
     font-size: 14px;
 }
 .mt10 {
-    margin-top: 10px;
+    margin-top: 14px;
 }
 .more {
     font-weight: bold;
@@ -1179,4 +1123,75 @@ p {
 /deep/ .el-table tr:nth-child(2n) {
     background: #fff;
 }
+::v-deep .reference-dialog .el-dialog__body {
+    padding: 0 20px !important;
+}
+.newpro .el-progress-bar__inner:before {
+    content: '';
+    width: 100%;
+    height: 100%;
+    display: block;
+    background-image: repeating-linear-gradient(
+        -45deg,
+        hsla(0, 0%, 100%, 0.15) 25%,
+        transparent 0,
+        transparent 50%,
+        hsla(0, 0%, 100%, 0.15) 0,
+        hsla(0, 0%, 100%, 0.15) 75%,
+        transparent 0,
+        transparent
+    );
+    background-size: 40px 40px;
+    animation: mymove 2s linear infinite;
+}
+@keyframes mymove {
+    0% {
+        background-position: 0;
+    }
+    25% {
+        background-position: 50px;
+    }
+    50% {
+        background-position: 100px;
+    }
+    75% {
+        background-position: 150px;
+    }
+    100% {
+        background-position: 200px;
+    }
+}
+::v-deep .operation1 .el-button--mini {
+    font-size: 14px !important;
+    padding: 6px 10px !important;
+    zoom: 0.9;
+}
+.itemChanged {
+    display: inline-block;
+    background: #006699;
+    color: #fff;
+    padding: 5px;
+    border-radius: 0 0 7px 7px;
+    left: 0;
+    top: 0;
+}
+.template-info {
+    margin-top: 20px;
+    background: rgb(244, 244, 245);
+    border: 1px solid rgb(211, 212, 214);
+    font-size: 14px;
+    color: #606266;
+    padding-left: 15px;
+    border-radius: 4px;
+    padding: 14px;
+    box-sizing: border-box;
+}
+.template-title {
+    /* font-size: 16px; */
+    font-weight: bold;
+
+    margin-bottom: 10px;
+    color: #333;
+    display: inline-block;
+}
 </style>

src/components/page/articleAdd.vue

@@ -819,7 +819,10 @@
                     <br />
                     <font style="color: #006699">3.Value:</font> This manuscript belongs to the advanced topic and can attract wide
                     attention.
-                </p>
+                    <br />
+                 <span style="margin-top:6px"> please download the manuscript template <font  @click="dowloadFileTemplate()" style="color: #006699;margin-left: 2px;cursor: pointer;"> <i class="el-icon-download" style="font-weight: bold"></i> Microsoft Word template</font>.
+          </span>
+                         </p>
                 <common-word-html
                     :articleId="stagingID"
                     imgHeight="120px"
@@ -2489,7 +2492,22 @@ this.checkAll = false;
         onDeleteTuijian(item, index) {
             this.tuiJianForm.splice(index, 1);
         },
+        dowloadFileTemplate(){
+var filePath = 'https://submission.tmrjournals.com/public/ArticleTemplate/manuscirpt/ManuscirptWordTemplate.docx';
 
+
+// 获取heads中的filename文件名
+let downloadElement = document.createElement('a');
+// 创建下载的链接
+downloadElement.href = filePath; // 下载后文件名
+
+downloadElement.target = '_blank';
+document.body.appendChild(downloadElement);
+// 点击下载
+downloadElement.click();
+// 下载完成移除元素
+document.body.removeChild(downloadElement);
+        },
         // 下载文件
         dowloadFile(file) {
             let filePath = '/public/' + file.url;

src/components/page/articleListEditor_A.vue

@@ -1892,13 +1892,17 @@ export default {
         // 跳入预收录编辑页面
         changeEnter(val) {
             console.log(val, 'val');
-            this.$router.push({
-                name: 'PreIngestedEditor',
-                query: {
-                    id: val.article_id,
+            window.open(
+                    this.$router.resolve({
+                        path: '/PreIngestedEditor',
+                        query: {
+                            id: val.article_id,
                     uid: val.user_id
-                }
-            });
+                        }
+                    }).href,
+                    '_blank'
+                );
+           
         },
         changeCountry() {
             this.currentSearchForm={}

src/components/page/articleListEditor_B.vue

@@ -222,7 +222,17 @@ export default {
 
         // 跳页录入排版
         changeEnter(val) {
-            this.$router.push('/articleListEditor_B1?id=' + val.p_article_id);
+            window.open(
+                    this.$router.resolve({
+                        path: '/articleListEditor_B1',
+                        query: {
+                            id: val.p_article_id,
+                   
+                        }
+                    }).href,
+                    '_blank'
+                );
+           
         }
     }
 };

src/components/page/articleListEditor_B1.vue

@@ -1,16 +1,17 @@
 <template>
-    <div>  
+    <div style="width: 100%; height: 100%">
         <div class="tab_post">
-            <el-button 
-                            size="mini"
-                            type="success"
-                            plain
-                            icon="el-icon-tickets"
-                            @click="showdetaileditor(detailMes)"
-                            style="padding:6px;margin-left: 0px;position: absolute;bottom: -32px;left: 0px;"
-                            >  Detailed for MS</el-button
-                        >
-            <div v-for="(item, index) in tabsList" @click="jumpTab(index, item)" :class="tabName == item.refName ? 'P_style' : ''">
+            <el-button
+                size="mini"
+                type="success"
+                plain
+                icon="el-icon-tickets"
+                @click="showdetaileditor(detailMes)"
+                style="padding: 6px; margin-left: 0px; position: absolute; bottom: 20px; left: 0px"
+            >
+                Detailed for MS</el-button
+            >
+            <div class="tab_item" v-for="(item, index) in tabsList" @click="jumpTab(index, item)" :class="tabName == item.refName ? 'P_style' : ''">
                 <h5>
                     <span>{{ index + 1 }}</span>
                     {{ item.name }}
@@ -23,36 +24,28 @@
                     <i class="el-icon-finished"></i>
                     Push Online
                 </el-button>
-              
-               <div class="editorial_advisory_board" style="margin: 12px 0 0" v-if="finalReview">
-                 
-               <li>Editorial Advisory Board :
-                <template v-if="finalReview.reviewer_id">
-  <span style="font-weight: bold;color: #333;" v-if="finalReview.realname">{{finalReview.realname}}</span> 
-  <span style="font-weight: bold;color: #333;" v-else>No reviewer name</span> 
-                </template>
-              
-                <span v-else>No</span>
-            
-            </li>
-               <template v-if="finalReview.reviewer_id">
-                    <li>Received : {{ finalReview.received_time? finalReview.received_time : 'No Time' }}</li>
-                <li>Revision : {{ finalReview.revision_time? finalReview.revision_time : 'No Time' }}</li>
-                <li>Accepted : {{ finalReview.accepted_time? finalReview.accepted_time : 'No Time' }}</li>
-                <li>Available online : {{ finalReview.available_online? finalReview.available_online : 'No Time' }}</li>
-              
-                </template>
+
+                <div class="editorial_advisory_board" style="margin: 20px 0 0" v-if="finalReview">
+                    <li>
+                        Editorial Advisory Board :
+                        <template v-if="finalReview.reviewer_id">
+                            <span style="font-weight: bold; color: #333" v-if="finalReview.realname">{{ finalReview.realname }}</span>
+                            <span style="font-weight: bold; color: #333" v-else>No reviewer name</span>
+                        </template>
+
+                        <span v-else>No</span>
+                    </li>
+                    <template v-if="finalReview.reviewer_id">
+                        <li>Received : {{ finalReview.received_time ? finalReview.received_time : 'No Time' }}</li>
+                        <li>Revision : {{ finalReview.revision_time ? finalReview.revision_time : 'No Time' }}</li>
+                        <li>Accepted : {{ finalReview.accepted_time ? finalReview.accepted_time : 'No Time' }}</li>
+                        <li>Available online : {{ finalReview.available_online ? finalReview.available_online : 'No Time' }}</li>
+                    </template>
                 </div>
-              
             </div>
-            
         </div>
 
-        <div
-            class="scroll-content guanSty"
-            @scroll="onScroll"
-            :style="'overflow-x: hidden; overflow-y: auto;height:' + contentStyleObj.height"
-        >
+        <div class="scroll-content guanSty" @scroll="onScroll" :style="'height: calc(100%);overflow: auto;'">
             <!-- 基本信息 -->
             <div :ref="tabsList[0].refName" class="scroll-item">
                 <div class="bor_style_onli" style="margin: 20px 0">
@@ -132,35 +125,34 @@
                             <el-input v-model="detailMes.author_contribution"></el-input>
                         </el-form-item>
                         <el-form-item label="Abstract :" prop="abstract">
-                            <template slot="label">
-                                        <span style="color: #f56c6c; margin-right: 4px">*</span>Abstract :
-                                    </template>
+                            <template slot="label"> <span style="color: #f56c6c; margin-right: 4px">*</span>Abstract : </template>
                             <tinymce
-                type="Abstract"
-                :height="160"
-                :id="id"
-                ref="tinymceChild1"
-                :wordStyle="`p{font-size: 13px;}`"
-                :isAutomaticUpdate="true"
-                @getContent="getContent"
-                @updateChange="updateChange"
-                :value="abstract"
-                class="paste-area text-container"
-                :toolbar="['bold italic |customBlue removeBlue|myuppercase myuppercasea Line|subscript superscript|clearButton']"
-                style="
-                    line-height: 12px;
-                    overflow: auto;
-                    font-size: 13px; /* 字体大小 */
-                    margin-top: 0pt; /* 段前间距 */
-                    margin-bottom: 0pt; /* 段后间距 */
-                "
-            ></tinymce>
+                                type="Abstract"
+                                :height="160"
+                                ref="tinymceChild1"
+                                :wordStyle="`p{font-size: 13px;}`"
+                                :isAutomaticUpdate="true"
+                                @getContent="getContent"
+                                @updateChange="updateChange"
+                                :value="abstract"
+                                class="paste-area text-container"
+                                :toolbar="[
+                                    'bold italic |customBlue removeBlue|myuppercase myuppercasea Line|subscript superscript|clearButton'
+                                ]"
+                                style="
+                                    line-height: 12px;
+                                    overflow: auto;
+                                    font-size: 13px; /* 字体大小 */
+                                    margin-top: 0pt; /* 段前间距 */
+                                    margin-bottom: 0pt; /* 段后间距 */
+                                "
+                            ></tinymce>
 
-                                    <!-- <quill-editor ref="myTextEditor" v-model="detailMes.abstract" :options="editorOption"> </quill-editor> -->
-                                </el-form-item>
+                            <!-- <quill-editor ref="myTextEditor" v-model="detailMes.abstract" :options="editorOption"> </quill-editor> -->
+                        </el-form-item>
                     </el-form>
                     <div style="text-align: center; margin: 25px 0 0 0">
-                        <el-button type="primary" @click="ZsSaveMes" style="width: 400px; margin-right: 20px">
+                        <el-button type="primary" @click="ZsSaveMes" class="save-btn">
                             <i class="el-icon-check"></i>
                             Save Essential Information
                         </el-button>
@@ -202,21 +194,34 @@
                                 </p>
                             </template>
                         </el-table-column>
-                        <el-table-column prop="organs" label="Affiliated organization" width="300%">
+                        <el-table-column prop="organs" label="Affiliated organization" min-width="300px">
                             <template slot-scope="scope">
                                 <span v-for="(u, i) in scope.row.organs">{{ u.organ_name }}<br /></span>
                             </template>
                         </el-table-column>
-                        <el-table-column prop="author_country" label="Country"></el-table-column>
+                        <el-table-column prop="author_country" label="Country" width="140px"></el-table-column>
                         <el-table-column prop="orcid" label="ORCID"></el-table-column>
                         <el-table-column label="" width="190" align="center">
                             <template slot-scope="scope">
-                                <el-button icon="el-icon-edit" type="primary" @click="authorhandEdit(scope.$index, scope.row)"
-                                    >Edit
-                                </el-button>
-                                <el-button type="danger" icon="el-icon-delete" class="red" @click="authorDelete(scope.$index, scope.row)"
-                                    >Delete</el-button
-                                >
+                                <div class="operation">
+                                    <el-button
+                                        icon="el-icon-edit"
+                                        size="mini"
+                                        plain
+                                        type="primary"
+                                        @click="authorhandEdit(scope.$index, scope.row)"
+                                        >Edit
+                                    </el-button>
+                                    <el-button
+                                        size="mini"
+                                        type="danger"
+                                        plain
+                                        icon="el-icon-delete"
+                                        class="red"
+                                        @click="authorDelete(scope.$index, scope.row)"
+                                        >Delete</el-button
+                                    >
+                                </div>
                             </template>
                         </el-table-column>
                     </el-table>
@@ -250,13 +255,13 @@
                             <el-form-item label="Affiliated organization :">
                                 <el-checkbox-group v-model="addFomauthor.organs" class="suoshu_jigou">
                                     <el-checkbox
-                                        v-for="(item,index) in mechanism"
+                                        v-for="(item, index) in mechanism"
                                         style="display: block"
                                         name="type"
                                         :label="item.p_article_organ_id"
                                         :key="item.p_article_organ_id"
                                     >
-                                    <span style="margin-right:4px ;">{{ index+1 }}. </span>  {{ item.organ_name }}
+                                        <span style="margin-right: 4px">{{ index + 1 }}. </span> {{ item.organ_name }}
                                     </el-checkbox>
                                 </el-checkbox-group>
                             </el-form-item>
@@ -316,12 +321,12 @@
                             <el-form-item label="Affiliated organization :">
                                 <el-checkbox-group v-model="editFomauthor.organs" class="suoshu_jigou">
                                     <el-checkbox
-                                        v-for="(item,index) in mechanism"
+                                        v-for="(item, index) in mechanism"
                                         style="display: block"
                                         :label="item.p_article_organ_id + ''"
                                         :key="item.p_article_organ_id"
                                     >
-                                        <span style="margin-right:4px ;">{{ index+1 }}. </span>  {{ item.organ_name }}
+                                        <span style="margin-right: 4px">{{ index + 1 }}. </span> {{ item.organ_name }}
                                     </el-checkbox>
                                 </el-checkbox-group>
                             </el-form-item>
@@ -364,12 +369,24 @@
                         <el-table-column prop="organ_name" label="Affiliation"></el-table-column>
                         <el-table-column label="" width="190" align="center">
                             <template slot-scope="scope">
-                                <el-button icon="el-icon-edit" type="primary" @click="schoolhandEdit(scope.$index, scope.row)"
-                                    >Edit
-                                </el-button>
-                                <el-button icon="el-icon-delete" type="danger" @click="schoolDelete(scope.$index, scope.row)"
-                                    >Delete</el-button
-                                >
+                                <div class="operation">
+                                    <el-button
+                                        icon="el-icon-edit"
+                                        size="mini"
+                                        plain
+                                        type="primary"
+                                        @click="schoolhandEdit(scope.$index, scope.row)"
+                                        >Edit
+                                    </el-button>
+                                    <el-button
+                                        size="mini"
+                                        icon="el-icon-delete"
+                                        plain
+                                        type="danger"
+                                        @click="schoolDelete(scope.$index, scope.row)"
+                                        >Delete</el-button
+                                    >
+                                </div>
                             </template>
                         </el-table-column>
                     </el-table>
@@ -402,7 +419,7 @@
 
             <!-- 文件上传 -->
             <div :ref="tabsList[2].refName" class="scroll-item">
-                <div class="bor_style_onli" style="height: auto !important;max-height: 700px">
+                <div class="bor_style_onli" style="height: auto !important">
                     <h4>{{ tabsList[2].name }}</h4>
                     <el-form label-width="220px">
                         <el-form-item label="SUB File Upload :">
@@ -572,7 +589,7 @@
 
             <!-- 参考文献 -->
             <div :ref="tabsList[3].refName" class="scroll-item">
-                <div class="bor_style_onli" >
+                <div class="bor_style_onli">
                     <h4>{{ tabsList[3].name }}</h4>
                     <PreIngestedEditorProduce
                         type="produce"
@@ -580,142 +597,22 @@
                         :article_id="detailMes.article_id"
                         :p_article_id="p_article_id"
                     ></PreIngestedEditorProduce>
-                    <!--<div class="liter_ture">
-						<div class="chanSelLef">
-						
-							<div :class="showB_step ==1?'C_style':''">
-								<h3><span>1</span>Check References and Doi</h3>
-								<div v-if="showB_step ==1">
-									<p>
-										You need to click
-										<el-button type="warning" @click="StepBOper(1)" size="mini"
-											style="padding: 5px 8px;font-size: 12px;margin: 0 5px;">
-											<i class="el-icon-edit-outline"></i>
-											Crossref
-										</el-button>
-										 to open the website, then paste the references part of the
-										<a :href='mediaUrl+this.gridData' target="_blank">
-											<el-button type="text" size="mini"
-												style="font-size: 12px;margin: 0 5px;font-weight: bold;">
-												<i class="el-icon-download" style="font-weight: bold;"></i>
-												manuscript
-											</el-button>
-										</a>
-										to get the new references part, please paste the new one into the input box.
-									</p>
-									<el-button @click="StepBNext(2)" plain type="primary"
-										style="width: 85%;margin: 15px 0px 0px 30px;position: relative;">
-										<i class="el-icon-right"
-											style="font-size: 18px;position: absolute;right: 8px;top: 5px;"></i>
-										Next Step
-									</el-button>
-								</div>
-							</div>
-
-							
-							<div :class="showB_step ==2?'C_style':''">
-								<h3><span>2</span>Check Standard</h3>
-								<div v-if="showB_step ==2">
-									<p>Convert to standard format.</p>
-									<p style="background-color: #fdf3e3;padding: 10px;margin: 10px 0 0 30px;">The
-										references
-										with yellow background
-										are problematic, so you can check and correct them yourself.</p>
-									<el-button @click="StepBNext(1)" type="primary" plain
-										style="width: 85%;margin: 15px 0px 0px 30px;position: relative;">
-										<i class="el-icon-back"
-											style="font-size: 18px;margin:0;position:absolute;left: 8px;top: 5px;"></i>
-										Back Step and Reset
-									</el-button>
-								</div>
-							</div>
-						</div>
-						<div class="chanFerAll">
-							<div v-if="showB_step ==1">
-								<el-input v-model="refAarray" type="textarea" rows="20" style="width: 100%;"
-									:placeholder="placeRef"></el-input>
-								<el-button type="primary" @click="StepBOper(2)"
-									style="width: 250px;margin: 20px 0 0 0;float: right;">
-									<i class="el-icon-document-checked"></i>
-									Complete and conversion
-								</el-button>
-								<br clear="both">
-							</div>
-
-							<div v-for="(item,index) in this.chanFerForm" v-if="showB_step ==2" class="ref_list">
-								<div>
-									<span
-										style="float:left;margin: 3px 10px 0 0;width: 80px;text-align: right;font-size: 14px;">DOI
-										:</span>
-									<p style="float:left;font-size: 14px;color: #555;">{{item.refer_doi}}</p>
-									<br clear="both">
-								</div>
-								<div v-if="item.cs==1&&item.edit_mark!=0" style="margin-bottom: 0;">
-									<span
-										style="float:left;margin: 0 12px 0 0;width: 80px;text-align: right;font-size: 14px;">Standard
-										:</span>
-									<p v-if="item.author==''"
-										style="float:left;width:74.5%;font-size: 14px;color: #555;line-height: 20px;">
-										{{item.refer_frag}}
-									</p>
-									<p v-if="item.author!=''"
-										style="float:left;width:74.5%;font-size: 14px;color: #555;line-height: 20px;">
-										{{item.author}} {{item.title}} {{item.joura}}{{item.dateno}}. Available at:
-										{{item.doilink}}
-									</p>
-									<br clear="both">
-								</div>
-								<div v-if="item.cs==0||item.edit_mark==0" :class="item.cs==0?'BG_yell':''"
-									style="margin-bottom: 0;">
-									<span
-										style="float:left;margin: 0 12px 0 0;width: 80px;text-align: right;font-size: 14px;">Standard
-										:</span>
-									<el-input type="textarea" v-model="item.refer_frag" autosize
-										style="width: 60%;display: inline-block;"></el-input>
-
-									<div style="display: inline-block;width: 50px;vertical-align: top;">
-										<el-button @click="ChanFerEditFrag(item,index)" type="primary"
-											icon="el-icon-check" size="mini" style="margin: 0 5px 0 15px;">
-										</el-button>
-										<el-button @click="ChanFerMashUp(item)" type="warning" size="mini"
-											style="margin: 10px 5px 0 15px;" v-if="index!=0">Up</el-button>
-									</div>
-								</div>
-								<b>{{index+1}}</b>
-								<i class="el-icon-edit-outline" @click="referMark(index)"
-									v-if="item.edit_mark==1&&item.cs!=0&&item.author==''"></i>
-								<i class="el-icon-top" @click="ChanFerMashUp(item)"
-									v-if="index!=0&&item.edit_mark==1&&item.cs!=0"
-									style="right: 40px;font-size: 10px;">up</i>
-							</div>
-						</div>
-						<br clear="both">
-						
-						<div v-if="refProcess==1" class="RefProBar">
-							<div>
-								<el-progress :text-inside="true" :stroke-width="24" :percentage="refReal"
-									:color="customColorMethod"></el-progress>
-								<p>
-									<img src="../../assets/img/Ip_spinner.gif">
-									<span>{{this.refReal}}%</span> completed, please wait...
-								</p>
-							</div>
-						</div>
-					</div> -->
                 </div>
             </div>
 
             <!-- Html排版 -->
             <div :ref="tabsList[4].refName" class="scroll-item">
-                <div class="bor_style_onli" style="height: auto !important;max-height: 700px">
+                <div class="bor_style_onli" style="height: auto !important">
                     <h4>{{ tabsList[4].name }}</h4>
                     <div>
-                        <p style="color: #606266; font-size: 14px; line-height: 21px; margin-bottom: 15px">HTML typesetting and AI proofreading</p>
+                        <p style="color: #606266; font-size: 14px; line-height: 21px; margin-bottom: 15px">
+                            HTML typesetting and AI proofreading
+                        </p>
                     </div>
                     <div style="text-align: center">
-                        <el-button type="primary" @click="htmlContet()" style="width: 300px">
+                        <el-button type="primary" @click="htmlContet()" class="save-btn">
                             <i class="el-icon-document-copy"></i>
-                           Proofread
+                            Proofread
                         </el-button>
                     </div>
                 </div>
@@ -736,7 +633,7 @@
                             >
                                 <el-option v-for="item in fol_low" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                             </el-select>
-                            <el-button type="primary" style="width: 150px; margin: 0 5px 0 15px" @click="EstaBlish">
+                            <el-button type="primary" plain style="width: 150px; margin: 0 5px 0 15px" @click="EstaBlish">
                                 <i class="el-icon-document"></i>
                                 Create Manuscript
                             </el-button>
@@ -785,8 +682,16 @@
                                     :on-remove="removefileUpTy"
                                     style="display: inline-block"
                                 >
-                                    <div class="el-upload__text" style="padding: 6px 10px; background-color: #006699">
-                                        <font style="color: #fff; font-size: 12px">
+                                    <div
+                                        class="el-upload__text"
+                                        style="
+                                            padding: 6px 10px;
+                                            background-color: #ecf5ff;
+                                            border: 1px solid #b3d8ff !important;
+                                            border-radius: 2px;
+                                        "
+                                    >
+                                        <font style="color: #409eff; font-size: 12px">
                                             <b class="el-icon-upload2" style="font-weight: bold; margin-right: 5px"></b>
                                             Click Re upload
                                         </font>
@@ -802,7 +707,6 @@
                             <h5 style="font-size: 16px; margin: 0 0 30px 0; letter-spacing: -0.5px">Improve information</h5>
                             <!-- 时间Doi简介信息 -->
                             <el-form ref="Abs_Form" :model="detailMes" :rules="rules" label-width="150px" style="margin-top: 30px">
-                               
                                 <el-form-item label="Doi :" prop="doi">
                                     <span>https://doi.org/10.53388/</span>
                                     <el-input v-model="detailMes.doi" style="margin-left: 10px; width: 325px"> </el-input>
@@ -820,7 +724,7 @@
                                 </el-form-item>
                             </el-form>
                             <div style="text-align: center; margin: 25px 0 0 0">
-                                <el-button type="primary" @click="ZsSaveAbs" style="width: 300px; margin-right: 20px">
+                                <el-button type="primary" @click="ZsSaveAbs" class="save-btn">
                                     <i class="el-icon-check"></i>
                                     Save Essential Information
                                 </el-button>
@@ -846,7 +750,7 @@
                     <div style="height: 1px; background-color: #c5e1f1; width: 100%; margin: 30px 0 20px 0"></div>
 
                     <div style="text-align: center; margin: 25px 0 0 0" v-if="detailMes.proof_state == 0">
-                        <el-button type="primary" @click="TjQdingFirm" style="width: 300px; margin-right: 20px">
+                        <el-button type="primary" @click="TjQdingFirm" class="save-btn">
                             <i class="el-icon-document-checked"></i>
                             Ask the author to confirm
                         </el-button>
@@ -953,7 +857,13 @@
         </el-dialog>
 
         <!-- 预览文章-->
-        <el-dialog :title="`${deMesYul.title}`" :visible.sync="preArtVisible" width="1200px" class="htmlDialog" :close-on-click-modal="false">
+        <el-dialog
+            :title="`${deMesYul.title}`"
+            :visible.sync="preArtVisible"
+            width="1200px"
+            class="htmlDialog"
+            :close-on-click-modal="false"
+        >
             <div class="aArticle">
                 <div class="aArt_doi">
                     {{ deMesYul.journal_title }}
@@ -1084,8 +994,7 @@ export default {
             ],
             detailMes: {
                 type: '',
-                journal_special_id: 'None',
-                
+                journal_special_id: 'None'
             },
             abstract: '',
             opInstal: [],
@@ -1458,47 +1367,40 @@ export default {
         this.getHight();
         window.addEventListener('resize', this.getHight);
         this.getData();
-       
-      
+
         this.getAuthorJG();
         this.getCount();
         this.getWorldPdf();
     },
     methods: {
-        getArticleFinal(id){
+        getArticleFinal(id) {
             // api/Finalreview/getRecord
             this.$api
                 .post('api/Finalreview/getRecord', {
-                    article_id: id,
+                    article_id: id
                     // article_id: 6075
                 })
                 .then((res) => {
-                	console.log('res at line 1460:', res)
+                    console.log('res at line 1460:', res);
                     if (res.status == 1) {
                         this.finalReview = res.data;
-
-                        
-                    }else{
-                        this.finalReview = {reviewer_id: null};
+                    } else {
+                        this.finalReview = { reviewer_id: null };
                     }
-                })
+                });
         },
-        updateChange(content){
-       
-          this.abstract = content
-        
+        updateChange(content) {
+            this.abstract = content;
         },
         getTinymceContent(type) {
             this.$refs.tinymceChild1.getContent(type);
         },
         getContent(type, content) {
-        console.log('content at line 1449:', content)
-        console.log('type at line 1449:', type)
-       
-          
+            console.log('content at line 1449:', content);
+            console.log('type at line 1449:', type);
         },
-          // 跳转文章详情
-          showdetaileditor(data) {
+        // 跳转文章详情
+        showdetaileditor(data) {
             this.$router.push({
                 path: 'articleDetailEditor',
                 query: {
@@ -1543,7 +1445,7 @@ export default {
             this.addFomauthor.p_article_id = this.p_article_id;
             this.addFomschool.p_article_id = this.p_article_id;
             this.UpTypeFile.p_article_id = this.p_article_id;
-this.abstract = ''
+            this.abstract = '';
             const loading = this.$loading({
                 lock: true,
                 text: 'Loading...',
@@ -1558,11 +1460,10 @@ this.abstract = ''
                     if (res.code == 0) {
                         this.detailMes = res.data.production;
                         this.abstract = res.data.production.abstract;
-                        if(this.abstract != ''){
-                            this.$nextTick(()=>{
+                        if (this.abstract != '') {
+                            this.$nextTick(() => {
                                 this.$refs.tinymceChild1.setContent(this.abstract);
-                            })
-                            
+                            });
                         }
                         this.UpTyFIle = res.data.production.file_pdf;
                         this.getArticleFinal(res.data.production.article_id);
@@ -1693,8 +1594,10 @@ this.abstract = ''
                         this.deMesYul.journal_title = res.data.journal.title;
                         let reg = new RegExp('<q>', 'g');
                         let reb = new RegExp('</q>', 'g');
-                        this.deAuthorYul.author = this.deAuthorYul.author.replace(reg, '<sup>');
-                        this.deAuthorYul.author = this.deAuthorYul.author.replace(reb, '</sup>,<span style="margin-left:8px"></span>');
+                        this.deAuthorYul.author = this.deAuthorYul.author ? this.deAuthorYul.author.replace(reg, '<sup>') : '';
+                        this.deAuthorYul.author = this.deAuthorYul.author
+                            ? this.deAuthorYul.author.replace(reb, '</sup>,<span style="margin-left:8px"></span>')
+                            : '';
                         let lastIndex = this.deAuthorYul.author.lastIndexOf(',');
                         this.deAuthorYul.author =
                             this.deAuthorYul.author.substring(0, lastIndex) +
@@ -1850,63 +1753,61 @@ this.abstract = ''
             return e.stage_year + ' Vol.' + e.stage_vol + ' issue.' + e.stage_no + e.stage_pagename + e.stage_page;
         },
         async abstractFormat(content) {
-  content = this.$commonJS.transformHtmlString(content);
-  var div = document.createElement('div');
-  div.innerHTML = content;
+            content = this.$commonJS.transformHtmlString(content);
+            var div = document.createElement('div');
+            div.innerHTML = content;
 
-  // 1. 剔除所有 img 标签
-  var imgTags = div.getElementsByTagName('img');
-  for (var i = imgTags.length - 1; i >= 0; i--) {
-    imgTags[i].parentNode.removeChild(imgTags[i]);
-  }
+            // 1. 剔除所有 img 标签
+            var imgTags = div.getElementsByTagName('img');
+            for (var i = imgTags.length - 1; i >= 0; i--) {
+                imgTags[i].parentNode.removeChild(imgTags[i]);
+            }
 
-  // 2. 新增：剔除所有 table 相关标签（table、tr、td）
-  var tableTags = div.getElementsByTagName('table');
-  for (var i = tableTags.length - 1; i >= 0; i--) {
-    tableTags[i].parentNode.removeChild(tableTags[i]);
-  }
+            // 2. 新增：剔除所有 table 相关标签（table、tr、td）
+            var tableTags = div.getElementsByTagName('table');
+            for (var i = tableTags.length - 1; i >= 0; i--) {
+                tableTags[i].parentNode.removeChild(tableTags[i]);
+            }
 
-  // 3. 替换 strong → b、em → i（原有逻辑）
-  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]);
-  }
-  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]);
-  }
+            // 3. 替换 strong → b、em → i（原有逻辑）
+            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]);
+            }
+            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]);
+            }
 
-  // 处理 p 标签 + 解码
-  content = div.innerHTML;
-  content = content.replace(/^<p>\s*(.*?)\s*<\/p>$/, '$1').trim();
-  content = await this.$commonJS.decodeHtml(content);
-  return content;
-},
+            // 处理 p 标签 + 解码
+            content = div.innerHTML;
+            content = content.replace(/^<p>\s*(.*?)\s*<\/p>$/, '$1').trim();
+            content = await this.$commonJS.decodeHtml(content);
+            return content;
+        },
         // 1----保存稿件信息
-     async   ZsSaveMes() {
-            
-          var abstractStr = "";
+        async ZsSaveMes() {
+            var abstractStr = '';
             if (this.detailMes.journal_stage_id == 0) {
                 this.$message.error('Please select an installment!');
                 return;
             }
-            if (this.abstract == "") {
+            if (this.abstract == '') {
                 this.$message.error('Please input abstract!');
                 return;
-            } else{
+            } else {
                 abstractStr = await this.abstractFormat(this.abstract);
-                 
             }
-              console.log('abstractStr at line 1820:', abstractStr)
-            
+            console.log('abstractStr at line 1820:', abstractStr);
+
             this.$refs.Mes_Form.validate((valid) => {
                 if (valid) {
                     this.$api
-                        .post('api/Production/editProduction', {...this.detailMes,abstract:abstractStr})
+                        .post('api/Production/editProduction', { ...this.detailMes, abstract: abstractStr })
                         .then((res) => {
                             if (res.code == 0) {
                                 this.$message.success(`Successfully save the article!`);
@@ -1929,11 +1830,11 @@ this.abstract = ''
         // 2----添加作者操作
         add_Authorclick(index, row) {
             this.aid = index;
-           this. addFomauthor={
+            this.addFomauthor = {
                 is_first: '0',
                 is_report: '0',
                 organs: []
-            }
+            };
             this.addFomauthor.p_article_id = this.p_article_id;
             this.addAuthor = true;
         },
@@ -2023,7 +1924,7 @@ this.abstract = ''
         // 2----添加机构操作
         add_Schoolclick(index, row) {
             this.aid = index;
-            this.addFomschool={}
+            this.addFomschool = {};
             this.addFomschool.p_article_id = this.p_article_id;
             this.addSchool = true;
         },
@@ -3002,26 +2903,34 @@ this.abstract = ''
             }
         },
 
-        // 滚动条滚动
         onScroll(e) {
-            let scrollItems = document.querySelectorAll('.scroll-item');
-            for (let i = scrollItems.length - 1; i >= 0; i--) {
-                // 判断滚动条滚动距离是否大于当前滚动项可滚动距离
-                let judge = e.target.scrollTop >= scrollItems[i].offsetTop - scrollItems[0].offsetTop;
-                if (judge) {
-                
-                    this.tabIndex = i.toString();
-                    
-                    // 找对应的tab-name值
-                    this.tabName = this.tabsList[this.tabIndex].refName;
-                    // this.tabClick = this.tabsList[this.tabIndex].refName
-                    break;
-                }
+    const scrollContainer = e.target;
+    const scrollItems = document.querySelectorAll('.scroll-item');
+    
+    // 遍历所有滚动项，找到“当前在可视区域内”的项
+    for (let i = 0; i < scrollItems.length; i++) {
+        const item = scrollItems[i];
+        // 计算项相对于滚动容器的位置（顶部距离）
+        const itemTop = item.offsetTop - scrollContainer.offsetTop;
+        // 计算项的底部距离
+        const itemBottom = itemTop + item.offsetHeight;
+
+        // 判断：项的顶部 <= 滚动距离，且项的底部 >= 滚动距离（即项在可视区域内）
+        const isInView = (itemTop <= scrollContainer.scrollTop) && (itemBottom >= scrollContainer.scrollTop);
+        
+        if (isInView) {
+            this.tabIndex = i.toString();
+            // 先判断tabsList是否存在对应索引，避免报错
+            if (this.tabsList[i]) {
+                this.tabName = this.tabsList[i].refName;
             }
-        },
+            break; // 找到第一个匹配的项就停止
+        }
+    }
+},
 
         getHight() {
-            this.contentStyleObj.height = window.innerHeight - 140 + 'px';
+            this.contentStyleObj.height = window.innerHeight - 60 + 'px';
             // this.jumpTab(0,this.tabsList[0])
         }
     },
@@ -3043,6 +2952,27 @@ this.abstract = ''
     color: #888;
     font-size: 12px;
 }
+.bor_style_onli {
+    height: auto !important;
+    overflow: auto;
+    /* min-height: 400px; */
+}
+.save-btn {
+    width: 250px !important;
+    margin: 20px 0px 0px;
+    float: right;
+}
+.operation {
+    zoom: 0.9;
+}
+::v-deep .operation .el-button--mini {
+    font-size: 14px !important;
+    padding: 6px 10px !important;
+}
+.tab_item{
+height: 6vh;
+min-height: 60px;
+}
 </style>
 <style>
 .handle-box {
@@ -3054,11 +2984,12 @@ this.abstract = ''
 }
 
 .tab_post {
+    height: calc(100vh - 60px);
     background-color: #fafafa;
     position: absolute;
-    left: 25px;
-    top: 40px;
-    width: 220px;
+    left: 15px;
+    top: 60px;
+    width: 260px;
     z-index: 50;
 }
 
@@ -3109,7 +3040,14 @@ this.abstract = ''
     position: absolute;
     border: 1px dashed #999;
 }
-.tab_post > div:nth-child(9) .line {
+.tab_post > div:nth-child(8) .line {
+    top: 40px;
+    left: 11px;
+    bottom: -10px;
+    position: absolute;
+    border: 1px dashed #999;
+}
+.tab_post > div:nth-child(10) .line {
     top: 40px;
     left: 11px;
     bottom: -10px;
@@ -3136,7 +3074,7 @@ this.abstract = ''
 }
 
 .scroll-item {
-    margin: 0 30px 50px 255px;
+    margin: 0 2px 50px 280px;
 }
 
 .bor_style_onli {

src/components/page/components/OnlineProofreading/catalogue.vue

@@ -1,14 +1,14 @@
 <template>
     <!-- v-show="tables.length > 0 || images.length > 0" -->
     <div
-        style="background-color: transparent !important; margin-top: 0px !important; height: 100%; padding: 0 !important; overflow: hidden"
+        style=""
         class="ManuscirptList"
     >
         <!-- 图片缩略图区域 -->
 
      
        <div class="title">
-        Contents
+        Reference List
        </div>
         <div
             style=""
@@ -19,11 +19,11 @@
               
                 <li >
                     <div style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: start">
-                        <div @click="goToListComment(item.key)"
+                        <div @click="goToListComment(item.p_refer_id)"
                             v-for="(item, index) in catalogueList"
                             style="width: calc(100%); display: flex; align-items: center; justify-content: space-between; color: #606266"
                         >
-                        <span><span style="color: #888;margin-right: 5px;">{{ index+1 }}.</span>  {{ item.title }}</span>
+                        <div class="doi_box"><span style="color: #888;margin-right: 5px;">{{ index+1 }}.</span> <span class="doi">{{ item.refer_doi }}</span></div>
                      
                             <!-- <div
                                 style="
@@ -462,6 +462,7 @@ export default {
     background-color: none !important;
     box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
     color: #333639;
+    background-color: transparent !important; margin-top: 0px !important; height: 100%; padding: 0 !important; overflow: hidden
 }
 .ManuscirptList div {
     cursor: pointer;
@@ -531,7 +532,7 @@ li {
     background-color: #f8f8f9;
 }
 .arrlist {
-    width: 240px; padding: 20px; height: calc(100% - 30px); box-sizing: border-box; overflow-y: auto;
+    width: 280px; padding: 14px; height: calc(100% - 30px); box-sizing: border-box; overflow-y: auto;
     border-top: 1px solid #ddd;
 }
 .arrlist li{
@@ -658,4 +659,17 @@ li {
     font-size: 18px;
     font-weight: bold;
 }
+.doi_box{
+  width: 100%;
+    display: flex;align-items: center;
+                                    font-size: 14px;
+                                    line-height: 16px;
+}
+.doi{
+    width: calc(100% );
+    white-space: nowrap; 
+    display: inline-block;
+                                    overflow: hidden;
+                                    text-overflow: ellipsis;
+}
 </style>

src/components/page/components/OnlineProofreading/crossref.vue

@@ -0,0 +1,137 @@
+<template>
+    <!-- 绑定 ref 用于获取 iframe 元素 -->
+   <div>
+    
+
+    <el-input 
+      type="textarea"
+      rows="20"
+      v-model="queryTitle" 
+      placeholder="输入参考文献标题查询"
+      @keyup.enter="fetchCrossRefData"
+    ></el-input>
+    <button @click="queryAllReferences">查询参考文献</button>
+    
+    <!-- 展示查询结果 -->
+    <div v-if="referenceList.length">
+      <h3>查询结果（共 {{ totalResults }} 条）</h3>
+      <div v-for="(item, index) in referenceList" :key="index">
+       {{ item }}
+       
+      </div>
+    </div>
+
+   </div>
+  </template>
+  
+  <script>
+  	import axios from 'axios';
+  export default {
+    name: 'IframeFillInput',
+    data() {
+      return {
+        queryTitle: '', // 输入框绑定的查询标题
+        referenceList: [], // 查询结果列表
+        totalResults: 0, // 总结果数量
+        iframeElem: null // iframe 元素引用
+      }
+    },
+    // Vue 2 中通过 ref 获取 DOM 元素，在 mounted 钩子中访问
+    mounted() {
+      // 获取 iframe 元素实例
+      this.iframeElem = this.$refs.crossrefIframe;
+      if (!this.iframeElem) return;
+  
+      // 监听 iframe 加载完成事件（必须等加载完成再操作 DOM）
+      this.iframeElem.addEventListener('load', this.handleIframeLoad);
+    },
+    beforeDestroy() {
+      // 组件销毁前移除事件监听，避免内存泄漏
+      if (this.iframeElem) {
+        this.iframeElem.removeEventListener('load', this.handleIframeLoad);
+      }
+    },
+    methods: {
+      // 示例：查询标题包含“hypertensive nephropathy”的所有文献
+async queryAllReferences() {
+  const queryParams = {
+    'query.title': 'hypertensive nephropathy' // 你的查询条件
+  };
+  const allReferences = await this.fetchTargetReferences(queryParams);
+  console.log('allReferences at line 60:', allReferences)
+  
+  // 后续处理：格式化、查重等
+  // this.formatReferences(allReferences);
+},
+    // 在 Vue 2 组件的 methods 中添加
+// 提取左侧46条的标题，逐个查询API
+async fetchTargetReferences(manualReferences) {
+  const targetResults = [];
+  for (const ref of manualReferences) {
+    try {
+      // 按“标题+作者”精准查询
+      const res = await axios.get('https://api.crossref.org/works', {
+        params: {
+          'query.title': ref.title,
+          'query.author': ref.author,
+          rows: 1 // 只取最匹配的1条
+        }
+      });
+      if (res.data.message.items.length > 0) {
+        targetResults.push(res.data.message.items[0]);
+      } else {
+        // 未匹配到的情况
+        targetResults.push({ ...ref, status: '未找到匹配数据' });
+      }
+    } catch (e) {
+      targetResults.push({ ...ref, status: '查询失败' });
+    }
+    // 限流间隔
+    await new Promise(resolve => setTimeout(resolve, 500));
+  }
+  console.log('左侧46条对应的API数据：', targetResults);
+  return targetResults;
+},
+      // iframe 加载完成后尝试填充输入框
+      handleIframeLoad() {
+        try {
+          // 1. 获取 iframe 内部的文档对象（跨源会直接抛出 DOM 异常）
+          const iframeDoc = this.iframeElem.contentDocument || this.iframeElem.contentWindow.document;
+  
+          // 2. 查找目标 input 框（关键：需知道子页面 input 的选择器，如 id/name/class）
+          // 示例1：通过 name 查找（假设子页面 input 的 name 为 "query"，需按实际调整）
+          const targetInput = iframeDoc.querySelector('input[name="query"]');
+          
+          // 示例2：通过 id 查找（若知道 input 的 id，优先用 id，更稳定）
+          // const targetInput = iframeDoc.getElementById('target-input-id');
+          
+          // 示例3：通过类型+位置查找（第一个文本输入框，不稳定，子页面结构变了就失效）
+          // const targetInput = iframeDoc.querySelectorAll('input[type="text"]')[0];
+  
+          // 3. 若找到 input 框，赋值填充
+          if (targetInput) {
+            targetInput.value = '你想填充的内容'; // 替换为实际要填充的内容
+            
+            // 可选：触发 input 事件（部分页面需要手动触发事件才会识别输入）
+            targetInput.dispatchEvent(new Event('input', { bubbles: true }));
+            targetInput.dispatchEvent(new Event('change', { bubbles: true }));
+          } else {
+            console.log('未找到目标输入框（可能选择器错误或子页面结构变更）');
+          }
+        } catch (e) {
+          // 跨源场景下会进入这里，直接提示跨源限制
+          console.error('填充失败：', e.message);
+          console.warn('原因：跨源访问被浏览器阻止，或子页面有安全限制（子页面非同源且不可控）');
+        }
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  /* 可选：调整 iframe 样式 */
+  iframe {
+    border: 1px solid #eee;
+    border-radius: 4px;
+  }
+  </style>

src/components/page/components/OnlineProofreading/references-format.vue

@@ -0,0 +1,318 @@
+<template>
+    <div
+        style="
+            background-color: #f8f8f8;
+
+            height: 100vh;
+            overflow: hidden;
+            background: linear-gradient(to top, #fbfffe, #ebf9ff);
+            z-index: 9999;
+            border-radius: 10px 10px 0 0;
+            box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+        "
+    >
+        <div class="navbar-default" style="padding: 10px">
+            <div class="nav commonWidth" style="">
+                <div class="title" style="padding: 0 0px; box-sizing: border-box">
+                    <img src="@/assets/img/logo.png" style="width: 30px; height: 20px; margin-right: 10px" />
+                    References
+                </div>
+            </div>
+        </div>
+        <div style="" class="references-container">
+            <div class="commonWidth" style="height:auto; padding:0 20px; box-sizing: border-box;">
+                <p style="padding: 10px 0; color: rgb(51, 51, 51); box-sizing: border-box">Numerical formula:</p>
+                <el-input
+                    id="referenceInput"
+                    v-model="refStr"
+                    type="textarea"
+                    rows="5"
+                    style="width: 100%"
+                    placeholder="Enter each reference in the format of your choice..."
+                ></el-input>
+
+                <!-- 公式显示框 -->
+
+                <div style="margin-top: 10px; overflow: hidden">
+                    <el-button type="primary" @click="processReferences" style="background-color: #1654f7 !important; float: right"
+                        >Format</el-button
+                    >
+                    <el-button @click="clearReferences" style="float: right; margin-right: 10px">Clear</el-button>
+                </div>
+            </div>
+            <div class="commonWidth showReferences" style="" v-if="cleanedReferences.length > 0">
+                <p style="padding: 10px 0; color: rgb(51, 51, 51); box-sizing: border-box">Formatted References: <span>{{cleanedReferences.length}}</span></p>
+                <div class="panel-default">
+                    <div v-for="(ref, index) in cleanedReferences" :key="index" class="reference-item">
+                        {{ ref }}
+                    </div>
+                </div>
+
+                <!-- 公式显示框 -->
+
+                <div style="margin-top: 10px; overflow: hidden">  <el-button type="warning" @click="openCrossref" style=" float: right"
+                        >Copy and open Crossref</el-button
+                    >
+                    <el-button type="primary" @click="copyToClipboard" style="background-color: green !important; float: right;margin-right: 20px"
+                        >Copy</el-button
+                    >
+                  
+                    <!-- <el-button @click="handleCancel" style="float: right; margin-right: 10px">Cancel</el-button> -->
+                </div>
+            </div>
+           
+         
+        </div>
+    </div>
+</template>
+
+<script>
+
+
+export default {
+    props: ['LateXInfo'],
+    data() {
+        return {
+            refStr: '',
+            currentSelect: 0,
+            list: [],
+            cleanedReferences: [],
+            latex: '', // 默认公式
+            mathFieldInstance: null,
+            showLatex: false // 控制 LaTeX 代码框的显示与隐藏
+        };
+    },
+    mounted() {
+   
+    },
+    methods: {
+      
+      
+        copyLatex() {
+            if (this.cleanedReferences.length==0) {
+                return;
+            }
+            if (this.$refs.latexBox) {
+                this.$refs.latexBox.select(); // 选中文本
+                document.execCommand('copy'); // 复制到剪贴板
+                this.$message({
+                    message: 'Replicating Success',
+                    type: 'success'
+                });
+            }
+        },
+        clearReferences() {
+            this.refStr = '';
+            this.cleanedReferences = [];
+        },
+        handleCancel() {
+            this.$emit('close');
+        },
+        processReferences() {
+            const inputText = this.refStr;
+
+            // Split input by newline (\n) to separate each reference
+            const references = inputText
+                .split('\n') // Split by newline
+                .map((ref) => ref.trim()) // Trim each reference to remove extra spaces
+                .filter((ref) => ref !== ''); // Remove empty references (empty lines)
+
+            // Remove DOI URLs and replace 'Available at:' with 'Available at:' followed by a single newline
+            this.cleanedReferences = references.map((ref) =>
+                ref
+                    .replace(/https?:\/\/doi\.org\/\S+/g, '') // Remove both http://doi.org/ and https://doi.org/ URLs
+                    .replace(/Available at:.*/g, 'Available at:') // Replace 'Available at:' and subsequent content
+                    .trim()
+            );
+
+            // Filter out any empty strings from the cleanedReferences array
+            this.cleanedReferences = this.cleanedReferences.filter((ref) => ref !== '');
+
+            // Display formatted references in a list
+            this.displayReferences();
+            // setTimeout(() => {
+            //     window.close();
+            //     // this.$emit('close');
+            // }, 100);
+        },
+        displayReferences() {},
+
+        // Function to copy the formatted references to clipboard
+        copyToClipboard() {
+            const referencesText = this.cleanedReferences.join('\n'); // Join references with newline
+            const textarea = document.createElement('textarea');
+            textarea.value = referencesText;
+            document.body.appendChild(textarea);
+            textarea.select();
+            document.execCommand('copy');
+            document.body.removeChild(textarea);
+            this.$message({
+                    message: 'References copied to clipboard!',
+                    type: 'success'
+                });
+           
+        },
+        async openCrossref(){
+            await  this.copyToClipboard()
+            setTimeout(()=>{
+ window.close();
+            window.open(
+                    'https://apps.crossref.org/SimpleTextQuery',
+                    '_blank',
+                    'width=900,height=600,toolbar=no,scrollbars=no,menubar=no,screenX=240,screenY=100'
+                );
+            },1000)
+           
+        }
+
+    },
+    beforeDestroy() {
+        this.mathFieldInstance = null; // 组件销毁时清除实例
+    }
+};
+</script>
+
+<style scoped>
+.commonWidth {
+    width: 100%;
+    margin: 0 auto;
+    box-sizing: border-box;
+}
+
+.title {
+    font-size: 20px;
+    font-weight: bold;
+    line-height: 30px;
+    background-color: #0f4eb6;
+    color: #fff;
+    display: flex;
+    align-items: center;
+}
+
+.navbar-default {
+    width: 100%;
+    height: 30px;
+    background-color: #0f4eb6;
+    border-color: #e7e7e7;
+}
+
+.math-container {
+    height: 200px;
+    /* padding: 5px; */
+    font-size: 18px;
+    width: 100%;
+}
+
+.formula-box {
+    /* margin-top: 10px;
+    padding: 10px;
+    border: 1px solid #ccc;
+    background-color: #f9f9f9;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start; */
+}
+
+.latex-text {
+    width: 100%;
+    height: 50px;
+    font-size: 16px;
+    padding: 5px;
+    margin-bottom: 10px;
+    resize: none;
+}
+
+::v-deep .ML__virtual-keyboard-toggle {
+    opacity: 1 !important;
+}
+li {
+    line-height: none;
+}
+.panel-default {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    box-sizing: border-box;
+    padding: 10px;
+    /* float: right; */
+    border: 1px solid #ddd;
+    background-color: #fff;
+}
+.panel-heading {
+    color: #333;
+    font-weight: bold;
+    background-color: #f5f5f5;
+    border-color: #ddd;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+.panel-heading div {
+    width: 25%;
+    padding: 5px 0px;
+    line-height: 20px;
+    border-radius: 4px;
+    text-align: center;
+    box-sizing: border-box;
+}
+.isSelect {
+    color: white !important;
+    background: #333;
+    border-radius: 4px;
+}
+.math-block {
+    background-color: #fff;
+    cursor: pointer;
+    background: #f0f0f0;
+    color: #000;
+    display: block;
+    margin: 10px;
+    padding: 6px;
+
+    /* min-height: 40px !important; */
+    border: 1px solid #ddd;
+}
+::v-deep .math-block mjx-container {
+    font-size: 18px !important;
+    margin: 0 !important;
+    text-align: left !important;
+}
+
+.latexBox1 {
+    width: 100%;
+    padding: 10px 140px 10px 10px;
+    box-sizing: border-box;
+    border: 1px solid #ccc;
+    background-color: #f9f9f9;
+    font-size: 18px;
+    resize: none;
+    height: 200px;
+}
+.reference-item {
+    margin-bottom: 4px;
+    display: flex;
+    font-size: 12px;
+    align-items: center;
+    justify-content: space-between;
+}
+.copy-button {
+    margin-top: 10px;
+}
+.references-container {
+    height: calc(100vh - 50px);
+    overflow: auto;
+    padding-top: 20px;
+    box-sizing: border-box;
+   
+}
+::v-deep .el-textarea {
+    height: 100px;
+}
+::v-deep .el-textarea__inner {
+    height: 100px;
+}
+.showReferences {
+    height: calc(100vh - 360px); padding:0 20px; box-sizing: border-box;;
+}
+</style>

src/components/page/publishRefernceEditor.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <!-- publish 引用编辑页面 -->
-    <editPublicRefRdit ref="editPublicRefRdit" :chanFerForm = 'chanFerForm' :gridData = 'gridData' :p_article_id='p_article_id' @ChanFerMashUp="ChanFerMashUp" @refrashComp="refrashComp" @changeRefer="changeRefer"></editPublicRefRdit>
+    <editPublicRefRdit ref="editPublicRefRdit"    :chanFerFormRepeatList="chanFerFormRepeatList" :chanFerForm = "chanFerForm" :gridData = "gridData" :p_article_id='p_article_id' @ChanFerMashUp="ChanFerMashUp" @refrashComp="refrashComp" @changeRefer="changeRefer"></editPublicRefRdit>	
   </div>
 </template>
 
@@ -15,6 +15,7 @@ export default {
         return{
             article_id: this.$route.query.id,
             chanFerForm: [],
+            chanFerFormRepeatList: [],
             gridData: '',
             p_article_id: this.$route.query.pid,
         }
@@ -80,7 +81,8 @@ export default {
 						'p_article_id': this.p_article_id
 					})
 					.then(res => {
-						 this.chanFerForm = res.data.refers                        
+						 this.chanFerForm = res.data.refers;
+						 this.chanFerFormRepeatList = Object.values(res.data.repeat);                        
 						for (var i = 0; i < this.chanFerForm.length; i++) {
 							this.chanFerForm[i].edit_mark = 1
 							if (this.chanFerForm[i].refer_frag != '') {
@@ -128,7 +130,8 @@ export default {
 						'p_article_id': this.p_article_id
 					})
 					.then(res => {
-						this.chanFerForm = res.data.refers
+						this.chanFerForm = res.data.refers;
+						this.chanFerFormRepeatList = Object.values(res.data.repeat);
 						for (var i = 0; i < this.chanFerForm.length; i++) {
 							this.chanFerForm[i].edit_mark = 1
 						}

src/main.js

@@ -208,7 +208,12 @@ const i18n = new VueI18n({
 });
 //使用钩子函数对路由进行权限跳转
 router.beforeEach(async (to, from, next) => {
-  try {
+  const currentRoute = to; // 获取当前路由路径，例如 "/home"
+  console.log('currentRoute at line 211:', currentRoute.meta)
+  if(currentRoute.meta.hideJournal){
+    
+  }else{
+    try {
     // 尝试请求接口（即使失败也继续后续逻辑）
     await Promise.all([
       loadJournalList(),
@@ -217,7 +222,9 @@ router.beforeEach(async (to, from, next) => {
   } catch (err) {
     // 仅打印错误，不阻断路由
 
+  } 
   }
+ 
 
   // 无论接口成功/失败，都执行原有跳转逻辑
   document.title = `${to.meta.title} | Traditional Medicine Research`;

src/router/index.js

@@ -101,6 +101,9 @@ export default new Router({
 			component: () => import('../components/page/articleListEditor_B1.vue'),
 			meta: {
 				title: 'Manuscript typesetting',
+				hideSidebar: true,
+				bgColor: '#fafafa',
+				hideJournal: true
 			},
 			hidden: true
 		},
@@ -1046,7 +1049,8 @@ export default new Router({
 			path: '/ReferenceEditor', //用户端预收录-引用编辑
 			component: () => import('../components/page/ReferenceEditor'),
 			meta: {
-				title: 'Reference Workflow'
+				title: 'Reference Workflow',
+				hideJournal: true
 			}
 		},
 		{
@@ -1054,7 +1058,8 @@ export default new Router({
 			component: () => import('../components/page/GenerateCharts'),
 			meta: {
 				title: 'Text Proofread',
-				hideSidebar: true
+				hideSidebar: true,
+				hideJournal: true
 			}
 		},
 		{
@@ -1062,7 +1067,8 @@ export default new Router({
 			component: () => import('../components/page/OnlineProofreading'),
 			meta: {
 				title: 'Online Proofreading',
-				hideSidebar: true
+				hideSidebar: true,
+				hideJournal: true
 			}
 		},
 		{
@@ -1072,6 +1078,27 @@ export default new Router({
 				title: 'LateX',
 				hideSidebar: true,
 				hideTitle: true,
+				hideJournal: true
+			}
+		},
+		{
+			path: '/References', //用户端预收录-引用编辑
+			component: () => import('../components/page/components/OnlineProofreading/references-format.vue'),
+			meta: {
+				title: 'References',
+				hideSidebar: true,
+				hideTitle: true,
+				hideJournal: true
+			}
+		},
+		{
+			path: '/crossref', //用户端预收录-引用编辑
+			component: () => import('../components/page/components/OnlineProofreading/crossref.vue'),
+			meta: {
+				title: 'crossref',
+				hideSidebar: true,
+				hideTitle: true,
+				hideJournal: true
 			}
 		},
 		{
@@ -1080,7 +1107,10 @@ export default new Router({
 			component: () => import('../components/page/PreIngestedEditor'),
 			meta: {
 
-				title: 'PreIngestedEditor'
+				title: 'PreIngestedEditor',
+				hideSidebar: true,
+				bgColor: '#fafafa',
+				hideJournal: true
 			}
 		},
 		{

vue.config.js

@@ -76,8 +76,8 @@ module.exports = {
 				// target: 'http://192.168.110.110/tougao/public/index.php/',
 				// target: 'http://api.tmrjournals.com/public/index.php/',//正式
 				// target: 'http://zmzm.tougao.dev.com/',//晓玲
-				target: 'https://submission.tmrjournals.com/',//正式
-				// target: 'http://tougaotest.tmrjournals.com/public/index.php/',//测试环境
+				// target: 'https://submission.tmrjournals.com/',//正式
+				target: 'http://tougaotest.tmrjournals.com/public/index.php/',//测试环境
 				changeOrigin: true,
 				pathRewrite: {
 					'^/api': ''