Merge branch 'xie-accept'

src/components/page/PreIngestedEditor.vue

@@ -47,7 +47,7 @@
 			<div :ref="tabsList[0].refName" class="scroll-item">
 				<div class="bor_style_onli">
 					<h4>{{tabsList[0].name}}</h4>
-					<div class="liter_ture">
+					<div class="liter_ture" v-if="0==2">
 						<div class="chanSelLef">
 							<!-- 1 -->
 							<div :class="showB_step ==1?'C_style':''">
@@ -171,6 +171,7 @@
 							</div>
 						</div>
 					</div>
+					<editPublicRefRdit ref="editPublicRefRdit" :chanFerForm = 'chanFerForm' :gridData = 'gridData' :p_article_id='p_article_id' @ChanFerMashUp="ChanFerMashUp" @refrashComp="refrashComp" @changeRefer="changeRefer"></editPublicRefRdit>					
 				</div>
 			</div>
 
@@ -285,7 +286,7 @@
 				{{msgform.title}}
 			</p> -->
 			<div class="talkDialog">
-				<timetalk :talkMsgs="talkMsgs" :msgform="msgform" @talksave="getTalkList"></timetalk>
+				<timetalk :talkMsgs="talkMsgs" :msgform="msgform" @talksave="getTalkList" ></timetalk>
 			</div>
 		</el-dialog>
 
@@ -293,6 +294,7 @@
 </template>
 
 <script>    
+	import editPublicRefRdit from './editPublicRefRdit'        // 公共引用编辑页面
 	import 'quill/dist/quill.core.css';
 	import 'quill/dist/quill.snow.css';
 	import 'quill/dist/quill.bubble.css';
@@ -533,7 +535,7 @@
 				editFomauthor: {},
 				addFomschool: {},
 				editFomschool: {},
-				showB_step: 1,
+				
 				chanFerForm: [],
 				refProcess: 0,
 				refReal: 0,
