|
|
|
|
@ -1,24 +1,83 @@ |
|
|
|
|
<template> |
|
|
|
|
<el-form ref="form" :model="form" label-width="80px"> |
|
|
|
|
<el-form-item label="论文类型"> |
|
|
|
|
<el-select v-model="form.type"> |
|
|
|
|
<el-option v-for="item in options" :key="item.value" :value="item.value" placeholder="请输入论文类型">{{item.label}}</el-option> |
|
|
|
|
<el-form-item :label="$t('upload.form.type')"> |
|
|
|
|
<el-select v-model="form.type" :placeholder="$t('upload.form.input_type',{type:$t('upload.form.type')})"> |
|
|
|
|
<el-option v-for="item in options" :key="item.value" :value="item.value">{{item.label}}</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="论文作者"> |
|
|
|
|
<el-form-item :label="$t('upload.form.author')"> |
|
|
|
|
<el-col :span="4"> |
|
|
|
|
<el-input v-model="form.author" placeholder="请输入论文作者"></el-input> |
|
|
|
|
<el-input v-model="form.author" |
|
|
|
|
:placeholder="$t('upload.form.input_author',{author:$t('upload.form.author')})"></el-input> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="学科专业"> |
|
|
|
|
<el-form-item :label="$t('upload.form.profession')"> |
|
|
|
|
<el-col :span="4"> |
|
|
|
|
<el-input v-model="form.profession" placeholder="请输入学科专业"></el-input> |
|
|
|
|
<el-input v-model="form.profession" |
|
|
|
|
:placeholder="$t('upload.form.input_profession',{profession:$t('upload.form.profession')})"></el-input> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item :label="$t('upload.form.school')"> |
|
|
|
|
<el-col :span="4"> |
|
|
|
|
<el-input v-model="form.school" |
|
|
|
|
:placeholder="$t('upload.form.input_school',{school:$t('upload.form.school')})"></el-input> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item :label="$t('upload.form.year')"> |
|
|
|
|
<el-select v-model="form.year" :placeholder="$t('upload.form.input_year',{year:$t('upload.form.year')})"> |
|
|
|
|
<el-option v-for="n in 10" :key="n" :value="2019-n">{{2019-n}}</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item :label="$t('upload.form.summary')"> |
|
|
|
|
<el-col :span="4"> |
|
|
|
|
<el-input v-model="form.summary" type="textarea" |
|
|
|
|
:placeholder="$t('upload.form.input_summary',{summary:$t('upload.form.summary')})"></el-input> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item :label="$t('upload.form.tag')"> |
|
|
|
|
<el-tag |
|
|
|
|
:key="tag" |
|
|
|
|
v-for="tag in form.tag.dynamicTags" |
|
|
|
|
closable |
|
|
|
|
:disable-transitions="false" |
|
|
|
|
@close="handleClose(tag)"> |
|
|
|
|
{{tag}} |
|
|
|
|
</el-tag> |
|
|
|
|
<el-col :span="4" v-if="form.tag.inputVisible"> |
|
|
|
|
<el-input |
|
|
|
|
class="input-new-tag" |
|
|
|
|
v-model="form.tag.inputValue" |
|
|
|
|
ref="saveTagInput" |
|
|
|
|
size="small" |
|
|
|
|
@keyup.enter.native="handleInputConfirm" |
|
|
|
|
@blur="handleInputConfirm" |
|
|
|
|
> |
|
|
|
|
</el-input> |
|
|
|
|
</el-col> |
|
|
|
|
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ {{$t('upload.form.tag')}}</el-button> |
|
|
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item :label="$t('upload.form.content')"> |
|
|
|
|
<el-upload |
|
|
|
|
class="upload-demo" |
|
|
|
|
action="https://jsonplaceholder.typicode.com/posts/" |
|
|
|
|
:on-preview="handlePreview" |
|
|
|
|
:on-remove="handleRemove" |
|
|
|
|
:before-remove="beforeRemove" |
|
|
|
|
:file-list="form.fileList" |
|
|
|
|
accept=".txt"> |
|
|
|
|
<el-button size="small" type="primary">{{$t('upload.form.upload')}}</el-button> |
|
|
|
|
<div slot="tip" class="el-upload__tip">{{$t('upload.form.upload_tip')}}</div> |
|
|
|
|
</el-upload> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item> |
|
|
|
|
<el-button type="primary" @click="onSubmit">{{$t('submit')}}</el-button> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-form> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script lang="ts"> |
|
|
|
|
<script> |
|
|
|
|
export default { |
|
|
|
|
name: 'upload', |
|
|
|
|
data() { |
|
|
|
|
@ -26,16 +85,64 @@ |
|
|
|
|
form: { |
|
|
|
|
type: '', |
|
|
|
|
author: '', |
|
|
|
|
profession:'' |
|
|
|
|
profession: '', |
|
|
|
|
school: '', |
|
|
|
|
year: '', |
|
|
|
|
summary: '', |
|
|
|
|
tag: { |
|
|
|
|
dynamicTags: [], |
|
|
|
|
inputVisible: false, |
|
|
|
|
inputValue: '' |
|
|
|
|
}, |
|
|
|
|
fileList: [] |
|
|
|
|
}, |
|
|
|
|
options: [{ |
|
|
|
|
value: '选项1', |
|
|
|
|
value: '硕士论文', |
|
|
|
|
label: '硕士论文' |
|
|
|
|
}, { |
|
|
|
|
value: '选项2', |
|
|
|
|
value: '博士论文', |
|
|
|
|
label: '博士论文' |
|
|
|
|
}] |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
//删除标签 |
|
|
|
|
handleClose(tag) { |
|
|
|
|
this.form.tag.dynamicTags.splice(this.form.tag.dynamicTags.indexOf(tag), 1) |
|
|
|
|
}, |
|
|
|
|
//显示添加标签输入框 |
|
|
|
|
showInput() { |
|
|
|
|
this.form.tag.inputVisible = true |
|
|
|
|
this.$nextTick(_ => { |
|
|
|
|
this.$refs.saveTagInput.$refs.input.focus() |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
//确认添加标签 |
|
|
|
|
handleInputConfirm() { |
|
|
|
|
let inputValue = this.form.tag.inputValue |
|
|
|
|
if (inputValue) { |
|
|
|
|
this.form.tag.dynamicTags.push(inputValue) |
|
|
|
|
} |
|
|
|
|
console.info(this.form.tag.dynamicTags) |
|
|
|
|
this.form.tag.inputVisible = false |
|
|
|
|
this.form.tag.inputValue = '' |
|
|
|
|
}, |
|
|
|
|
//删除论文 |
|
|
|
|
handleRemove(file, fileList) { |
|
|
|
|
console.log(file, fileList) |
|
|
|
|
}, |
|
|
|
|
//预览论文 |
|
|
|
|
handlePreview(file) { |
|
|
|
|
console.log(file) |
|
|
|
|
}, |
|
|
|
|
//确认移除论文 |
|
|
|
|
beforeRemove(file, fileList) { |
|
|
|
|
return this.$confirm($t('upload.form.remove',{file:file.name})) |
|
|
|
|
}, |
|
|
|
|
//提交论文 |
|
|
|
|
onSubmit(){ |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</script> |
|
|
|
|
|
pan
5 years ago