137 lines
5.1 KiB
Vue
137 lines
5.1 KiB
Vue
<template>
|
||
<div class="container" >
|
||
<el-row :gutter="20" >
|
||
<el-alert v-if="alertShow"
|
||
:title="'Dear '+ user_name + ' Congratulations! , The information will be hidden after ' + hideSec + ' seconds'"
|
||
type="success"
|
||
show-icon>
|
||
|
||
</el-alert>
|
||
<el-col class="mt20">
|
||
<p>2．Congratulations! Your manuscript has entered into <b>Pre-accept</b> status. Now please check and complete the necessary information of your manuscript for final publication.</p>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 内容 -->
|
||
<el-row :gutter="20" class="content_box mt20">
|
||
<!-- 文章引用 -->
|
||
<el-col :class="['item', 'borderBottom', Ainfo.refer_state.state? 'passborder' : 'notPassborder']">
|
||
<h5 :class="['statusTop', Ainfo.refer_state.state? 'passStatus' : 'notPassStatus']">
|
||
<span v-if="Ainfo.refer_state.state" class="el-icon-check pass status"> Complete</span>
|
||
<span v-else class="el-icon-pie-chart notPass status"> Pending</span>
|
||
</h5>
|
||
<div class="con">
|
||
<h4>References </h4>
|
||
<p class="mt20">A total of <i class="tip">{{Ainfo.refer_state.num}}</i> references in this manuscript is identified.</p>
|
||
<!-- <p class="mt10"><img src="../../assets/img/icon_9.png" alt="" class="icon_img"> <el-link @click="goAddReferences(thisArtcleId)" type="primary" > Click here to edit</el-link> </p> -->
|
||
<p class="mt10"><el-button @click="goAddReferences(thisArtcleId)" icon="el-icon-edit" type="text">Edit</el-button></p>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 答疑 -->
|
||
<div class="mt20 helpcontent">
|
||
<div class="flexbox">
|
||
<span class="el-icon-info help"></span>
|
||
<div>
|
||
<h4>Any questions/Help</h4>
|
||
<p class="mt20">If you experience any problems, please contact us by publisher@tmrjournals.com</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
user_name: localStorage.getItem('U_relname'),
|
||
thisArtcleId: this.$route.query.id,
|
||
alertShow:true,
|
||
dingshi:null,
|
||
hideSec:5,
|
||
// 引用表单数据
|
||
ReferenceList:[],
|
||
Ainfo:{
|
||
refer_state:{
|
||
state:null,
|
||
num: null
|
||
}
|
||
}
|
||
}
|
||
},
|
||
created() {
|
||
this.getInfoStatu()
|
||
this.hideAlert()
|
||
},
|
||
methods:{
|
||
// 跳转到引用编辑页面
|
||
goAddReferences(id){
|
||
this.$router.push({
|
||
path: 'ReferenceEditor',
|
||
query: {
|
||
id: id
|
||
}
|
||
});
|
||
},
|
||
|
||
// 隐藏alert
|
||
hideAlert(){
|
||
this.dingshi = setInterval(()=>{
|
||
this.hideSec -= 1
|
||
// console.log(this.hideSec)
|
||
if(this.hideSec == 0){
|
||
this.alertShow = false
|
||
clearInterval(this.dingshi)
|
||
}
|
||
},1000)
|
||
|
||
},
|
||
// 获取资料状态
|
||
getInfoStatu(){
|
||
this.$api
|
||
.post('/api/Article/getPreacceptStatus', {
|
||
'article_id': this.$route.query.id
|
||
})
|
||
.then(res => {
|
||
if(res.code == 0){
|
||
// console.log(res, 'res')
|
||
this.Ainfo = {
|
||
refer_state:{
|
||
state: res.data.refer_state.state,
|
||
num:res.data.refer_state.num
|
||
}
|
||
}
|
||
}
|
||
})
|
||
.catch(err => {
|
||
console.log(err);
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.tip{background: #e6effb; padding: 4px; font-style: normal; border-radius:10px ;}
|
||
.passborder{border:1px solid #f0f9eb;}
|
||
.notPassborder{border:1px solid #fdf6ec;}
|
||
.con{padding: 20px;}
|
||
.statusTop{height:30px;}
|
||
.borderBottom{ border-bottom:1px solid #f1f1f1; margin-bottom: 20px; }
|
||
.help{font-size: 22px; margin-right: 10px;}
|
||
.el-alert__title{font-size: 26px;}
|
||
.mt20{margin-top: 20px;}
|
||
/* .content_box{padding:15px 10px; border:3px dashed #eff6ff; } */
|
||
.content_box .item{padding: 0 !important; border-radius: 20px 20px 0 0; overflow: hidden;}
|
||
.passStatus{ background: #f0f9eb;}
|
||
.notPassStatus{background: #fdf6ec;}
|
||
.content_box .item .status{ font-size: 16px; padding:0 10px; line-height: 30px; }
|
||
.content_box .item .status.pass{ color: #67c23a;}
|
||
.content_box .item .status.notPass{ color: #e6a23c;}
|
||
.flexbox{display: flex;}
|
||
p{color: #333;}
|
||
.mt10{margin-top: 10px;}
|
||
.more{font-weight: bold;}
|
||
.helpcontent{color: #888; margin-top: 150px; padding-top: 30px; border-top: 2px solid #f1f1f1;}
|
||
.helpcontent p{color: inherit; font-size: 12px;}
|
||
</style> |