@@ -701,6 +703,11 @@
 
 		},
 		methods: {  
+			// 刷新引用组件
+			refrashComp(){
+				this.$refs.editPublicRefRdit.$forceUpdate()
+				console.log('editPublicRefRdit')
+			},          
 			// 跳转邮件
 			linkEmail() {
 				this.$router.push({
@@ -886,6 +893,9 @@
 								this.showB_step = 2
 							}
 						}
+						this.$nextTick(()=>{ // 更新引用列表
+							this.$refs.editPublicRefRdit.init(this.chanFerForm)
+						})
 					})
 					.catch(err => {
 						console.log(err);
@@ -1396,6 +1406,7 @@
 
 			// 5----重新获取加载参考文献
 			changeRefer(val) {
+				console.log('重新获取参考文献')
 				this.$api
 					.post('api/Production/getReferList', {
 						'p_article_id': this.p_article_id
@@ -1410,6 +1421,7 @@
 					.catch(err => {
 						console.log(err);
 					});
+					
 			},
 
 
@@ -2175,7 +2187,8 @@
 		},
 		components: {
 			quillEditor,
-			timetalk
+			timetalk,
+			editPublicRefRdit
 		},
 	}
 </script>

src/components/page/ReferenceEditor.vue

@@ -92,12 +92,15 @@
                     <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>
+                        <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.</p>
+                    </li> 
                 </ul>
             </div>
             <div class="refenceCentent mt20">
                 <el-table :data="tableData"  ref="multipleTable" 
               empty-text="New messages (0)" :show-header="false" :stripe="false" :highlight-current-row="false">              
-              <!-- <el-table-column type="index" label="No." width="55" align="center"></el-table-column> -->
+                    <el-table-column type="index" label="No." width="55" align="center"></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_doi != '' && scope.row.author != ''" >
@@ -110,14 +113,20 @@
                     </el-table-column>			
                     <el-table-column  label="Title" align="left">
                         <template slot-scope="scope">
-                            <div style="text-align: left;" v-if="scope.row.refer_doi != '' && scope.row.author != ''">
+                            <!-- journal 形式 -->
+                            <div style="text-align: left;" v-if="scope.row.refer_type == 'journal'">
                                 <p>{{scope.row.author}},{{scope.row.title}}, <em>{{scope.row.joura}}</em> ,{{scope.row.dateno}}<br/></p>
                                 <a class="doiLink" :href="scope.row.doilink" target="_blank">{{scope.row.doilink}}</a>                         
                             </div>
-                            <p class="wrongLine" style="text-align: left;" v-else>
+                            <!-- book 形式 -->
-                                {{scope.row.refer_content}}                                                                  
+                            <div style="text-align: left;" v-if="scope.row.refer_type == 'book'">
+                                <p>{{scope.row.author}},{{scope.row.title}},{{scope.row.dateno}}<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">
@@ -136,36 +145,87 @@
         </div>    
       </div>
       <!-- 修改引用 -->
-      <el-dialog v-loading="addLoading"  :title= "dialogTitle + ' References'" :visible.sync="editboxVisible" width="500px" @close="cancelSave">
+      <el-dialog v-loading="addLoading"  :title= "dialogTitle + ' References'" :visible.sync="editboxVisible" width="800px" @close="cancelSave">
-                <p class="yinyongPre c888">现在您可以添加或者修改您的引用文献信息，如果您有引用文献的Doi数据，可以直接复制到Doi输入框，并提交，系统会自动识别您的引用文献，如果您没有Doi数据，也可以打开“Show Content”开关，直接填写您的引用文献内容。</p>
+                <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 input box and submit it. If this reference doesn’t have the DOI, please turn on the No DOI button, and write all details of this reference according to the hints.</p>
-                <p v-if="dialogTitle == 'Add'">There is no Doi data:  <el-switch v-model="contentVisible"></el-switch></p>
+                              
-                <el-form v-show="!contentVisible" :model="refenceForm" :rules="refenceFormrules" ref="refenceForm" label-width="80px" class="editForm mt10">
+                <el-form  :model="refenceForm" :rules="refenceFormrules" ref="refenceForm" label-width="150px" class="editForm mt10">
                     <!-- 内容开关 -->          
-                    <el-form-item label="Doi:" required  prop="refer_doi" >
+                    <el-form-item label="Source:" >  
-                        <el-input  v-model="refenceForm.refer_doi" ></el-input>
+                        <el-select v-model="SourceType" placeholder="please pick">
+                            <el-option
+                            v-for="item in sourceOptions"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                        </el-select>
                     </el-form-item>
+                    <!-- Journal -->
+                    <div v-show="SourceType == 'journal' || SourceType == 'doi'" >        
+                        <el-form-item label="Doi:" required  prop="doi" >
+                            <el-input  v-model="refenceForm.doi" >
+                                <el-button  @click="gotoFormate" slot="append" >Formate</el-button>
+                            </el-input>
+                        </el-form-item>                         
+                    </div> 
+                    <el-form-item  >
+                        <div class="line"></div>
+                    </el-form-item>
+                    <!-- 中间部分 -->
+                    <div v-show="SourceType !='other'">
+                        <el-form-item label="Author(s):" required  prop="author" >
+                            <el-input  v-model="refenceForm.author" ></el-input>
+                            <p class="zhushi">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”</p>
+                        </el-form-item>
+                        <el-form-item label="Title:" required  prop="title" >
+                            <el-input  v-model="refenceForm.title" placeholder="eg: Tradit Med Res"></el-input>
+                            <p class="zhushi">Abbreviated Journal Title</p>
+                        </el-form-item>                        
+                        <el-form-item label="Publication Details:" required  prop="dateno" >
+                            <el-input  v-model="refenceForm.dateno" placeholder="eg: 2023;8(9):49-62"></el-input>
+                            <p class="zhushi">Year;Volume(issue):Inclusive page numbers.</p>
+                        </el-form-item>                        
+                    </div>
+                    <div v-show="SourceType == 'journal'">
+                        <el-form-item label="Joura:" required  prop="joura" >
+                            <el-input  v-model="refenceForm.joura" placeholder=""></el-input>                            
+                        </el-form-item>
+                        <el-form-item label="DOI/URL:" required  prop="doilink" >
+                            <el-input  v-model="refenceForm.doilink" placeholder="eg:https://doi.org/10.1002/cncr.30667"></el-input>
+                        </el-form-item>
+                    </div>
+                     <!-- Book -->
+                    <div v-show="SourceType =='book'">                       
+                        <el-form-item label="ISBN:" required  prop="isbn" >
+                            <el-input  v-model="refenceForm.isbn" ></el-input>
+                        </el-form-item>
+                    </div>
+                    <!-- others -->
+                    <div v-show="SourceType =='other'">
+                        <el-form-item label="Content:" required  prop="content" >
+                            <el-input type="textarea" rows="5"  v-model="refenceForm.content" placeholder="please refer to the AMA manual of style (10th ed.)"></el-input>
+                        </el-form-item>
+                    </div>
                 </el-form> 
-                <el-form v-show="contentVisible" :model="refenceLinkForm" :rules="refenceLinkFormrules" ref="refenceLinkForm" label-width="80px" class="editForm mt10">
+                <!-- <el-form  :model="refenceLinkForm" :rules="refenceLinkFormrules" ref="refenceLinkForm" label-width="80px" class="editForm mt10">                     
-                    <!-- 内容开关 -->
+                    <el-form-item label="Author(s):" required prop="author" >
-                    <!-- <el-form-item label="There is no Doi data" label-width="160px">                        
+                        <el-input  v-model="refenceLinkForm.author" placeholder=""></el-input>
-                        <el-switch v-model="contentVisible"></el-switch>
-                    </el-form-item>                     -->
-                    <el-form-item label="author:" required prop="author" >
-                        <el-input  v-model="refenceLinkForm.author" placeholder="eg:Kagabu M, Nagasawa T, Fukagawa D, et al."></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:Immunotherapy for Uterine Cervical Cancer."></el-input>
+                        <el-input  v-model="refenceLinkForm.title" placeholder="eg: Tradit Med Res"></el-input>
                     </el-form-item> 
-                    <el-form-item label="joura:" required prop="joura" >
+                    <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="dateno:" required prop="dateno" >
+                    <el-form-item label="Publication Details:" required prop="dateno" >
-                        <el-input  v-model="refenceLinkForm.dateno" placeholder="eg:2019 Sep 17;7(3):108."></el-input>
+                        <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>            
+                </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>
@@ -219,7 +279,21 @@
             importIoading: false,
             baseUrl: this.Common.baseUrl,
             addLoading:false,
-            contentVisible:false,
+            SourceType:'journal',
+            sourceOptions:[
+            {
+                value: 'journal',
+                label: 'journal'
+            },
+            {
+                value: 'book',
+                label: 'book'
+            },
+            {
+                value: 'other',
+                label: 'other'
+            },
+            ],
             // 引用数据列表
               tableData:[              
               ],    
@@ -238,39 +312,72 @@
               },
               // 引用表单
               refenceForm:{                
-                refer_doi:'',
+                doi:'',                
+                article_id:null, 
                 p_refer_id:null, // 当前行一行的引用序号
+                pre_p_refer_id:null,  // 上一行
+                refer_type:'',  // 类型
+                joura:'',
+                author:'',
+                doilink:'',
+                dateno:'',
+                isbn:'',
+                content:'',
+                title:''
+                
               },
               refenceFormrules:{
-                refer_doi:[
+                doi:[
                 { required: true, message: 'The Doi cannot be empty', trigger: 'blur' },
-                ]
+                ],
-              },
+                joura:[
-              // 引用表单
+                { required: true, message: 'The Joura cannot be empty', trigger: 'blur' },
-              refenceLinkForm:{
+                ],
-                author:'',
-                title:'',
-                joura:'',
-                dateno:'',
-                doilink:'',
-                pre_p_refer_id:null, // 当前行一行的引用序号,                
-                article_id: null,
-                p_refer_id: null
-              },
-              refenceLinkFormrules:{
                 author:[
-                { required: true, message: 'The author cannot be empty', trigger: 'blur' },
+                { required: true, message: 'The Author(s) cannot be empty', trigger: 'blur' },
                 ],
                 title:[
                 { required: true, message: 'The title cannot be empty', trigger: 'blur' },
                 ],
-                dateno:[
-                { required: true, message: 'The dateno cannot be empty', trigger: 'blur' },
-                ],
                 doilink:[
-                { required: true, message: 'The doilink cannot be empty', trigger: 'blur' },
+                { required: true, message: 'The doi/url cannot be empty', trigger: 'blur' },
-                ]                
+                ],
+                dateno:[
+                { required: true, message: 'The Publication Details cannot be empty', trigger: 'blur' },
+                ],
+                isbn:[
+                { required: true, message: 'The ISBN cannot be empty', trigger: 'blur' },
+                ],
+                content:[
+                { required: true, message: 'The Content cannot be empty', trigger: 'blur' },
+                ],
               },
