Files
tougao_web/src/components/page/reviewerArticleDetail.vue
wangjinlei f087543b0f 20230517
2023-05-17 13:21:01 +08:00

718 lines
29 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" empty-text="New messages (0)">
<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" empty-text="New messages (0)">
<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" style="line-height: 30px;">
<el-radio :label="1">Accept with minor revision</el-radio>
<br />
<el-radio :label="2">Accept with major revision</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" style="line-height: 30px;">
<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="Comments for the Authors" v-if="this.txt_mess.atype == 'Comment' || this.txt_mess.atype == 'News'">
<el-input type="textarea" placeholder="please input content" v-model="questionform.comment" :rows="8"></el-input>
</el-form-item>
<el-form-item label="Comments for the Authors" prop="comment" v-if="this.txt_mess.atype != 'Comment' && this.txt_mess.atype != 'News'">
<el-input type="textarea" placeholder="please input content" v-model="questionform.comment" :rows="8"></el-input>
</el-form-item>
<el-form-item label="Confidential Comments to the Editor">
<el-input type="textarea" placeholder="please input content" v-model="questionform.confidential" :rows="8"></el-input>
</el-form-item>
<el-form-item label="Please choose disclose your name or remain anonymous.">
<el-radio-group v-model="questionform.is_anonymous" style="line-height: 30px;">
<el-radio :label="0">Disclose name</el-radio>
<br />
<el-radio :label="1">Remain anonymous</el-radio>
</el-radio-group>
<p style="line-height: 20px;color: #aaa;font-size: 13px;margin: 12px 0 0 0;">
If you agree to disclose your name, we will acknowledge you by name in the published
PDF. However, if you prefer to remain anonymous, we will still express our gratitude
by thanking you as an anonymous reviewer.
<br />For example, {{txt_mess.title}} would like to thank AAAAAAAA, BBBBBBBB, and other anonymous reviewers for their
invaluable contributions to the peer review process of this paper.
</p>
</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('U_name'),
loading: false,
articlefileList: [],
figFileList: [],
articlezipList: [],
txt_mess: {},
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: '',
qu9contents: '',
qu10: '',
qu10contents: '',
qu11: '',
qu11contents: '',
qu12: '',
qu12contents: '',
qu13: '',
qu13contents: '',
qu14: '',
qu14contents: '',
qu15: '',
qu15contents: '',
rated: '',
recommend: '',
other: '',
confident: '',
comment: ''
},
rules: {
recommend: [{
required: true,
message: 'please select',
trigger: 'blur'
}],
comment: [{
required: true,
message: "please input content",
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() {
if (this.questionform.is_anonymous == "" && this.questionform.is_anonymous != "0") {
this.$message.error('Please choose disclose your name or remain anonymous.');
} else {
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.loading = false
this.$message.error('Please complete the information!');
}
});
}
},
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;
this.txt_mess = res;
})
.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;
this.questionform.is_anonymous = res.data.is_anonymous;
}
});
},
//检验上传文件的格式
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 = 'Accept';
break;
case 4:
str = 'invalid';
break;
case 5:
str = 'invitation';
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>