0
This commit is contained in:
511
src/components/page/PB_checkLate.vue
Normal file
511
src/components/page/PB_checkLate.vue
Normal file
@@ -0,0 +1,511 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- <p class="luan_ma">以下内容的"<b> </b>"是生成环节的必要 请不要删除!!!</p> -->
|
||||
<el-row :gutter="20" style="margin: 0 auto;height: 100%;overflow: hidden;">
|
||||
<el-col :span="24" style="height: 100%;padding: 10px 0;">
|
||||
<!-- <div class="step_role">
|
||||
<el-steps :active="2" class="move_bar">
|
||||
<el-step title="Choice" @click.native="handleStep1()">
|
||||
<i class="step01" slot="icon"></i>
|
||||
</el-step>
|
||||
<el-step title="Check">
|
||||
<i class="step02" slot="icon"></i>
|
||||
</el-step>
|
||||
<el-step title="Generate" @click.native="handleStep3()">
|
||||
<i class="step03" slot="icon"></i>
|
||||
</el-step>
|
||||
</el-steps>
|
||||
</div> -->
|
||||
<div class="pane_act" v-loading="loading" element-loading-text="Loading desperately..." element-loading-spinner="el-icon-loading"
|
||||
element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||
<h1>
|
||||
<img src="../../assets/img/temp-iocn.png" style="vertical-align: middle;margin: 0 5px 0 0;">
|
||||
{{this.article_title}}
|
||||
</h1>
|
||||
<div>
|
||||
<div class="vefi_cation">
|
||||
<h3 class="mark">Title</h3>
|
||||
<el-input type="textarea" v-model="checkForm.info_title" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3 class="mark">Type</h3>
|
||||
<p>{{checkForm.info_type}}</p>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3 class="mark">Author</h3>
|
||||
<el-input type="textarea" v-model="checkForm.author" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3 class="mark">Department-Institution-Address</h3>
|
||||
<el-input type="textarea" v-model="checkForm.authorAddress" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Author Contribution</h3>
|
||||
<el-input type="textarea" v-model="checkForm.authorContribution" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
|
||||
<div class="vefi_cation">
|
||||
<h3>Acknowledgment</h3>
|
||||
<el-input type="textarea" v-model="checkForm.acknowledgment" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Corresponding Author</h3>
|
||||
<el-input type="textarea" v-model="checkForm.authorCorresponding" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Author Corresponding Email</h3>
|
||||
<el-input type="textarea" v-model="checkForm.authorCorrespondingEmail" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Abbreviation</h3>
|
||||
<el-input type="textarea" v-model="checkForm.abbreviation" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Accepted Date</h3>
|
||||
{{modifDate(checkForm.accepted_date)}}
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Received Date</h3>
|
||||
{{modifDate(checkForm.received_date)}}
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Topic</h3>
|
||||
<el-input type="textarea" v-model="checkForm.topic" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Keywords</h3>
|
||||
<el-input type="textarea" v-model="checkForm.keywords" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Doi</h3>
|
||||
{{checkForm.doi}}
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Traditon</h3>
|
||||
<el-input type="textarea" v-model="checkForm.traditon" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Abstract Text</h3>
|
||||
<el-input type="textarea" v-model="checkForm.abstractText" :autosize="{minRows: 2}"></el-input>
|
||||
</div>
|
||||
<div style="text-align: center;">
|
||||
<el-button type="primary" style="width: 400px;margin: 10px auto 50px auto;" @click="checkActicle(checkForm)">OK</el-button>
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3 class="mark">MainText</h3>
|
||||
<p style="font-size: 14px;line-height: 1.6;color: #606266;">{{checkForm.mainText}}</p>
|
||||
<!-- <el-input type="textarea" v-model="checkForm.mainText" :autosize="{minRows: 2}"></el-input> -->
|
||||
<!-- <quill-editor ref="myTextEditor" v-model="checkForm.mainText" :options="editorOption"></quill-editor> -->
|
||||
<!-- <el-upload class="avatar-uploader" :action="" name="journalfooter" :show-file-list="false"
|
||||
:on-success="uploadSuccess">
|
||||
</el-upload> -->
|
||||
</div>
|
||||
<div class="vefi_cation">
|
||||
<h3>Reference</h3>
|
||||
<div class="vef_refen" v-for="item in this.refFile">
|
||||
<p>
|
||||
{{item.refer_title}}
|
||||
<i class="el-icon-edit" @click="handleEdit(item.typesetInfoReferenceId,item.refer_title)"></i>
|
||||
<i class="el-icon-delete" @click="handleDelete(item.typesetInfoReferenceId)" style="color: #ff3636;"></i>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 编辑参考文献弹出框 -->
|
||||
<el-dialog title="Edit references" :visible.sync="editVisible" width="50%">
|
||||
<el-form ref="edit_Form" :model="editForm" :rules="rules" label-width="95px">
|
||||
<el-form-item label="Reference" prop="title">
|
||||
<el-input v-model="editForm.title" type="textarea" :autosize="{minRows: 2}"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="editVisible = false">Cancel</el-button>
|
||||
<el-button type="primary" @click="saveEdit(editForm)">OK</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'quill/dist/quill.core.css';
|
||||
import 'quill/dist/quill.snow.css';
|
||||
import 'quill/dist/quill.bubble.css';
|
||||
import {
|
||||
quillEditor
|
||||
} from 'vue-quill-editor';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
article_id: this.$route.query.esay_id,
|
||||
article_title: '',
|
||||
loading: false,
|
||||
editVisible: false,
|
||||
checkForm: {
|
||||
'info_title': '',
|
||||
'info_type': '',
|
||||
'author': '',
|
||||
'authorAddress': '',
|
||||
'authorContribution': '',
|
||||
'acknowledgment': '',
|
||||
'authorCorresponding': '',
|
||||
'authorCorrespondingEmail': '',
|
||||
'abbreviation': '',
|
||||
'accepted_date': '',
|
||||
'online_date': '',
|
||||
'received_date': '',
|
||||
'topic': '',
|
||||
'little_author': '',
|
||||
'keywords': '',
|
||||
'doi': '',
|
||||
'traditon': '',
|
||||
'abstractText': '',
|
||||
'mainText': ''
|
||||
},
|
||||
refFile: [],
|
||||
editForm: {
|
||||
title: '',
|
||||
typesetInfoReferenceId: '',
|
||||
},
|
||||
content: '',
|
||||
editorOption: {
|
||||
placeholder: 'Please enter...',
|
||||
modules: {
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
['blockquote', 'code-block'],
|
||||
[{
|
||||
'header': 1
|
||||
}, {
|
||||
'header': 2
|
||||
}],
|
||||
[{
|
||||
'list': 'ordered'
|
||||
}, {
|
||||
'list': 'bullet'
|
||||
}],
|
||||
[{
|
||||
'script': 'sub'
|
||||
}, {
|
||||
'script': 'super'
|
||||
}],
|
||||
[{
|
||||
'indent': '-1'
|
||||
}, {
|
||||
'indent': '+1'
|
||||
}],
|
||||
[{
|
||||
'direction': 'rtl'
|
||||
}],
|
||||
[{
|
||||
'size': ['small', false, 'large', 'huge']
|
||||
}],
|
||||
[{
|
||||
'header': [1, 2, 3, 4, 5, 6, false]
|
||||
}],
|
||||
[{
|
||||
'color': []
|
||||
}, {
|
||||
'background': []
|
||||
}],
|
||||
[{
|
||||
'font': []
|
||||
}],
|
||||
[{
|
||||
'align': []
|
||||
}],
|
||||
['link', 'image', 'video']
|
||||
],
|
||||
// 工具栏
|
||||
handlers: {
|
||||
image: function(value) {
|
||||
if (value) {
|
||||
// upload点击上传事件
|
||||
document.querySelector('.avatar-uploader input').click()
|
||||
} else {
|
||||
this.quill.format('image', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
title: [{
|
||||
required: true,
|
||||
message: 'To add a reference, please enter',
|
||||
trigger: 'blur'
|
||||
}]
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
created() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getData() {
|
||||
this.$api
|
||||
.post('typeset/gettypesetdetail', {
|
||||
'typesetId': this.article_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.ret == 0) {
|
||||
this.article_title = res.data.info.title;
|
||||
this.checkForm = res.data.info.u_typeset_info;
|
||||
this.checkForm.mainText = res.data.info.u_typeset_info.mainText;
|
||||
this.refFile = res.data.refers;
|
||||
} else {
|
||||
this.$message.error(res.error);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
// 提交文章排版
|
||||
checkActicle(checkForm) {
|
||||
if (this.checkForm.info_title == '' || this.checkForm.author == '' || this.checkForm.authorAddress == '' || this.checkForm
|
||||
.mainText == '') {
|
||||
this.$message.error('Please complete the information');
|
||||
} else {
|
||||
this.loading = true;
|
||||
this.$api
|
||||
.post('typeset/edittypesetinfo', this.checkForm)
|
||||
.then(res => {
|
||||
if (res.ret == 0) {
|
||||
this.$router.push({
|
||||
path: '/formwork',
|
||||
query: {
|
||||
esay_id: this.article_id
|
||||
}
|
||||
});
|
||||
this.loading = false;
|
||||
} else {
|
||||
this.loading = false;
|
||||
this.$message.error(res.error);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.loading = false;
|
||||
this.$message.error(err);
|
||||
});
|
||||
}
|
||||
},
|
||||
// 编辑文献操作
|
||||
handleEdit(e, h) {
|
||||
this.editForm.title = h;
|
||||
this.editForm.typesetInfoReferenceId = e;
|
||||
this.editVisible = true;
|
||||
},
|
||||
// 保存文献
|
||||
saveEdit(editForm) {
|
||||
this.$refs.edit_Form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$api
|
||||
.post('typeset/editTypesetRefer', this.editForm)
|
||||
.then(res => {
|
||||
if (res.ret == 0) {
|
||||
this.editVisible = false;
|
||||
this.$message.success(`Change succeeded!`);
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.error);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 删除文献操作
|
||||
handleDelete(e) {
|
||||
// 二次确认删除
|
||||
this.$confirm('Are you sure you want to delete?', 'Tips', {
|
||||
confirmButtonText: 'OK',
|
||||
cancelButtonText: 'Cancel',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.$api
|
||||
.post('typeset/delTypesetReferById', {
|
||||
'typeset_info_reference_id': e
|
||||
})
|
||||
.then(res => {
|
||||
if (res.ret == 0) {
|
||||
this.$message.success('Delete succeeded');
|
||||
this.getData();
|
||||
} else {
|
||||
this.$message.error(res.error);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
// 富文本编辑器
|
||||
onEditorChange({
|
||||
editor,
|
||||
html,
|
||||
text
|
||||
}) {
|
||||
this.content = html;
|
||||
},
|
||||
|
||||
// 上传成功
|
||||
// uploadSuccess(res) {
|
||||
// let quill = this.$refs.myTextEditor.quill;
|
||||
|
||||
// // 获取光标所在位置
|
||||
// let length = quill.getSelection().index
|
||||
// // 插入图片 res.upurl为服务器返回的图片地址
|
||||
// // quill.insertEmbed(length, 'image', this.IMGqi_Url + 'journalfooter/' + res.upurl)
|
||||
// // 调整光标到最后
|
||||
// quill.setSelection(length + 1)
|
||||
// }
|
||||
|
||||
// 点击步骤条
|
||||
handleStep1() {
|
||||
this.$router.push({
|
||||
path: '/compose',
|
||||
query: {
|
||||
esay_id: this.article_id
|
||||
}
|
||||
});
|
||||
},
|
||||
handleStep3() {
|
||||
this.$router.push({
|
||||
path: '/formwork',
|
||||
query: {
|
||||
esay_id: this.article_id
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 修改时间标准格式
|
||||
modifDate(e) {
|
||||
let date = new Date(parseInt(e));
|
||||
let Y = date.getFullYear() + '-';
|
||||
let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) + '-' : date.getMonth() + 1 + '-';
|
||||
let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
|
||||
return Y + M + D;
|
||||
},
|
||||
},
|
||||
components: {
|
||||
quillEditor
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.luan_ma {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
left: 50%;
|
||||
margin-left: -290px;
|
||||
color: #e61e12;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.step_role {
|
||||
margin: 0 auto 10px auto;
|
||||
/* width: 800px; */
|
||||
}
|
||||
|
||||
.step_role .move_bar {
|
||||
width: 100%;
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
|
||||
.pane_act {
|
||||
background-color: #fff;
|
||||
height: 90.5%;
|
||||
}
|
||||
|
||||
.pane_act>h1 {
|
||||
font-size: 15px;
|
||||
margin: 0 0 5px 0;
|
||||
padding: 15px 0 15px 20px;
|
||||
border-bottom: 1px solid #dde1eb;
|
||||
box-shadow: rgb(134 134 134) 0px 5px 5px -2px;
|
||||
}
|
||||
|
||||
.pane_act>div {
|
||||
/* height: 92%;
|
||||
overflow-y: scroll; */
|
||||
}
|
||||
|
||||
.vefi_cation {
|
||||
padding: 20px 30px;
|
||||
}
|
||||
|
||||
.vefi_cation>h3 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.vefi_cation>h3.mark:before {
|
||||
content: '*';
|
||||
color: #F56C6C;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.vefi_cation .el-textarea__inner {
|
||||
box-shadow: 1px 1px 5px 1px rgb(46 91 255 / 20%);
|
||||
font-size: 14px;
|
||||
font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
.vefi_cation .ql-toolbar.ql-snow {
|
||||
border: 0;
|
||||
box-shadow: 1px 1px 5px 1px rgb(46 91 255 / 20%);
|
||||
}
|
||||
|
||||
.vefi_cation .ql-container.ql-snow {
|
||||
border: 0;
|
||||
box-shadow: 1px 1px 5px 1px rgb(46 91 255 / 20%);
|
||||
}
|
||||
|
||||
.vefi_cation .vef_refen>p {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
color: #606266;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
|
||||
.vefi_cation .vef_refen>p>i {
|
||||
display: none;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
color: #39aeff;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.vefi_cation .vef_refen>p:hover {
|
||||
box-shadow: 1px 1px 5px 1px rgb(46 91 255 / 20%);
|
||||
}
|
||||
|
||||
.vefi_cation .vef_refen>p:hover i.el-icon-edit {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.vefi_cation .vef_refen>p:hover i.el-icon-delete {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user