Files
tougao_web/src/components/page/reviewerArticleDetail.vue
wangjinlei ec6ef00ca4 20210728
2021-07-28 16:19:05 +08:00

803 lines
41 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item>
<i class="el-icon-lx-calendar"></i> Manuscript detail
</el-breadcrumb-item>
<el-breadcrumb-item>article detail</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="container" v-loading="loading">
<el-row>
<el-col :span="12">
<div class="form-box">
<el-form ref="articleform" :model="detailDate" label-width="200px">
<el-form-item label="Manuscript title">
<span>{{detailDate.article}}</span>
</el-form-item>
<el-form-item label="Manuscript ID">
<span>{{detailDate.acceptSN}}</span>
</el-form-item>
<el-form-item label="Manuscript state">
<span>{{mystate(detailDate.state)}}</span>
</el-form-item>
<el-form-item label=" ">
<span>If you can not download the manuscript, please try other browsers instead of google one.</span>
</el-form-item>
<el-form-item label="Figures">
<el-popover placement="right" width="350" trigger="click">
<el-table :data="figFileList">
<el-table-column
width="150"
:formatter="filedateformate"
property="ctime"
align="center"
label="date"
></el-table-column>
<el-table-column
width="100"
property="username"
align="center"
label="Uploader"
></el-table-column>
<el-table-column
width="100"
label="download"
align="center"
>
<template slot-scope="scope">
<el-link
type="primary"
icon="el-icon-download"
:href="getlinkurl(scope.row)"
></el-link>
</template>
</el-table-column>
</el-table>
<el-button
class="more_btn"
icon="el-icon-download"
type="text"
slot="reference"
>download</el-button>
</el-popover>
</el-form-item>
<el-form-item label="Manuscirpt">
<el-popover placement="right" width="350" trigger="click">
<el-table :data="articlefileList">
<el-table-column
width="150"
:formatter="filedateformate"
property="ctime"
align="center"
label="date"
></el-table-column>
<el-table-column
width="100"
property="username"
align="center"
label="Uploader"
></el-table-column>
<el-table-column
width="100"
label="download"
align="center"
>
<template slot-scope="scope">
<el-link
type="primary"
icon="el-icon-download"
:href="getlinkurl(scope.row)"
></el-link>
</template>
</el-table-column>
</el-table>
<el-button
class="more_btn"
icon="el-icon-download"
type="text"
slot="reference"
>download</el-button>
</el-popover>
</el-form-item>
<!-- <el-form-item label="article file">
<el-popover placement="right" width="350" trigger="click">
<el-table :data="articlefileList">
<el-table-column
width="150"
:formatter="filedateformate"
property="ctime"
align="center"
label="date"
></el-table-column>
<el-table-column
width="100"
property="up_username"
align="center"
label="Uploader"
></el-table-column>
<el-table-column
width="100"
label="download"
align="center"
>
<template slot-scope="scope">
<el-link
type="primary"
icon="el-icon-download"
:href="getlinkurl(scope.row)"
></el-link>
</template>
</el-table-column>
</el-table>
<el-button
class="more_btn"
icon="el-icon-download"
type="text"
slot="reference"
>download</el-button>
</el-popover>
<el-upload
class="upload-demo"
:action="upload_file('articlefile')"
accept=".doc, .docx"
name="articlefile"
:before-upload="beforeupload_file"
:on-error="uperr_file"
:on-success="upSuccess_file"
:limit="1"
:on-exceed="alertlimit"
:on-remove="removefilearticlefile"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
<em>reupload</em>
</div>
<div
class="el-upload__tip"
slot="tip"
>Only word files can be uploaded(.doc,.docx)</div>
</el-upload>
</el-form-item> -->
<!-- <el-form-item label="others">
<el-popover placement="right" width="auto" trigger="click">
<el-table :data="articlezipList">
<el-table-column
width="150"
:formatter="filedateformate"
property="ctime"
align="center"
label="date"
></el-table-column>
<el-table-column
width="100"
property="up_username"
align="center"
label="Uploader"
></el-table-column>
<el-table-column
width="100"
label="download"
align="center"
>
<template slot-scope="scope">
<el-link
type="primary"
icon="el-icon-download"
:href="getlinkurl(scope.row)"
></el-link>
</template>
</el-table-column>
</el-table>
<el-button
class="more_btn"
icon="el-icon-download"
type="text"
slot="reference"
>download</el-button>
</el-popover>
<el-upload
class="upload-demo"
:action="upload_file('articlezip')"
accept=".rar, .zip"
name="articlezip"
:before-upload="beforeupload_articlezip"
:on-error="uperr_file"
:on-success="upSuccess_articlezip"
:limit="1"
:on-exceed="alertlimit"
:on-remove="removefilearticlezip"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
<em>reupload</em>
</div>
<div
class="el-upload__tip"
slot="tip"
>Only compressed files can be uploaded(.rar,.zip)</div>
</el-upload>
</el-form-item> -->
<!-- <el-form-item>
<el-button type="primary" @click="onSubmit">Submit upload</el-button>
</el-form-item> -->
</el-form>
</div>
</el-col>
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<h2>Feedback questionnaire</h2>
</div>
<el-form
:model="questionform"
:rules="rules"
ref="question"
label-width="300px"
label-position="top"
>
<el-divider content-position="center">REFEREE'S ASSESSMENT</el-divider>
<el-form-item label="1.Originality of the topic">
<el-radio-group v-model="questionform.qu1">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="2.Technical Quality">
<el-radio-group v-model="questionform.qu2">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="3.Importance in its Field">
<el-radio-group v-model="questionform.qu3">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="4.Style & Overall Representation">
<el-radio-group v-model="questionform.qu4">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="5.Readily Understandable">
<el-radio-group v-model="questionform.qu5">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="6.Suitability for the Journal">
<el-radio-group v-model="questionform.qu6">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="7.Adequate Illustrations or Drawings">
<el-radio-group v-model="questionform.qu7">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="8.English language">
<el-radio-group v-model="questionform.qu8">
<el-radio :label="1">Excellent</el-radio>
<el-radio :label="2">Good</el-radio>
<el-radio :label="3">Fair</el-radio>
<el-radio :label="4">Poor</el-radio>
</el-radio-group>
</el-form-item>
<el-collapse>
<el-form-item
label="9.Does the title represent manuscript's contents?"
>
<el-switch
v-model="questionform.qu9"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="1">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu9contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item label="10.Is the Abstract accurate and concise?">
<el-switch
v-model="questionform.qu10"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="2">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu10contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item
label="11.Are the approach/ methods properly described?"
>
<el-switch
v-model="questionform.qu11"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="3">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu11contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item
label="12.Are the conclusions and interpretations sound?"
>
<el-switch
v-model="questionform.qu12"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="4">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu12contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item label="13.Are the references properly cited?">
<el-switch
v-model="questionform.qu13"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="5">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu13contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item
label="14.Is this a new/ original/ confirmatory contribution?"
>
<el-switch
v-model="questionform.qu14"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="6">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu14contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-form-item label="15.Is it within the scope of the journal?">
<el-switch
v-model="questionform.qu15"
active-text="yes"
inactive-text="no"
></el-switch>
<el-collapse-item name="7">
<template slot="title">
<i class="el-icon-edit"></i>Comments/ Suggestions
</template>
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.qu15contents"
:rows="4"
></el-input>
</el-collapse-item>
</el-form-item>
<el-divider content-position="center">REFEREE'S RECOMMENDATIONS</el-divider>
<el-form-item label="Overall the Paper is Rated">
(Poor-------------------------------------------------------------Excellent)
<br />
<el-radio-group v-model="questionform.rated" size="small">
<el-radio-button label="1"></el-radio-button>
<el-radio-button label="2"></el-radio-button>
<el-radio-button label="3"></el-radio-button>
<el-radio-button label="4"></el-radio-button>
<el-radio-button label="5"></el-radio-button>
<el-radio-button label="6"></el-radio-button>
<el-radio-button label="7"></el-radio-button>
<el-radio-button label="8"></el-radio-button>
<el-radio-button label="9"></el-radio-button>
<el-radio-button label="10"></el-radio-button>
</el-radio-group>
<br />
<span>Your score:{{questionform.rated}}</span>
</el-form-item>
<el-form-item label="REFEREE'S RECOMMENDATIONS" prop="recommend">
<el-radio-group v-model="questionform.recommend">
<el-radio :label="1">Accept with minor changes</el-radio>
<br />
<el-radio
:label="2"
>Accept subject to revisions, as noted in comments</el-radio>
<br />
<el-radio
:label="3"
>Reject in current form, but may be resubmitted</el-radio>
<br />
<el-radio :label="4">Reject, with no resubmission</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="OTHER SPECIFIC CRITICISMS">
<el-radio-group v-model="questionform.other">
<el-radio :label="1">Imperfect style</el-radio>
<br />
<el-radio :label="2">Too long</el-radio>
<br />
<el-radio :label="3">References incorrectly presented</el-radio>
<br />
<el-radio :label="4">Typographical and Grammatical errors</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="Confidential Comments to the Editor">
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.confident"
:rows="8"
></el-input>
</el-form-item>
<el-form-item label="Comments for the Authors">
<el-input
type="textarea"
placeholder="please input content"
v-model="questionform.comment"
:rows="8"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="questionSubmit">submit</el-button>
</el-form-item>
</el-collapse>
</el-form>
</el-card>
</el-col>
</el-row>
</div>
</div>
</template>
<script>
export default {
data() {
return {
baseUrl: this.Common.baseUrl,
mediaUrl: this.Common.mediaUrl,
dateId: this.$route.query.id,
username: localStorage.getItem('ms_username'),
loading:false,
articlefileList: [],
figFileList: [],
articlezipList: [],
detailDate: {
artrevid: '',
article: '',
acceptSN:'',
reviewer: '',
articlefile: '',
articlezip: '',
ctime: '',
state: ''
},
questionform: {
rev_qu_id: '',
art_rev_id: this.$route.query.id,
qu1: '',
qu2: '',
qu3: '',
qu4: '',
qu5: '',
qu6: '',
qu7: '',
qu8: '',
qu9: 'false',
qu9contents: '',
qu10: 'false',
qu10contents: '',
qu11: 'false',
qu11contents: '',
qu12: 'false',
qu12contents: '',
qu13: 'false',
qu13contents: '',
qu14: 'false',
qu14contents: '',
qu15: 'false',
qu15contents: '',
rated: '',
recommend: '',
other: '',
confident: '',
comment: ''
},
rules: {
recommend: [{ required: true, message: 'please select', trigger: 'blur' }]
}
};
},
created: function () {
this.getDate();
this.initFileList();
this.initquesion();
},
computed: {},
methods: {
upload_file(type) {
return this.baseUrl + 'api/reviewer/up_file/type/' + type;
},
questionSubmit() {
this.$refs.question.validate((valid) => {
if (valid) {
this.loading = true;
this.$api.post('api/Reviewer/questionSubmit', this.questionform).then((res) => {
this.loading=false;
if (res.code == 0) {
this.$message.success('success!!');
this.$router.go(0);
} else {
this.$message.error('question submit error');
}
});
} else {
this.$message.error('please select a recommend option');
}
});
},
onSubmit() {
if (this.detailDate.articlefile == '') {
this.$message.error('you must upload article file');
console.log('file up error');
return false;
}
this.loading = true;
this.$api
.post('api/Reviewer/articleReviewerUpSubmit/type/reviewer', this.detailDate)
.then((res) => {
this.loading = false;
if (res.code == 0) {
this.$message.success('success');
this.$router.go(0);
} else {
this.$message.error('Failed to submit, please contact administrator!');
console.log(res.msg);
}
})
.catch((err) => {
console.log(err);
});
},
//初始化详情信息
getDate() {
this.$api
.post('api/Reviewer/getartrevdate', { revid: this.dateId, human: 'reviewer' })
.then((res) => {
if(res.state == 4){
this.$message.error('this review expired!');
this.$router.push('/reviewerArticleList');
}
this.detailDate.artrevid = res.art_rev_id;
this.detailDate.article = res.article_title;
this.detailDate.acceptSN = res.accept_sn;
this.detailDate.reviewer = res.account;
this.detailDate.ctime = res.ctime;
this.detailDate.state = res.state;
})
.catch((err) => {
console.log(err);
});
},
//初始化filelist
initFileList() {
this.$api
.post('api/Reviewer/getAFilelistByID', { revid: this.dateId })
.then((res) => {
this.articlefileList = res.data;
})
.catch((err) => {
console.log(err);
});
this.$api
.post('api/Reviewer/getBFilelistByID', { revid: this.dateId })
.then((res) => {
this.figFileList = res.data;
})
.catch((err) => {
console.log(err);
});
},
//初始化问卷
initquesion() {
this.$api.post('api/Reviewer/getQuestion', { artrevid: this.dateId }).then((res) => {
if (res.code == 0) {
this.questionform.rev_qu_id = res.data.rev_qu_id;
this.questionform.qu1 = res.data.qu1;
this.questionform.qu2 = res.data.qu2;
this.questionform.qu3 = res.data.qu3;
this.questionform.qu4 = res.data.qu4;
this.questionform.qu5 = res.data.qu5;
this.questionform.qu6 = res.data.qu6;
this.questionform.qu7 = res.data.qu7;
this.questionform.qu8 = res.data.qu8;
this.questionform.qu9 = res.data.qu9;
this.questionform.qu9contents = res.data.qu9_contents;
this.questionform.qu10 = res.data.qu10 == 0 ? false : true;
this.questionform.qu10contents = res.data.qu10_contents;
this.questionform.qu11 = res.data.qu11 == 0 ? false : true;
this.questionform.qu11contents = res.data.qu11_contents;
this.questionform.qu12 = res.data.qu12 == 0 ? false : true;
this.questionform.qu12contents = res.data.qu12_contents;
this.questionform.qu13 = res.data.qu13 == 0 ? false : true;
this.questionform.qu13contents = res.data.qu13_contents;
this.questionform.qu14 = res.data.qu14 == 0 ? false : true;
this.questionform.qu14contents = res.data.qu14_contents;
this.questionform.qu15 = res.data.qu15 == 0 ? false : true;
this.questionform.qu15contents = res.data.qu15_contents;
this.questionform.rated = res.data.rated;
this.questionform.recommend = res.data.recommend;
this.questionform.other = res.data.other;
this.questionform.confident = res.data.confidential;
this.questionform.comment = res.data.comments;
}
});
},
//检验上传文件的格式
beforeupload_file(file) {
// const isWORd =
// file.type === 'application/msword' ||
// file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';
// if (!isWORd) {
// this.$message.error('Only word files can be uploaded(.doc,.docx)');
// }
// return isWORd;
},
beforeupload_articlezip(file) {
// const iszip = file.type === 'application/x-zip-compressed' || file.name.split('.')[1] === 'rar';
// if (!iszip) {
// this.$message.error('Only compressed files can be uploaded(.rar,.zip)');
// }
// return iszip;
},
getlinkurl(row) {
return this.mediaUrl + row.file_url;
},
filedateformate(row, column, cellValue, index) {
return this.formatDate(cellValue);
},
uperr_file(err) {
this.$message.error('Upload error');
},
beforeupload() {},
upSuccess_file(res, file) {
if (res.code == 0) {
this.detailDate.articlefile = 'articlefile/' + res.upurl;
} else {
this.$message.error('Service error:' + res.msg);
}
},
upSuccess_articlezip(res, file) {
if (res.code == 0) {
this.detailDate.articlezip = 'articlezip/' + res.upurl;
} else {
this.$message.error('Service error:' + res.msg);
}
},
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;
},
//超出传送文件个数限制
alertlimit() {
this.$message.error('The maximum number of uploaded files has been exceeded');
},
//清除文件时的事件
removefilearticlefile(file, fileList) {
this.detailDate.articlefile = '';
},
removefilearticlezip(file, fileList) {
this.detailDate.articlezip = '';
},
mystate(mystate) {
let str = '';
switch (mystate) {
case 0:
str = 'With reviewer';
break;
case 1:
str = 'Revision';
break;
case 2:
str = 'Reject';
break;
case 3:
str = 'Accepted';
break;
case 4:
str = 'invalid';
break;
}
return str;
}
}
};
</script>
<style scoped>
.dwnbtn {
margin-bottom: 5px;
}
.container {
min-width: 1000px;
}
.tree_box {
padding: 15px 10px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
h2 {
text-align: center;
}
.sectitle {
font-size: 15px;
font-weight: 500;
/* line-height: 25px; */
}
</style>