584 lines
15 KiB
Vue
584 lines
15 KiB
Vue
<template>
|
||
<div>
|
||
<div class="crumbs">
|
||
<el-breadcrumb separator="/">
|
||
<el-breadcrumb-item>
|
||
<i class="el-icon-lx-calendar"></i>
|
||
<router-link :to="{path:'/articleList'}">
|
||
<span class="top_dao"> Manuscript list</span>
|
||
</router-link>
|
||
>> Manuscript process
|
||
</el-breadcrumb-item>
|
||
</el-breadcrumb>
|
||
</div>
|
||
<div class="container_state">
|
||
<p style="color: #888;margin: 10px 0 5px 0;">ID : {{artMes.accept_sn}}</p>
|
||
<p style="font-size: 16px;font-weight: bolder;letter-spacing: -0.5px;">
|
||
<!-- <span class="art_type">{{ellType(artMes.type)}}</span> -->
|
||
{{artMes.title}}
|
||
</p>
|
||
<!-- <p style="color: #7f8790;margin: 10px 0 0 0;">Follow the progress of your submission.</p> -->
|
||
<div class="tit_head">
|
||
Status : <b style="margin: 0 50px 0 0;">{{statetostr(artMes.laststate)}}</b>
|
||
Journal : <b>{{artMes.journalname}}</b>
|
||
</div>
|
||
<el-row :gutter="30">
|
||
<el-col :span="15">
|
||
<div class="process_new">
|
||
|
||
<!-- <p style="width: 100%;height: 1px;background-color: #eee;margin: 35px 0 30px 0;"></p> -->
|
||
<h2 style="font-size: 18px;margin: 0 0 10px 0;float: left;letter-spacing: -0.8px;">Manuscript
|
||
Tracking</h2>
|
||
<!-- <div class="radio" style="float: right;">
|
||
<el-radio-group v-model="reverse">
|
||
<el-radio-button :label="false">Ascending</el-radio-button>
|
||
<el-radio-button :label="true">Descending</el-radio-button>
|
||
</el-radio-group>
|
||
</div> -->
|
||
<br clear="both">
|
||
<el-timeline :reverse="reverse" class="author_tree">
|
||
<el-timeline-item v-for="(item, index) in prossMsgs" :icon="item.icon" :color="item.color"
|
||
size="large" :key="index" :timestamp="formatDate(item.ctime)" placement="top" v-if="item.ftype == 0">
|
||
<el-card>
|
||
<p>
|
||
<font>{{ statetostr(item.state_to) }}</font>
|
||
<!-- 提交 -->
|
||
<font v-if="item.state_to==-1">
|
||
<!-- : <font style="margin-left: 5px;">First submitted to <b>{{artMes.journalname}}</b></font> -->
|
||
</font>
|
||
<!-- 给编辑 -->
|
||
<font v-if="item.state_to==1">
|
||
<!-- : <b style="margin-left: 5px;"> Submission checks complete</b> -->
|
||
</font>
|
||
<!-- 审查中 -->
|
||
<font v-if="item.state_to==2">
|
||
<!-- : <b style="margin-left: 5px;"> Editor assigned</b> -->
|
||
</font>
|
||
<!-- 拒绝 -->
|
||
<font v-if="item.state_to==3">
|
||
<!-- : <b> Reject manuscript</b> -->
|
||
</font>
|
||
<!-- 修改 -->
|
||
<font v-if="item.state_to==4">
|
||
:
|
||
<router-link
|
||
:to="{path:'/articleProcessRevision',query:{id:artMes.article_id}}"
|
||
v-if="item.back==1">
|
||
<b style="margin-left: 5px;color: #006699;text-decoration: underline;">Upload
|
||
Major Revision</b>
|
||
</router-link>
|
||
<b style="margin-left: 5px;color: #888;text-decoration: underline;"
|
||
v-if="item.back==0">
|
||
Upload Major Revision (Completed)
|
||
</b>
|
||
</font>
|
||
<!-- 接收 -->
|
||
<font v-if="item.state_to==5">
|
||
<!-- : <b style="margin-left: 5px;"> Successfully received manuscript</b> -->
|
||
</font>
|
||
</p>
|
||
</el-card>
|
||
</el-timeline-item>
|
||
</el-timeline>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="9">
|
||
<!-- 审稿人列表 -->
|
||
<!-- <div class="art_process_">
|
||
<h2>
|
||
Coment from reviewers
|
||
</h2>
|
||
<div style="max-height: 300px;overflow-y: auto;">
|
||
<div class="art_process_list">
|
||
<b>1</b>reviewers <span>202-50-60</span>
|
||
<p>reviewersreviewersreviewersreviewersreviewers</p>
|
||
</div>
|
||
<div class="art_process_list">
|
||
<b>1</b>reviewers <span>202-50-60</span>
|
||
<p>reviewersreviewersreviewersreviewersreviewers</p>
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
|
||
<!-- 对话列表 -->
|
||
<div class="kuang_communtion">
|
||
<h2>
|
||
Communication
|
||
</h2>
|
||
<div v-for="item in talkMsgs" class="kuang_communtion_conmt">
|
||
<div v-if="item.user_id != artMes.user_id" class="talk_aued">
|
||
<p>
|
||
Editor :
|
||
</p>
|
||
<el-card>
|
||
<p style="white-space: pre-wrap;">{{ item.ad_content }}</p>
|
||
</el-card>
|
||
<b>{{formatDate(item.ad_ctime)}}</b>
|
||
</div>
|
||
<div v-if="item.user_id == artMes.user_id" class="talk_aued talk_edit">
|
||
<p>
|
||
Author :
|
||
</p>
|
||
<el-card>
|
||
<p style="white-space: pre-wrap;">{{ item.ad_content }}</p>
|
||
</el-card>
|
||
<b>{{formatDate(item.ad_ctime)}}</b>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="kuang_communtion_input">
|
||
<p v-if="talkMsgs"></p>
|
||
<span class="text_bor_ghu">
|
||
<el-input type="textarea" rows="3" v-model="msgform.ad_content"
|
||
placeholder="You can initiate short conversations with the editor." resize="none">
|
||
</el-input>
|
||
<el-button type="primary" @click="saveMsg">Send</el-button>
|
||
</span>
|
||
|
||
<font style="font-size: 12px;color: #999;padding:12px 5px 0 5px;display: block;">
|
||
This column is served as an instant correspondence between the editor and authors,
|
||
aiming to acquire a faster
|
||
way of communication than E-Mail. If you have any questions, please start the instant
|
||
corresponding, and the
|
||
editors will reply to you in 24 hours.
|
||
<br>
|
||
<font style="color: #006699;">Please Attention</font>
|
||
<br>
|
||
<font style="color: #006699;">1.</font> If you need to send files as attachments, please
|
||
send them to
|
||
tmr@tmrjournals.com
|
||
<br>
|
||
<font style="color: #006699;">2.</font> Please do not upload the primary documents like
|
||
the cover letter, the
|
||
reply to the reviewer comments,
|
||
etc.
|
||
</font>
|
||
</div>
|
||
</div>
|
||
<p style="line-height: 20px;color: #999;padding: 0 15px 0 15px;">
|
||
We encourage authors to upload a Cover Letter file and make sure the Highlights part in the main
|
||
manuscript is
|
||
after the abstract and keywords. That will help authors let editors quickly obtain information
|
||
and evaluate the
|
||
scientific value of their research correctly.
|
||
<br>Please remind our editor in the cover letter if you want your manuscript processed quickly.
|
||
<br>Please note that manuscripts with at least one of the following characteristics will be
|
||
included in the
|
||
journal's manuscript fast track:
|
||
<br>
|
||
<font style="color: #006699;">1.Interest:</font> This manuscript has a novel perspective.
|
||
<br>
|
||
<font style="color: #006699;">2.Importance:</font> This manuscript belongs to the focus area.
|
||
<br>
|
||
<font style="color: #006699;">3.Value:</font> This manuscript belongs to the advanced topic and
|
||
can attract wide
|
||
attention.
|
||
</p>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
</div>
|
||
|
||
<el-dialog title="Message" :visible.sync="editVisible" width="40%">
|
||
<el-form ref="msgform" :model="msgform" label-width="80px">
|
||
<el-form-item label="Message">
|
||
<el-input type="textarea" rows="5" v-model="msgform.content" placeholder="Author messages">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="saveMsg" :loading="saveloading">save</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
baseUrl: this.Common.baseUrl,
|
||
mediaUrl: this.Common.mediaUrl,
|
||
articleId: this.$route.query.id,
|
||
userName: localStorage.getItem('U_name'),
|
||
loading: false,
|
||
reverse: false,
|
||
artMes: {
|
||
articleId: this.$route.query.id
|
||
},
|
||
msgform: {
|
||
username: localStorage.getItem('U_name'),
|
||
article_id: this.$route.query.id,
|
||
ad_content: ''
|
||
},
|
||
query_review: {
|
||
articleId: this.$route.query.id,
|
||
pageIndex: 1,
|
||
pageSize: 10
|
||
},
|
||
prossMsgs: [],
|
||
talkMsgs: [],
|
||
review_Data: [],
|
||
|
||
editVisible: false,
|
||
saveloading: false
|
||
};
|
||
},
|
||
created: function() {
|
||
this.initarticle();
|
||
},
|
||
computed: {
|
||
|
||
},
|
||
methods: {
|
||
//初始化文章信息
|
||
initarticle() {
|
||
this.$api
|
||
.post('api/Article/getArticleDetail', {
|
||
articleId: this.articleId,
|
||
human: 'author'
|
||
})
|
||
.then((res) => {
|
||
let back_num = 0
|
||
// 添加投递稿件条目
|
||
res.msg.unshift({
|
||
state_to: -1,
|
||
ctime: res.article.ctime,
|
||
color: '#B5C334',
|
||
icon: 'el-icon-collection-tag',
|
||
ftype: 0,
|
||
});
|
||
for (let i = res.msg.length - 1; i >= 0; i--) {
|
||
if (res.msg[i].state_to == 4 && res.msg[i + 1] == undefined && back_num == 0) {
|
||
res.msg[i].back = 1;
|
||
back_num = 1
|
||
} else {
|
||
res.msg[i].back = 0;
|
||
}
|
||
if (res.msg[i].state_to == 1) {
|
||
res.msg[i].color = '#f75822'
|
||
res.msg[i].icon = 'el-icon-document-checked'
|
||
}
|
||
if (res.msg[i].state_to == 2) {
|
||
res.msg[i].color = '#0ebee1'
|
||
res.msg[i].icon = 'el-icon-document'
|
||
}
|
||
if (res.msg[i].state_to == 3) {
|
||
res.msg[i].color = '#888'
|
||
res.msg[i].icon = 'el-icon-close'
|
||
}
|
||
if (res.msg[i].state_to == 4) {
|
||
res.msg[i].color = '#5a90e1'
|
||
res.msg[i].icon = 'el-icon-edit-outline'
|
||
}
|
||
if (res.msg[i].state_to == 5) {
|
||
res.msg[i].color = '#91cc75'
|
||
res.msg[i].icon = 'el-icon-check'
|
||
}
|
||
if (res.msg[i].state_to == 6) {
|
||
res.msg[i].color = '#27727B'
|
||
res.msg[i].icon = 'el-icon-star-off'
|
||
}
|
||
}
|
||
this.artMes = res.article;
|
||
this.artMes.laststate = res.msg[res.msg.length - 1].state_to;
|
||
this.prossMsgs = res.msg;
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
|
||
// 留言板列表
|
||
this.$api
|
||
.post('api/Article/getArticleDialogs', {
|
||
article_id: this.$route.query.id
|
||
})
|
||
.then((res) => {
|
||
this.talkMsgs = res.data.dialogs;
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
|
||
// 获取编辑列表数据
|
||
this.$api
|
||
.post('api/Article/getReviewerList', this.query_review)
|
||
.then((res) => {
|
||
this.review_Data = res.data;
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
},
|
||
|
||
// 日期
|
||
formatDate(timestamp) {
|
||
var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
|
||
var Y = date.getFullYear() + '-';
|
||
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
|
||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
|
||
var h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
|
||
var m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
|
||
var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
|
||
return Y + M + D + ' ' + h + ':' + m + ':' + s;
|
||
},
|
||
|
||
// 对话框
|
||
authormsg() {
|
||
this.editVisible = true;
|
||
},
|
||
|
||
// 保存留言
|
||
saveMsg() {
|
||
if (this.msgform.ad_content == '') {
|
||
this.$message.error('Please input messages');
|
||
return false;
|
||
}
|
||
this.loading = true;
|
||
this.$api.post('api/Article/pushArticleDialog', this.msgform)
|
||
.then((res) => {
|
||
this.loading = false;
|
||
this.$message.success('Sent successfully');
|
||
this.initarticle()
|
||
});
|
||
},
|
||
|
||
statetostr(mystate) {
|
||
let str = '';
|
||
switch (mystate) {
|
||
case -1:
|
||
str = 'Submitted';
|
||
break;
|
||
case 0:
|
||
str = 'Received';
|
||
break;
|
||
case 1:
|
||
str = 'With editor';
|
||
break;
|
||
case 2:
|
||
str = 'Under review';
|
||
break;
|
||
case 3:
|
||
str = 'Reject';
|
||
break;
|
||
case 4:
|
||
str = 'Revision';
|
||
break;
|
||
case 5:
|
||
str = 'Accepted';
|
||
break;
|
||
case 6:
|
||
str = 'Pre-accept';
|
||
break;
|
||
default:
|
||
str = 'error!!';
|
||
}
|
||
return str;
|
||
},
|
||
|
||
ellType(e) {
|
||
let frag = '';
|
||
switch (e) {
|
||
case "A":
|
||
frag = 'Article';
|
||
break;
|
||
case 'B':
|
||
frag = 'Review';
|
||
break;
|
||
case 'C':
|
||
frag = 'Case report';
|
||
break;
|
||
case 'P':
|
||
frag = 'Research proposal';
|
||
break;
|
||
case 'N':
|
||
frag = 'News';
|
||
break;
|
||
case 'T':
|
||
frag = 'Comment';
|
||
break;
|
||
case 'CT':
|
||
frag = 'Correction';
|
||
break;
|
||
case 'HT':
|
||
frag = 'Hypothesis';
|
||
break;
|
||
case 'PF':
|
||
frag = 'Preface';
|
||
break;
|
||
case 'ET':
|
||
frag = 'Editorial';
|
||
break;
|
||
case 'RP':
|
||
frag = 'Report';
|
||
break;
|
||
case 'LR':
|
||
frag = 'Letter';
|
||
break;
|
||
case 'EF':
|
||
frag = 'Empirical formula';
|
||
break;
|
||
case 'EM':
|
||
frag = 'Evidence-based medicine';
|
||
break;
|
||
case 'EC':
|
||
frag = 'Expert consensus';
|
||
break;
|
||
case 'LTE':
|
||
frag = 'Letter to editor';
|
||
break;
|
||
case 'QI':
|
||
frag = 'Questionnaire investigation';
|
||
break;
|
||
case 'PT':
|
||
frag = 'Protocol';
|
||
break;
|
||
case 'CS':
|
||
frag = 'Case Series';
|
||
break;
|
||
case 'RT':
|
||
frag = 'Retraction';
|
||
break;
|
||
case 'MR':
|
||
frag = 'Mini Review';
|
||
break;
|
||
default:
|
||
frag = 'Others';
|
||
}
|
||
return frag;
|
||
},
|
||
|
||
},
|
||
filters: {
|
||
|
||
}
|
||
};
|
||
</script>
|
||
|
||
|
||
<style>
|
||
.top_dao:hover {
|
||
text-decoration: underline;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.process_new {
|
||
border: 1px solid #dcdfe6;
|
||
padding: 20px;
|
||
background-color: #fff;
|
||
border-radius: 5px;
|
||
}
|
||
|
||
.art_type {
|
||
/* background-color: #ddeef7; */
|
||
color: #006699;
|
||
padding: 2px 5px;
|
||
border-radius: 5px;
|
||
font-size: 12px;
|
||
margin: 0 10px 0 0;
|
||
}
|
||
|
||
.tit_head {
|
||
border-radius: 5px;
|
||
border: 1px solid #EBEEF5;
|
||
padding: 20px;
|
||
font-size: 15px;
|
||
margin: 20px 0 30px 0;
|
||
background-color: #fff;
|
||
/* background-color: #fcfcfc; */
|
||
}
|
||
|
||
.tit_head b {
|
||
color: #006699;
|
||
/* text-decoration: underline; */
|
||
}
|
||
|
||
.el-radio-button__orig-radio:checked+.el-radio-button__inner {
|
||
background-color: #006699;
|
||
border-color: #006699;
|
||
}
|
||
|
||
.author_tree {
|
||
margin: 40px 0 0 10px;
|
||
}
|
||
|
||
.author_tree .el-timeline-item {
|
||
padding-bottom: 1px;
|
||
}
|
||
|
||
.author_tree .el-timeline-item__node--large {
|
||
left: 155px;
|
||
width: 30px;
|
||
height: 30px;
|
||
}
|
||
|
||
.author_tree .el-timeline-item__wrapper {
|
||
padding-left: 0;
|
||
margin: 0 0 50px 0;
|
||
}
|
||
|
||
.author_tree .el-timeline-item__timestamp.is-top {
|
||
padding-top: 10px;
|
||
margin-bottom: 13px;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.author_tree .el-timeline-item__content {
|
||
margin: -50px 0 0 210px;
|
||
}
|
||
|
||
.author_tree .el-timeline-item__tail {
|
||
height: auto;
|
||
bottom: 15px;
|
||
top: 45px;
|
||
border-left: 3px solid #E4E7ED;
|
||
/* border-left: 2px solid #66a3c2; */
|
||
left: 168px;
|
||
}
|
||
|
||
.art_process_ {
|
||
margin-bottom: 30px;
|
||
border: 1px solid #dcdfe6;
|
||
padding: 20px;
|
||
background-color: #fff;
|
||
border-radius: 5px;
|
||
}
|
||
|
||
.art_process_>h2 {
|
||
font-size: 18px;
|
||
margin: 0 0 2px 0;
|
||
letter-spacing: -0.8px;
|
||
}
|
||
|
||
.art_process_list {
|
||
border-bottom: 1px solid #dcdfe6;
|
||
padding: 15px 0 25px 10px;
|
||
}
|
||
|
||
.art_process_ .art_process_list:last-child {
|
||
border-bottom: 0;
|
||
padding-bottom: 5px;
|
||
}
|
||
|
||
.art_process_list b {
|
||
background-color: #006699;
|
||
color: #fff;
|
||
display: inline-block;
|
||
width: 18px;
|
||
height: 18px;
|
||
line-height: 18px;
|
||
text-align: center;
|
||
margin: 0 10px 0 0;
|
||
|
||
}
|
||
|
||
.art_process_list span {
|
||
color: #888;
|
||
margin: 0 0 0 15px;
|
||
}
|
||
|
||
.art_process_list p {
|
||
margin: 10px 0 0 28px;
|
||
}
|
||
</style>
|