panqihua
/
cloudnote_web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

对接后台论文上传接口

Browse Source
master
pan 4 years ago
parent 9c4e3da4e2
commit 5b86913910
5 changed files with 117 additions and 27 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 8
      components/account/login.vue
  2. 2
      components/account/register.vue
  3. 6
      nuxt.config.js
  4. 119
      pages/index/upload.vue
  5. 9
      plugins/global.js

8
components/account/login.vue
Unescape View File

@ -15,7 +15,9 @@
<script lang="ts"> <script lang="ts">
export default { import Vue from 'vue'
export default Vue.extend({
name: 'login', name: 'login',
data() { data() {
return { return {
@ -41,7 +43,7 @@
this.$refs.form.validate((valid: boolean) => { this.$refs.form.validate((valid: boolean) => {
if (valid) { if (valid) {
let that = this let that = this
this.GLOBAL.postJSON('/v1/api/users/sign_in', { this.GLOBAL.fetchJSON('/v1/api/users/sign_in','POST', {
userName: this.form.user, userName: this.form.user,
password: this.form.password password: this.form.password
}, function(res) { }, function(res) {
@ -66,5 +68,5 @@
}) })
} }
} }
} })
</script> </script>

2
components/account/register.vue
Unescape View File

@ -64,7 +64,7 @@
this.$refs.form.validate((valid: boolean)=>{ this.$refs.form.validate((valid: boolean)=>{
if(valid){ if(valid){
let that=this let that=this
this.GLOBAL.postJSON('/v1/api/users/sign_up',{ userName: this.form.user, password: this.form.password },function(res) { this.GLOBAL.fetchJSON('/v1/api/users/sign_up','POST',{ userName: this.form.user, password: this.form.password },function(res) {
if(res.code==='200'){ if(res.code==='200'){
that.$message.info(that.$t('account.form.tip.register_ok').toString()) that.$message.info(that.$t('account.form.tip.register_ok').toString())
that.$router.push(that.localePath('/')) that.$router.push(that.localePath('/'))

6
nuxt.config.js
Unescape View File

@ -216,13 +216,14 @@ export default {
}, },
"reading_online": "在线阅读", "reading_online": "在线阅读",
"reset": "重置", "reset": "重置",
"select_please": "请选择{keyword}",
"tip": "提示", "tip": "提示",
"today_recommend": "今日推荐", "today_recommend": "今日推荐",
"unknown_error": "未知错误", "unknown_error": "未知错误",
"upload": { "upload": {
"form": { "form": {
"author": "论文作者", "author": "论文作者",
"content": "论文", "content": "正文内容",
"profession": "学科专业", "profession": "学科专业",
"remove": "确定移除{file}", "remove": "确定移除{file}",
"school": "学校", "school": "学校",
@ -237,6 +238,7 @@ export default {
"ok": "论文上传成功" "ok": "论文上传成功"
} }
}, },
"upload_please": "请上传{keyword}",
"user": "帐号", "user": "帐号",
"zhCN": "简体中文" "zhCN": "简体中文"
}, },
@ -371,6 +373,7 @@ export default {
}, },
"reading_online": "", "reading_online": "",
"reset": "", "reset": "",
"select_please": "",
"tip": "", "tip": "",
"today_recommend": "", "today_recommend": "",
"unknown_error": "", "unknown_error": "",
@ -392,6 +395,7 @@ export default {
"ok": "" "ok": ""
} }
}, },
"upload_please": "",
"user": "", "user": "",
"zhCN": "Simplified Chinese" "zhCN": "Simplified Chinese"
} }

119
pages/index/upload.vue
Unescape View File

@ -1,40 +1,40 @@
<template> <template>
<el-form ref="form" :model="form" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item :label="$t('upload.form.type')"> <el-form-item :label="$t('upload.form.type')" prop="type">
<el-select v-model="form.type" :placeholder="$t('input_please',{type:$t('upload.form.type')})"> <el-select v-model="form.type" :placeholder="$t('select_please',{keyword:$t('upload.form.type')})">
<el-option v-for="item in options" :key="item.value" :value="item.value">{{item.label}}</el-option> <el-option v-for="item in options" :key="item.value" :value="item.value">{{item.label}}</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.author')"> <el-form-item :label="$t('upload.form.author')" prop="author">
<el-col :span="4"> <el-col :span="4">
<el-input v-model="form.author" <el-input v-model="form.author"
:placeholder="$t('input_please',{keyword:$t('upload.form.author')})"></el-input> :placeholder="$t('input_please',{keyword:$t('upload.form.author')})"></el-input>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.profession')"> <el-form-item :label="$t('upload.form.profession')" prop="profession">
<el-col :span="4"> <el-col :span="4">
<el-input v-model="form.profession" <el-input v-model="form.profession"
:placeholder="$t('input_please',{keyword:$t('upload.form.profession')})"></el-input> :placeholder="$t('input_please',{keyword:$t('upload.form.profession')})"></el-input>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.school')"> <el-form-item :label="$t('upload.form.school')" prop="school">
<el-col :span="4"> <el-col :span="4">
<el-input v-model="form.school" <el-input v-model="form.school"
:placeholder="$t('input_please',{keyword:$t('upload.form.school')})"></el-input> :placeholder="$t('input_please',{keyword:$t('upload.form.school')})"></el-input>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.year')"> <el-form-item :label="$t('upload.form.year')" prop="year">
<el-select v-model="form.year" :placeholder="$t('input_please',{keyword:$t('upload.form.year')})"> <el-select v-model="form.year" :placeholder="$t('select_please',{keyword:$t('upload.form.year')})">
<el-option v-for="n in 10" :key="n" :value="2019-n">{{2019-n}}</el-option> <el-option v-for="n in 10" :key="n" :value="2019-n">{{2019-n}}</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.summary')"> <el-form-item :label="$t('upload.form.summary')" prop="summary">
<el-col :span="4"> <el-col :span="4">
<el-input v-model="form.summary" type="textarea" <el-input autosize v-model="form.summary" type="textarea"
:placeholder="$t('input_please',{keyword:$t('upload.form.summary')})"></el-input> :placeholder="$t('input_please',{keyword:$t('upload.form.summary')})"></el-input>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.tag')"> <el-form-item :label="$t('upload.form.tag')" prop="tag">
<el-tag <el-tag
:key="tag" :key="tag"
v-for="tag in form.tag.dynamicTags" v-for="tag in form.tag.dynamicTags"
@ -57,22 +57,27 @@
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ {{$t('upload.form.tag')}}</el-button> <el-button v-else class="button-new-tag" size="small" @click="showInput">+ {{$t('upload.form.tag')}}</el-button>
</el-form-item> </el-form-item>
<el-form-item :label="$t('upload.form.content')"> <el-form-item :label="$t('upload.form.content')" prop="content">
<el-upload <el-upload
class="upload-demo" class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/" :action="GLOBAL.server_address+'/v1/api/file/upload'"
:on-preview="handlePreview" :on-preview="handlePreview"
:on-remove="handleRemove" :on-remove="handleRemove"
:before-remove="beforeRemove" :before-remove="beforeRemove"
:on-success="uploadOK"
:file-list="form.fileList" :file-list="form.fileList"
accept=".txt"> :limit="1"
<el-button size="small" type="primary">{{$t('upload.form.upload')}}</el-button> accept=".txt"
v-model="form.fileList"
ref="file">
<el-button size="small" type="primary" v-if="form.fileList.length===0">{{$t('upload.form.upload')}}</el-button>
<div slot="tip" class="el-upload__tip">{{$t('upload.form.upload_tip')}}</div> <div slot="tip" class="el-upload__tip">{{$t('upload.form.upload_tip')}}</div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit">{{$t('button.submit')}}</el-button> <el-button type="primary" @click="onSubmit">{{$t('button.submit')}}</el-button>
<el-button @click="$refs.form.resetFields();$refs.file.clearFiles();form.fileList=[]">{{$t('reset')}}</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
@ -83,6 +88,7 @@
export default Vue.extend({ export default Vue.extend({
name: 'upload', name: 'upload',
data() { data() {
let that=this
return { return {
form: { form: {
type: '', type: '',
@ -98,6 +104,42 @@
}, },
fileList: [] fileList: []
}, },
rules: {
type:[{
required: true,
message: this.$t('select_please',{keyword:this.$t('upload.form.type')})
}],
author:[{
required: true,
message: this.$t('input_please',{keyword:this.$t('upload.form.author')})
}],
profession:[{
required: true,
message: this.$t('input_please',{keyword:this.$t('upload.form.profession')})
}],
school:[{
required: true,
message: this.$t('input_please',{keyword:this.$t('upload.form.school')})
}],
year:[{
required: true,
message: this.$t('select_please',{keyword:this.$t('upload.form.year')})
}],
summary:[{
required: true,
message: this.$t('input_please',{keyword:this.$t('upload.form.summary')})
}],
content:[{
validator:(rule, value, callback) => {
if(that.form.fileList.length===0){
callback(rule.msg)
}else{
callback()
}
},
msg: this.$t('upload_please',{keyword:this.$t('upload.form.content')})
}]
},
options: [{ options: [{
value: '硕士论文', value: '硕士论文',
label: '硕士论文' label: '硕士论文'
@ -108,6 +150,11 @@
} }
}, },
methods: { methods: {
//上传成功
uploadOK(response, file, fileList){
this.form.fileList=fileList
file.id=response.data
},
//删除标签 //删除标签
handleClose(tag:string) { handleClose(tag:string) {
this.form.tag.dynamicTags.splice(this.form.tag.dynamicTags.indexOf(tag), 1) this.form.tag.dynamicTags.splice(this.form.tag.dynamicTags.indexOf(tag), 1)
@ -132,7 +179,14 @@
}, },
//删除论文 //删除论文
handleRemove(file: any, fileList: any) { handleRemove(file: any, fileList: any) {
console.log(file, fileList) let that=this
this.GLOBAL.fetchJSON(`/v1/api/file/remove/${this.form.fileList[0].id}`,'DELETE',{},function(res) {
if(res.code==='200'){
that.form.fileList=[]
}else{
that.$message.error(that.$t('error_500').toString())
}
})
}, },
//预览论文 //预览论文
handlePreview(file: any) { handlePreview(file: any) {
@ -140,11 +194,40 @@
}, },
//确认移除论文 //确认移除论文
beforeRemove(file: { name: string }, fileList: any) { beforeRemove(file: { name: string }, fileList: any) {
return this.$confirm(this.$t('upload.form.remove',{file:file.name}).toString()) return this.$confirm(this.$t('upload.form.remove',{file:file.name}).toString(),{
confirmButtonText:this.$t('button.ok').toString(),
cancelButtonText:this.$t('button.cancel').toString()
})
}, },
//提交论文 //提交论文
onSubmit(){ onSubmit(){
this.$alert(this.$t('upload.tip.ok').toString()) this.$refs.form.validate((valid: boolean) => {
if(valid){
let that=this
this.GLOBAL.fetchJSON('/v1/api/paper/upload','POST',{
type: this.form.type,
author: this.form.author,
profession: this.form.profession,
school: this.form.school,
year: this.form.year,
summary: this.form.summary,
tag:this.form.tag.dynamicTags.join(','),
fileId:this.form.fileList[0].id
},function(res) {
if(res.code==='200'){
that.$message.info(that.$t('upload.tip.ok').toString())
}else{
that.$message.error(that.$t('error_500').toString())
}
})
}else{
this.$message.error({
message: this.$t('form_err').toString(),
duration: 2000
})
return false
}
})
} }
} }
}) })

9
plugins/global.js
Unescape View File

@ -14,16 +14,17 @@ Vue.prototype.GLOBAL ={
return !(r.top > z.bottom || r.bottom < z.top || return !(r.top > z.bottom || r.bottom < z.top ||
r.left > z.right || r.right < z.left); r.left > z.right || r.right < z.left);
}, },
postJSON(url,form,success){ fetchJSON(url,method, form, success){
fetch(this.server_address + url, { fetch(this.server_address + url, {
body:JSON.stringify(form), body:JSON.stringify(form),
method: 'POST', method: method,
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
} },
credentials: "include"
}).then(res=>res.json()).then(res=>success(res)).catch(err=>{ }).then(res=>res.json()).then(res=>success(res)).catch(err=>{
console.error(err) console.error(err)
}) })
} },
} }

Write Preview
Loading…
Cancel
Save