389 lines
9.7 KiB
Vue
389 lines
9.7 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 process_new">
|
||
<p style="font-size: 16px;font-weight: bolder;">
|
||
<span class="art_type">{{ellType(artMes.type)}}</span>
|
||
{{artMes.title}}
|
||
</p>
|
||
<p style="color: #7f8790;margin: 10px 0 0 0;font-size: 14px;">Follow the progress of your submission.</p>
|
||
<div class="tit_head">
|
||
This submission is <b>{{statetostr(artMes.laststate)}}</b>
|
||
at <b>{{artMes.journalname}}.</b>
|
||
</div>
|
||
|
||
<p style="width: 100%;height: 1px;background-color: #eee;margin: 35px 0 30px 0;"></p>
|
||
|
||
<el-row :gutter="80">
|
||
<el-col :span="24">
|
||
<h2 style="font-size: 18px;margin: 0 0 30px 0;float: left;">Manuscript process</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">
|
||
: <b style="margin-left: 5px;">First submitted to {{artMes.journalname}}</b>
|
||
</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==4">
|
||
:
|
||
<router-link :to="{path:'/articleList',query:{art_id:artMes.article_id}}" v-if="item.back==1">
|
||
<b style="margin-left: 5px;color: #006699;text-decoration: underline;">Major revision</b>
|
||
</router-link>
|
||
<b style="margin-left: 5px;color: #888;text-decoration: underline;" v-if="item.back==0">
|
||
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>
|
||
</el-col>
|
||
<!-- <el-col :span="9">
|
||
<h2 style="font-size: 18px;margin: 0 0 30px 0;">Talking</h2>
|
||
<el-button type="primary" icon="el-icon-edit" round style="margin-left: 28px" @click="authormsg">Edit message</el-button>
|
||
</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: ''
|
||
},
|
||
prossMsgs: [],
|
||
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 && 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 = '#f3170f'
|
||
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;
|
||
console.log(this.prossMsgs)
|
||
})
|
||
.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.content == '') {
|
||
this.$message.error('Please input messages');
|
||
return false;
|
||
}
|
||
this.saveloading = true;
|
||
this.$api.post('api/Article/authorMessage', this.msgform)
|
||
.then((res) => {
|
||
this.saveloading = false;
|
||
this.$message.success('Sent successfully');
|
||
this.$router.go(0);
|
||
});
|
||
},
|
||
statetostr(mystate) {
|
||
let str = '';
|
||
switch (mystate) {
|
||
case -1:
|
||
str = 'Manuscript Submission';
|
||
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 = 'Fininal decision';
|
||
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 '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;
|
||
default:
|
||
frag = 'OTHERS';
|
||
}
|
||
return frag;
|
||
},
|
||
|
||
},
|
||
filters: {
|
||
|
||
}
|
||
};
|
||
</script>
|
||
|
||
|
||
<style>
|
||
.top_dao:hover {
|
||
text-decoration: underline;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.process_new {
|
||
color: #333;
|
||
}
|
||
|
||
.art_type {
|
||
color: #fff;
|
||
background-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: 30px 0;
|
||
background-color: #fcfcfc;
|
||
}
|
||
|
||
.tit_head b:nth-child(1) {
|
||
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__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;
|
||
}
|
||
</style>
|