+              // 引用表单
+            //   refenceLinkForm:{
+            //     author:'',
+            //     title:'',
+            //     joura:'',
+            //     dateno:'',
+            //     doilink:'',
+            //     pre_p_refer_id:null, // 当前行一行的引用序号,                
+            //     article_id: null,
+            //     p_refer_id: null,
+                
+            //   },
+            //   refenceLinkFormrules:{
+            //     author:[
+            //     { required: true, message: 'The author cannot be empty', trigger: 'blur' },
+            //     ],
+            //     title:[
+            //     { required: true, message: 'The title cannot be empty', trigger: 'blur' },
+            //     ],
+            //     dateno:[
+            //     { required: true, message: 'The dateno cannot be empty', trigger: 'blur' },
+            //     ],
+            //     doilink:[
+            //     { required: true, message: 'The doilink cannot be empty', trigger: 'blur' },
+            //     ]                
+            //   },
               dialogTitle:''
           }
       },
@@ -280,6 +387,27 @@
          this.holeLoading = true
       },
       methods:{ 
+        // 格式化
+        gotoFormate(){
+            this.$refs['refenceForm'].validateField('doi', (callback)=>{              
+            if(callback == ''){
+                this.$api
+                .post('/api/Preaccept/searchDoi',{'doi': this.refenceForm.doi})
+					.then(res => {
+						console.log(res)
+                        if(res.code == 0 ){
+                            //this.tableData = res.data.refers                            
+                        }else{
+                            this.$message.error(res.msg)
+                        }
+
+                        this.holeLoading = false
+					}).catch(()=>{})
+                }else{
+                    console.log('不合格')
+                 }
+            })
+        },
         // 全页面加载动画
             openFullScreen1() {
             this.holeLoading = true;            
@@ -349,22 +477,20 @@
           change(row, optitle){   
             this.dialogTitle = optitle     
             this.editboxVisible = true
+            // console.log(this.refenceForm.content,55555)
             this.$nextTick(() => {               
-                if(row.is_web == 0){
+                    console.log(row,'row')
-                    // 有doi row.is_web: 00
+                    this.refenceForm.doi = row.refer_doi
-                    this.refenceForm.refer_doi = row.refer_doi
                     this.refenceForm.p_refer_id = row.p_refer_id    
-                }else{
+                    this.SourceType = row.refer_type                    
-                    // 无doi row.is_web: 1
+                    this.refenceForm.author = row.author
-                    this.contentVisible = true
+                    this.refenceForm.title = row.title
-                    this.refenceLinkForm.article_id = this.$route.query.id
+                    this.refenceForm.joura = row.joura
-                    this.refenceLinkForm.p_refer_id = row.p_refer_id
+                    this.refenceForm.dateno = row.dateno
-                    this.refenceLinkForm.author = row.author
+                    this.refenceForm.doilink = row.doilink 
-                    this.refenceLinkForm.title = row.title
+                    this.refenceForm.content = row.refer_frag
-                    this.refenceLinkForm.joura = row.joura
+                    this.refenceForm.joura = row.joura 
-                    this.refenceLinkForm.dateno = row.dateno
+                    this.refenceForm.isbn =  row.isbn              
-                    this.refenceLinkForm.doilink = row.doilink 
-                }
              })
 
           },
@@ -375,59 +501,85 @@
            // refenceForm
            this.$refs['refenceForm'].clearValidate();            
            this.$refs['refenceForm'].resetFields(); 
-            
+            this.refenceForm.doi = ''
-           this.$refs['refenceLinkForm'].clearValidate();            
-           this.$refs['refenceLinkForm'].resetFields(); 
-
-            this.refenceForm.refer_doi = ''
             this.dialogTitle = ''           
           }, 
 
           // 编辑引用
           saveChange(){   
-            if(this.contentVisible){ // 无doi形式
-                this.editNoneDoi()
-            }else{
-                this.editHaveDoi()
-            }
                 
-          },
+            var journalValid = false
-          //  编辑无doi
+            var bookValid = false
-          editNoneDoi(){
+            var otherValid = false
-            this.$refs.refenceLinkForm.validate((valid) => {                              
+            if(this.SourceType == 'journal') {
-                this.addLoading = true
+                // Journal形式
-                if(valid){
+                var doi = ''
-                    this.$api
+                var author = ''
-					.post('api/Preaccept/editReferNotdoi', this.refenceLinkForm)
+                var title = ''
-					.then(res => {
+                var dateno = ''
-						if (res.code == 0) {
+                var joura = ''
-                            this.addLoading = false 
+                var doilink = ''
-                            this.$message.success('successed!')  
+                this.$refs['refenceForm'].validateField('doi',(callback)=>{ 
-                            this.cancelSave()                          
+                    doi = callback
-                            this.getRefData()  
+                }) 
+                this.$refs['refenceForm'].validateField('author',(callback)=>{ 
+                    author = callback
+                }) 
+                this.$refs['refenceForm'].validateField('title',(callback)=>{ 
+                    title = callback
+                }) 
+                this.$refs['refenceForm'].validateField('dateno',(callback)=>{ 
+                    dateno = callback
+                })
+                this.$refs['refenceForm'].validateField('joura',(callback)=>{ 
+                    joura = callback
+                })
+                this.$refs['refenceForm'].validateField('doilink',(callback)=>{ 
+                    doilink = callback
+                })
+                doi == '' && author == '' && title == '' && dateno == '' && joura == '' && doilink == '' ? journalValid = true :''
+             }else if(this.SourceType == 'book'){
+                // book 形式
+                var author = ''
+                var title = ''
+                var dateno = ''
+                var isbn = ''
+                this.$refs['refenceForm'].validateField('author',(callback)=>{ 
+                    author = callback
+                }) 
+                this.$refs['refenceForm'].validateField('title',(callback)=>{ 
+                    title = callback
+                }) 
+                this.$refs['refenceForm'].validateField('dateno',(callback)=>{ 
+                    dateno = callback
+                })
+                this.$refs['refenceForm'].validateField('isbn',(callback)=>{ 
+                    isbn = callback
+                })
+                author == '' && title == '' && dateno == '' && isbn == '' ? bookValid = true : ''
+             }else if(this.SourceType == 'other'){
+                // others 形式
+                var content = ''
+                this.$refs['refenceForm'].validateField('content',(callback)=>{ 
+                    content = callback
+                }) 
+                content == '' ? otherValid = true : ''
+             }
+            // console.log(otherValid,99)
              
-                        } else {
+             if(journalValid || bookValid || otherValid){    // 有任意一个模式符合验证规则就提交 
-							this.$message.error(res.msg);
+                this.editRefSave()
-						}
+             }
-					})
-					.catch(err => {
-						this.$message.error(err);
-					});
-                }
-            })
           },
 
-          // 编辑有doi
+          //  提交引用修改          
-          editHaveDoi(){            
+          editRefSave(){            
-            this.$refs.refenceForm.validate((valid) => {
+                this.refenceForm.refer_type = this.SourceType
                 this.addLoading = true
-                if(valid){                                    
+                   console.log(this.refenceForm) 
+                                   
                      this.$api
-					.post('api/Preaccept/editRefer', {
+					.post('api/Preaccept/editRefer', this.refenceForm)
-						// 'article_id': this.$route.query.id,
-                        'p_refer_id': this.refenceForm.p_refer_id,
-                        'doi': this.refenceForm.refer_doi
-					})
 					.then(res => {
 						if (res.code == 0) {
                             this.addLoading = false
@@ -444,44 +596,77 @@
 					.catch(err => {
 						this.$message.error(err);
 					});                
-                }else{
              
-                } 
-              }) 
           },
 
           // 保存新增
           saveAdd(){ 
-            if(this.contentVisible){ // 无doi形式                                                        
+            var journalValid = false
-                this.$refs.refenceLinkForm.validate((valid) => {               
+            var bookValid = false
-                if(valid){ 
+            var otherValid = false
-                    this.addLoading = true
+            if(this.SourceType == 'journal') {
-                    this.$api
+                // Journal形式
-					.post('api/Preaccept/addReferNotdoi', this.refenceLinkForm)
+                var doi = ''
-					.then(res => {
+                var author = ''
-						if (res.code == 0) {
+                var title = ''
-                            this.addLoading = false
+                var dateno = ''
-                            this.$message.success('successed!')
+                var joura = ''
-                            this.editboxVisible = false
+                var doilink = ''
-                            this.getRefData()
+                this.$refs['refenceForm'].validateField('doi',(callback)=>{ 
-                            this.cancelSave() 
+                    doi = callback
-						}
-					})
-					.catch(err => {
-						this.$message.error(err);
-					});
-                }
                 }) 
-            }else{ // 有doi形式
+                this.$refs['refenceForm'].validateField('author',(callback)=>{ 
-            this.$refs.refenceForm.validate((valid) => {               
+                    author = callback
-                if(valid){
+                }) 
+                this.$refs['refenceForm'].validateField('title',(callback)=>{ 
+                    title = callback
+                }) 
+                this.$refs['refenceForm'].validateField('dateno',(callback)=>{ 
+                    dateno = callback
+                })
+                this.$refs['refenceForm'].validateField('joura',(callback)=>{ 
+                    joura = callback
+                })
+                this.$refs['refenceForm'].validateField('doilink',(callback)=>{ 
+                    doilink = callback
+                })
+                doi == '' && author == '' && title == '' && dateno == '' && joura == '' && doilink == '' ? journalValid = true :''
+             }else if(this.SourceType == 'book'){
+                // book 形式
+                var author = ''
+                var title = ''
+                var dateno = ''
+                var isbn = ''
+                this.$refs['refenceForm'].validateField('author',(callback)=>{ 
+                    author = callback
+                }) 
+                this.$refs['refenceForm'].validateField('title',(callback)=>{ 
+                    title = callback
+                }) 
+                this.$refs['refenceForm'].validateField('dateno',(callback)=>{ 
+                    dateno = callback
+                })
+                this.$refs['refenceForm'].validateField('isbn',(callback)=>{ 
+                    isbn = callback
+                })
+                author == '' && title == '' && dateno == '' && isbn == '' ? bookValid = true : ''
+             }else if(this.SourceType == 'other'){
+                // others 形式
+                var content = ''
+                this.$refs['refenceForm'].validateField('content',(callback)=>{ 
+                    content = callback
+                }) 
+                content == '' ? otherValid = true : ''
+             }
+            // console.log(otherValid,99)
+             
+             if(journalValid || bookValid || otherValid){    // 有任意一个模式符合验证规则就提交                       
+                      
+                    this.refenceForm.refer_type = this.SourceType  
+                    // console.log(this.refenceForm,99)                                
                     this.addLoading = true
                     this.$api
-					.post('api/Preaccept/addRefer', {
+					.post('api/Preaccept/addRefer', this.refenceForm)
-						'article_id': this.$route.query.id,
-                        'pre_p_refer_id': this.refenceForm.p_refer_id,
-                        'doi': this.refenceForm.refer_doi
-					})
 					.then(res => {
 						if (res.code == 0) {
                             this.addLoading = false
@@ -501,12 +686,12 @@
 					.catch(err => {
 						this.$message.error(err);
 					});
-                }else{
+                
-                    this.$message.error('error submit!!');
+             }else{
-                    return false;
+                return false
-                }
+             }            
-                })
+            
-            }
+            
           },
           beforeupload_manuscirpt(file) {
 				let flieArr = file.name.split(".")  
@@ -595,17 +780,18 @@
             },
             // 添加一行
             addLine(row, optitle){
-                //console.log(row)  
+               // console.log(row)  
                 this.dialogTitle = optitle             
                 // this.$refs['refenceForm'].clearValidate()
                 this.editboxVisible = true                
-                this.refenceForm.p_refer_id = row.p_refer_id
+                this.refenceForm.pre_p_refer_id = row.p_refer_id
+                this.refenceForm.article_id = this.$route.query.id
 
-                this.refenceLinkForm.pre_p_refer_id = row.p_refer_id
+                // this.refenceLinkForm.pre_p_refer_id = row.p_refer_id
-                this.refenceLinkForm.article_id = this.$route.query.id
+                 //this.refenceLinkForm.article_id = this.$route.query.id
                
                 this.$nextTick(()=>{
-                    this.$refs['refenceForm'].clearValidate(['refer_doi']);
+                    this.$refs['refenceForm'].clearValidate(['doi']);
                 })
             },
 
@@ -678,11 +864,13 @@
 			},        
       },
       watch: {
-        contentVisible: {
+        SourceType : {
         handler(newVal, oldVal) {  
             this.$nextTick(()=>{ 
-                this.$refs['refenceLinkForm'].clearValidate()                
+               // console.log('清空验证信息')                 
+              //  this.$refs['refenceLinkForm'].clearValidate()                
                 this.$refs['refenceForm'].clearValidate()    
+               // this.$refs['refenceForm'].resetFields()     // 表单重置                           
             })           
         },
        // immediate: true,
@@ -693,6 +881,7 @@
   </script>
   
   <style  scoped> 
+  .line{border: 1px dashed #ebebeb; margin: 15px 0;}
  .tip{background: #e6effb; padding: 2px; font-style: normal; border-radius:10px ;}
   .wrongLine{ color: #f15f44;}
   .doiLink{color: #409EFF;}
@@ -721,7 +910,7 @@
   .noneData{ margin:30px 0; padding: 20px; border:3px dashed  #F8F8F8; }
   .noneData img{display: block; margin: 10px auto; opacity: .5; width: 100px;}
   .nodatatext{color: #666; text-align: center;}
-  .inlinebutton{}
+  .zhushi{color: #999; font-size: 12px;}
  .whoDo{background: #EEF7F9; padding: 30px;}
 
   .whoDo ul{padding-left: 20px;}

src/components/page/articleAdd.vue

@@ -326,7 +326,7 @@
 									Only Word and compressed files can be uploaded (file format: .docx).
 								</div>
 							</el-upload>
-							</a>
+							
 						</el-form-item>
 						<el-form-item label="Supplementary Material :" label-width="200px">
 							<el-upload class="upload-demo up_newstyle" :action="upload_supplementary" accept=".zip"

src/components/page/articleListEditor_E.vue

@@ -192,7 +192,7 @@
 
 
 		<!-- Html排版 -->
-		<el-dialog title="HTML layout" :visible.sync="HtmlVisible" width="900px" :close-on-click-modal="false">
+		<el-dialog title="HTML layout" :visible.sync="HtmlVisible" width="900px" :close-on-click-modal="false" @close="CancelHtml">
 			<div style="margin: 0 0 0 10px;" class="htmlfile">
 				<h3 style="font-size: 16px;margin-bottom: 25px;line-height: 22px;letter-spacing: -0.5px;word-break: break-word;"
 					v-html="UpHtpFIle.title"></h3>
@@ -223,31 +223,103 @@
 							can be uploaded(.pdf)</div>
 					</el-upload>
 				</div> -->
-				<div style="border-top: 2px dashed #0066994d;margin: 20px 0 0 0;padding: 20px 0 0 0;">
+				<p style="border-top: 2px dashed #0066994d;margin: 20px 0 0 0;padding: 20px 0 0 0;"> </p>
-					<font style="font-size: 16px;">Html Layout :</font>
+				<el-collapse  v-model="collapseActiveNames">
-					<span style="margin-left: 15px;color: #666;" v-if="UpHtpFIle.mains==''">No Layout</span>
+					<el-collapse-item name="html">
-					<span style="margin-left: 15px;color: #0b4b6a;" v-if="UpHtpFIle.mains!=''">Typesetting
+						<template slot="title">
-						completed</span>
+							Html Layout : 
-					<el-button type="primary" icon="el-icon-document-copy" @click="htmlLayout()"
+							<span style="margin-left: 15px;color: #666;" v-if="UpHtpFIle.mains==''">No Layout</span>
-						style="margin-left: 20px;">
+							<span style="margin-left: 15px;color: #0b4b6a;" v-if="UpHtpFIle.mains!=''">Typesetting completed</span>
-						<font v-if="UpHtpFIle.mains==''">Creat Html Proofread</font>
+							<!-- <el-button v-if="UpHtpFIle.mains==''" type="text" plain icon="el-icon-document-copy" @click="showCreateHtmlItem()"
-						<font v-if="UpHtpFIle.mains!=''">Edit Html Proofread</font>
+											style="margin-left: 20px;">
-					</el-button>
+											<font >Create Html Proofread</font>											
-					<div class="titHtml" v-if="UpHtpFIle.mains!=''">
+										</el-button> -->
-						<div v-for="(item,index) in UpHtpFIle.mains">
+							<el-button v-if="UpHtpFIle.mains!=''" type="primary" plain icon="el-icon-document-copy" @click="htmlLayout()"
-							<p v-html="item.content" v-if="item.width==0"></p>
+											style="margin-left: 20px;">											
-							<p v-if="item.width!=0" class="MaxPicture">
+											<font >Edit Html Proofread</font>
-								<img :src="baseUrl+'public/mainimg/'+item.content" :style="'width:'+item.width+'px'">
+							</el-button>
-								<font :style="'width:'+item.width+'px'">{{item.note}}
+						</template>
-								</font>
+						<div>
-							</p>
+							<!-- 生成选项 -->
-						</div>
+							<div v-if="UpHtpFIle.mains==''">
-					</div>
+								<el-radio v-model="createType" label="1">使用稿件最终版生成html</el-radio>
+  								<el-radio v-model="createType" label="2">重新上传word文件生成html</el-radio>
+								<!-- 方式是重新上传，且没有上传文件时，按钮不可用 -->
+								<el-button type="primary" @click="htmlLayout" class="import" v-if="createType=='2' && fileL_manuscirpt != '' || createType=='1'">Create Html Proofread</el-button> 
+								<!-- 文件上传 -->
+								  <div style="margin: 20px 0 0 0" v-if="createType == '2'">
+									<el-upload ref="uploadFile" class="upload-demo up_newstyle" :action="upload_manuscirpt"
+										accept=".docx" name="completedManuscirpt" :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 File</em>
+										</div>
+										<!-- <div class="el-upload__tip" slot="tip">
+											Only Word and compressed files can be uploaded (file format: .docx).
+										</div> -->
+									</el-upload>
+								</div>
+								
+								<!-- end -->
+							</div>
+							<!-- end -->
+										<div class="titHtml" v-if="UpHtpFIle.mains!=''">
+											<div v-for="(item,index) in UpHtpFIle.mains">
+												<p v-html="item.content" v-if="item.width==0"></p>
+												<p v-if="item.width!=0" class="MaxPicture">
+													<img :src="baseUrl+'public/mainimg/'+item.content" :style="'width:'+item.width+'px'">
+													<font :style="'width:'+item.width+'px'">{{item.note}}
+													</font>
+												</p>
+											</div>
+										</div></div>						
+					</el-collapse-item>
+					<el-collapse-item name="references">
+						<template slot="title">
+							References : 
+							<span style="margin-left: 15px;color: #666;" v-if="UpHtpFIle.refers==''">Have no refernces</span>
+							<span style="margin-left: 15px;color: #0b4b6a;" v-if="UpHtpFIle.refers!=''">There are {{UpHtpFIle.refers.length}} pieces of data in total.</span>
+							<el-button type="primary" plain icon="el-icon-document-copy" @click="goEditRefernces"
+											style="margin-left: 20px;">											
+								<font >Edit References</font>											
+							</el-button>
+						</template>
+							<div>
+								<el-table class="table99" v-if="UpHtpFIle.refers!=''" height="400px" :header-cell-style="{background:'#eef1f6',color:'#606266'}"
+								:data="UpHtpFIle.refers"
+								stripe
+								style="width: 100%">
+								<el-table-column
+								type="index" align="center"
+								width="50">
+								</el-table-column>
+								<el-table-column								
+								label="CONTENT" align="center"
+								>
+								<template slot-scope="scope">
+									<div style="text-align: left;" v-if="scope.row.refer_type == 'journal'">
+										<p>{{scope.row.author}},{{scope.row.title}}, <em>{{scope.row.joura}}</em> ,{{scope.row.dateno}}<br/></p>
+										<a class="doiLink" :href="scope.row.doilink" target="_blank">{{scope.row.doilink}}</a>                         
+									</div>
+									<div style="text-align: left;" v-if="scope.row.refer_type == 'book'">
+										<p>{{scope.row.author}},{{scope.row.title}},{{scope.row.dateno}}<br/></p>
+										<a class="doiLink" :href="scope.row.isbn" target="_blank">{{scope.row.isbn}}</a>                         
+									</div>
+									<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>
+							</div>						
+					</el-collapse-item>
+				</el-collapse>	
 				
-				</div>
 			</div>
 			<span slot="footer" class="dialog-footer">
-				<el-button @click="HtmlVisible = false" plain>Cancel</el-button>
+				<el-button @click="CancelHtml" plain>Cancel</el-button>
 			</span>
 		</el-dialog>
 
@@ -258,9 +330,15 @@
 	import {
 		Loading
 	} from 'element-ui';
+import { watch } from 'vue';
 	export default {
 		data() {
 			return {
+				articleId:null,
+				createType:'1',    // html生成方式
+				collapseActiveNames:['html'], // 手风琴绑定值
+				// oldFile:false,   // 是否用新文件生成  
+				fileL_manuscirpt: [],
 				baseUrl: this.Common.baseUrl,
 				mediaUrl: this.Common.mediaUrl,
 				username: localStorage.getItem('U_name'),
@@ -291,6 +369,7 @@
 					article_id: '',
 					htmlfile: '',
 					mains: [],
+					refers:[], //引用参数
 				},
 				UpLoadFile: {
 					article_id: '',
@@ -309,11 +388,23 @@
 				chooseData: [],
 				loading: false,
 				steps_jour: 0,
+				form:{
+					manuscirpt: '',
+				},
+				fileData:'' // 上传后返回的文件url
 			};
 		},
 		created() {
 			this.getJourDate();
 		},
+		computed: {			
+			upload_coverLetter: function() {
+				return this.baseUrl + 'api/Article/up_file/type/coverLetter';
+			},
+			upload_manuscirpt: function() {
+				return this.baseUrl + '/api/Production/up_last_artFile';
+			},
+		},
 		methods: {			
 			// 获取列表
 			getDate() {
@@ -335,6 +426,65 @@
 						loading.close();
 					});
 			},
+			// 跳转到引用编辑页面
+			goEditRefernces(){
+				// let pid = null
+				this.HtmlVisible = false
+				//this.UpHtpFIle.refers.length > 0 ? pid = this.UpHtpFIle.refers[0].p_article_id : 
+				this.$router.push({
+					name: 'publishRefernceEditor',
+						query: {
+							id: this.articleId,
+							pid: this.UpHtpFIle.refers[0].p_article_id
+						}
+				})
+			},
+			CancelHtml(){
+				this.HtmlVisible = false
+				this.form.manuscirpt = ''
+				this.fileData = ''
+				this.fileL_manuscirpt = []
+				this.createType = '1'    // html生成方式
+				this.collapseActiveNames = ['html']
+				
+			},
+			showCreateHtmlItem(){
+				this.collapseActiveNames[0] = 'html'
+				//console.log(this.collapseActiveNames)
+			},
+			beforeupload_manuscirpt(file) {
+				let flieArr = file.name.split(".")
+				let fileSuffix = flieArr[flieArr.length - 1];
+				if (fileSuffix != 'docx') {
+					this.$message.error('Only word and compressed files can be uploaded(.docx)');
+					return false;
+				}				
+			},
+			upSuccess_manuscirpt(res, file) {
+				if (res.code == 0) {				
+					 this.fileData = res.upurl
+					this.form.manuscirpt = 'manuscirpt/' + res.upurl;
+					this.fileL_manuscirpt = [{}];
+					this.fileL_manuscirpt[0].name = "Manuscirpt File";
+					this.fileL_manuscirpt[0].url = 'manuscirpt/' + res.upurl;					
+				} else {
+					this.$message.error('service error: ' + res.msg);
+				}
+			},
+			//超出传送文件个数限制
+			alertlimit() {
+				this.$message.error('The maximum number of uploaded files has been exceeded');
+			},
+			removefilemanuscirpt(file, fileList) {
+				this.form.manuscirpt = '';
+				this.fileL_manuscirpt = [];				
+			},
+			clearUploadedFile() {
+				this.$refs['uploadFile'].clearFiles();
+			},
+			uperr_coverLetter(err) {
+				this.$message.error('Upload error');
+			},
 			
 			//初始化期刊分期
 			getJourDate() {
@@ -640,7 +790,9 @@
 
 			// 文章html弹出层
 			htmlContet(e) {				
+				this.articleId = e.article_id
 				this.UpHtpFIle.article_id = e.article_id
+				this.UpHtpFIle.refers = e.refers
 				this.UpHtpFIle.doi = e.doi
 				this.UpHtpFIle.htmlfile = e.file_html
 				this.UpHtpFIle.title = e.title
@@ -648,7 +800,26 @@
 				this.UpLoadFile.article_id = e.article_id
 				this.HtmlVisible = true
 			},
+			// 生成html
+			// CreateHtml(){
+			// 	const loading = this.$loading({
+			// 		lock: true,
+			// 		text: 'Loading...',
+			// 		spinner: 'el-icon-loading',
+			// 		background: 'rgba(0, 0, 0, 0.7)'
+			// 	});
+			// 	this.$api
+			// 		.post('api/Production/getProductionMainsByDoi', {
+			// 			doi: this.UpHtpFIle.doi,
 						
+			// 		})
+			// 		.then(res => {
+			// 			if (res.code == 0) {
+			// 				loading.close()
+			// 				this.htmlLayout()
+			// 			}
+			// 		})
+			// },
 			// 修改文章html
 			htmlLayout() {
 				const loading = this.$loading({
@@ -659,7 +830,8 @@
 				});
 				this.$api
 					.post('api/Production/getProductionMainsByDoi', {
-						doi: this.UpHtpFIle.doi
+						doi: this.UpHtpFIle.doi,
+						file: this.fileData
 					})
 					.then(res => {
 						if (res.code == 0) {
@@ -741,11 +913,39 @@
 				this.$message.error('The maximum number of uploaded files has been exceeded');
 			},
 
-		}
+		},
+		// watch:{
+		// 	collapseActiveNames : {
+		// 	handler(newVal, oldVal) {  
+		// 		this.$nextTick(()=>{ 
+		// 			this.oldFile = newVal.find((item)=>{item.name===''});
+		// 		})           
+		// 	},
+		// // immediate: true,
+		// 	deep: true // 可以深度检测到 person 对象的属性值的变化
+		// 	}
+		// }
 	};
 </script>
 
 <style scoped>
+
+.doiLink{color: #409EFF;}
+.up_newstyle {
+		margin-left: 10px;
+	}
+
+	/deep/ .el-upload--text {
+		background-color: #ecf5ff;
+		border: 1px solid #b3d8ff !important;
+		padding: 0 7px;
+		/* margin-left: 10px; */
+	}
+
+	.up_newstyle .el-upload__text em {
+		color: #409EFF !important;
+		font-size: 12px;
+	}
 	.handle-box {
 		margin-bottom: 18px;
 	}
@@ -909,31 +1109,33 @@
 	}
 
 	/deep/.htmlfile .upload-demo .el-upload-list {
-		margin-top: 4px;
+		margin-top: -4px;
 		margin-left: 20px;
 		float: left;
-		width: 35px;
+		width: 500px;
-		display: none;
+		/* display: none; */
 	}
 
+	/* /deep/ .import.is-disabled{background: #ecf5ff !important; color: #8cc5ff !important; border-color: #d9ecff !important;} */
 
-	/deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item {
+	/* /deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item {
 		width: 30px !important;
-	}
+	} */
 
 	/deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item:hover {
 		cursor: pointer;
 	}
 
-	/deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item .el-upload-list__item-name {
+	/* /deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item .el-upload-list__item-name {
 		width: 30px;
-	}
+	} */
 
-	/deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item .el-upload-list__item-status-label {
+	/* /deep/.htmlfile .upload-demo .el-upload-list .el-upload-list__item .el-upload-list__item-status-label {
 		display: none;
-	}
+	} */
 
-	/deep/.htmlfile .upload-demo .el-upload-list__item:hover .el-icon-close {
+	/* /deep/.htmlfile .upload-demo .el-upload-list__item:hover .el-icon-close {
 		display: none;
-	}
+	} */
+	/deep/ .table99 th{background: #e4e7ed !important; color: #777 !important;}
 </style>

src/components/page/publishRefernceEditor.vue

@@ -0,0 +1,152 @@
+<template>
+  <div>
+    <!-- publish 引用编辑页面 -->
+    <editPublicRefRdit ref="editPublicRefRdit" :chanFerForm = 'chanFerForm' :gridData = 'gridData' :p_article_id='p_article_id' @ChanFerMashUp="ChanFerMashUp" @refrashComp="refrashComp" @changeRefer="changeRefer"></editPublicRefRdit>
+  </div>
+</template>
+
+<script>
+import editPublicRefRdit from './editPublicRefRdit'        // 公共引用编辑页面
+import {
+		Loading
+	} from 'element-ui';
+export default {
+    data(){
+        return{
+            article_id: this.$route.query.id,
+            chanFerForm: [],
+            gridData: '',
+            p_article_id: this.$route.query.pid,
+        }
+    },
+    created(){
+        this.getData()
+    },
+    methods:{
+        // 获取p_article_id的值            
+			getArtcleDetails(){
+				// 获得文章详情
+				const loading = this.$loading({
+					lock: true,
+					text: 'Loading...',
+					spinner: 'el-icon-loading',
+					background: 'rgba(0, 0, 0, 0.7)'
+				});
+				this.$api
+					.post('api/Article/getPreacceptArticleDetail', {'article_id': this.article_id})
+					.then(res => {
+						loading.close()                       
+						this.p_article_id = res.data.production.p_article_id
+                        console.log(this.p_article_id)
+                       // this.chanFerForm = res.data.refers
+						if(this.p_article_id != null){
+							this.getData()
+							//this.getAuthorJG();
+			 				//this.getCount();
+			 				//this.getWorldPdf();
+						}	
+                        this.$nextTick(()=>{
+                            // 更新引用列表
+							this.$refs.editPublicRefRdit.init(this.chanFerForm)
+						})					
+					})
+					.catch(err => {
+						//this.$message.error(err);
+						loading.close()
+					});
+			},
+			getData() {
+               
+				// this.idform.p_article_id = this.p_article_id;
+				// this.detailMes.p_article_id = this.p_article_id;
+				// 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;
+
+               // console.log(this.p_article_id,5555)
+
+				const loading = this.$loading({
+					lock: true,
+					text: 'Loading...',
+					spinner: 'el-icon-loading',
+					background: 'rgba(0, 0, 0, 0.7)'
+				});
+
+				// 获取文章信息
+
+				// 获取参考文献
+				this.$api
+					.post('api/Production/getReferList', {
+						'p_article_id': this.p_article_id
+					})
+					.then(res => {
+						 this.chanFerForm = res.data.refers                        
+						for (var i = 0; i < this.chanFerForm.length; i++) {
+							this.chanFerForm[i].edit_mark = 1
+							if (this.chanFerForm[i].refer_frag != '') {
+								this.showB_step = 2
+							}
+						}
+                        this.$nextTick(()=>{
+                            // 更新引用列表
+							this.$refs.editPublicRefRdit.init(this.chanFerForm)
+						})
+                        loading.close()
+					})
+					.catch(err => {
+                        loading.close()
+						console.log(err);
+					});
+
+            },
+            // 5----参考文献向上合并
+			ChanFerMashUp(e) {
+				console.log(e)
+				this.$api
+					.post('api/Production/referHB', e)
+					.then(res => {
+						if (res.code == 0) {
+							this.changeRefer(e)
+						} else {
+							this.$message.error(res.msg);
+						}
+					})
+					.catch(err => {
+						console.log(err);
+					});
+			},
+            // 刷新引用组件
+			refrashComp(){
+				this.$refs.editPublicRefRdit.$forceUpdate()
+				console.log('editPublicRefRdit')
+			}, 
+            // 5----重新获取加载参考文献
+			changeRefer(val) {
+				console.log('重新获取参考文献')
+				this.$api
+					.post('api/Production/getReferList', {
+						'p_article_id': this.p_article_id
+					})
+					.then(res => {
+						this.chanFerForm = res.data.refers
+						for (var i = 0; i < this.chanFerForm.length; i++) {
+							this.chanFerForm[i].edit_mark = 1
+						}
+						console.log(this.chanFerForm)
+					})
+					.catch(err => {
+						console.log(err);
+					});
+					
+			}, 
+    },
+    components:{
+        editPublicRefRdit
+    }
+}
+</script>
+
+<style scoped>
+
+
+</style>

src/router/index.js

@@ -896,7 +896,7 @@ export default new Router({
 					path: '/ReferenceEditor', //用户端预收录-引用编辑
 						component: () => import('../components/page/ReferenceEditor'),
 					meta: {
-						title: 'ReferenceEditor'
+						title: 'Reference Workflow'
 						}
 				},
 				{
@@ -908,6 +908,15 @@ export default new Router({
 						title: 'PreIngestedEditor'
 						}
 				},
+				{
+					name:'publishRefernceEditor',
+					path: '/publishRefernceEditor', // 编辑端 - publish 引用编辑页面
+						component: () => import('../components/page/publishRefernceEditor'),
+					meta: {
+						
+						title: 'Refernce Editor'
+						}
+				},
 				{
 					path: '/404',
 					component: () => import( /* webpackChunkName: "404" */