This commit is contained in:
徐哼唧L
2022-12-09 16:18:12 +08:00
parent dc4d87a990
commit 5ed3073b6e
130 changed files with 41608 additions and 2013 deletions

View File

@@ -0,0 +1,511 @@
<template>
<div>
<!-- <p class="luan_ma">以下内容的"&ltb> &lt/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>