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

笔记导出

Browse Source
master
pan 4 years ago
parent 4fec3aabac
commit eccfb2e321
3 changed files with 175 additions and 150 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. 12
      nuxt.config.js
  2. 16
      pages/index/note.vue
  3. 297
      pages/index/read.vue

12
nuxt.config.js
Unescape View File

@ -188,6 +188,8 @@ export default {
"new_recommend": "最新推荐", "new_recommend": "最新推荐",
"note": { "note": {
"table": { "table": {
"note_content": "笔记内容",
"note_title": "笔记标题",
"original_text": "注释原文", "original_text": "注释原文",
"paper_name": "论文标题" "paper_name": "论文标题"
}, },
@ -201,9 +203,7 @@ export default {
"search": "查找" "search": "查找"
}, },
"form": { "form": {
"keyword": "关键字", "keyword": "关键字"
"note_content": "笔记内容",
"note_title": "笔记标题"
}, },
"tip": { "tip": {
"add_tip": "是否添加该笔记？", "add_tip": "是否添加该笔记？",
@ -362,6 +362,8 @@ export default {
"new_recommend": "", "new_recommend": "",
"note": { "note": {
"table": { "table": {
"note_content": "",
"note_title": "",
"original_text": "", "original_text": "",
"paper_name": "" "paper_name": ""
}, },
@ -375,9 +377,7 @@ export default {
"search": "" "search": ""
}, },
"form": { "form": {
"keyword": "", "keyword": ""
"note_content": "",
"note_title": ""
}, },
"tip": { "tip": {
"add_tip": "", "add_tip": "",

16
pages/index/note.vue
Unescape View File

@ -3,11 +3,11 @@
<el-row type="flex" justify="center"> <el-row type="flex" justify="center">
<el-col :span="5"> <el-col :span="5">
<el-form ref="form" :model="form" label-width="80px"> <el-form ref="form" :model="form" label-width="80px">
<el-form-item :label="$t('read.form.note_title')" prop="note_title"> <el-form-item :label="$t('note.table.note_title')" prop="note_title">
<el-input v-model="form.note_title" :placeholder="$t('input_please', { keyword: this.$t('read.form.note_title') })"></el-input> <el-input v-model="form.note_title" :placeholder="$t('input_please', { keyword: this.$t('note.table.note_title') })"></el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('read.form.note_content')" prop="note_content"> <el-form-item :label="$t('note.table.note_content')" prop="note_content">
<el-input type="textarea" v-model="form.note_content" :placeholder="$t('input_please', { keyword: this.$t('read.form.note_content') })"></el-input> <el-input type="textarea" v-model="form.note_content" :placeholder="$t('input_please', { keyword: this.$t('note.table.note_content') })"></el-input>
</el-form-item> </el-form-item>
<el-form-item class="center"> <el-form-item class="center">
<el-button @click="findNote">{{$t('button.query')}}</el-button> <el-button @click="findNote">{{$t('button.query')}}</el-button>
@ -22,8 +22,8 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="originalText" :label="$t('note.table.original_text')" /> <el-table-column align="center" prop="originalText" :label="$t('note.table.original_text')" />
<el-table-column align="center" prop="noteTitle" :label="$t('read.form.note_title')" /> <el-table-column align="center" prop="noteTitle" :label="$t('note.table.note_title')" />
<el-table-column align="center" prop="noteContent" :label="$t('read.form.note_content')" /> <el-table-column align="center" prop="noteContent" :label="$t('note.table.note_content')" />
<el-table-column align="center" :label="$t('action')" > <el-table-column align="center" :label="$t('action')" >
<template slot-scope="scope" > <template slot-scope="scope" >
<el-button @click="read(scope.row)">{{$t('button.jump_note')}}</el-button> <el-button @click="read(scope.row)">{{$t('button.jump_note')}}</el-button>
@ -55,12 +55,12 @@
rules:{ rules:{
note_title:[{ note_title:[{
required: true, required: true,
message: this.$t('input_please', { keyword: this.$t('read.form.note_title') }), message: this.$t('input_please', { keyword: this.$t('note.table.note_title') }),
trigger: 'blur' trigger: 'blur'
}], }],
note_content:[{ note_content:[{
required: true, required: true,
message: this.$t('input_please', { keyword: this.$t('read.form.note_content') }), message: this.$t('input_please', { keyword: this.$t('note.table.note_content') }),
trigger: 'blur' trigger: 'blur'
}] }]
}, },

297
pages/index/read.vue
Unescape View File

@ -10,13 +10,13 @@
<el-form-item :label="$t('note.table.original_text')"> <el-form-item :label="$t('note.table.original_text')">
<el-input autosize type="textarea" v-model="note_form.original_text" disabled></el-input> <el-input autosize type="textarea" v-model="note_form.original_text" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('read.form.note_title')" prop="note_title"> <el-form-item :label="$t('note.table.note_title')" prop="note_title">
<el-input v-model="note_form.note_title" <el-input v-model="note_form.note_title"
:placeholder="$t('input_please', { keyword: this.$t('read.form.note_title') })"></el-input> :placeholder="$t('input_please', { keyword: this.$t('note.table.note_title') })"></el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('read.form.note_content')" prop="note_content"> <el-form-item :label="$t('note.table.note_content')" prop="note_content">
<el-input autosize type="textarea" v-model="note_form.note_content" <el-input autosize type="textarea" v-model="note_form.note_content"
:placeholder="$t('input_please', { keyword: this.$t('read.form.note_content') })"></el-input> :placeholder="$t('input_please', { keyword: this.$t('note.table.note_content') })"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button @click="addNote">{{$t('button.add')}}</el-button> <el-button @click="addNote">{{$t('button.add')}}</el-button>
@ -31,7 +31,7 @@
</v-contextmenu-item> </v-contextmenu-item>
</v-contextmenu> </v-contextmenu>
<el-tabs v-model="activeName" type="card" closable @tab-remove="removeTab"> <el-tabs v-model="activeName" type="card" closable @tab-remove="removeTab">
<el-tab-pane :name="key" v-for="(item,key) in openList" :key="key"> <el-tab-pane :name="key" v-for="(item,key) in openList" :key="key">
<span slot="label"> <span slot="label">
{{item.title}} {{item.title}}
<el-tooltip :content="item.hasCollect?$t('read.tip.cancel_collect'):$t('read.tip.collect')"> <el-tooltip :content="item.hasCollect?$t('read.tip.cancel_collect'):$t('read.tip.collect')">
@ -68,36 +68,38 @@
<el-col :span="5" class="note-list ml3"> <el-col :span="5" class="note-list ml3">
<template v-if="noteList.length>0"> <template v-if="noteList.length>0">
<el-row v-for="(item,index) in noteList" :key="index" class="mb2"> <el-row v-for="(item,index) in noteList" :key="index" class="mb2">
<el-card :class="{'active_card':item.isActive}"> <el-card :class="{'active_card':item.isActive}">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<el-row type="flex" justify="space-around"> <el-row type="flex" justify="space-around">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<el-button-group> <el-button-group>
<el-button size="mini" type="primary" @click="edit(item)" icon="el-icon-edit"></el-button> <el-button size="mini" type="primary" @click="edit(item)" icon="el-icon-edit"></el-button>
<el-popconfirm <el-popconfirm
@onConfirm="del(item,index)" @onConfirm="del(item,index)"
:title="$t('read.tip.del_confirm')" :title="$t('read.tip.del_confirm')"
> >
<el-button size="mini" type="danger" slot="reference" icon="el-icon-delete"></el-button> <el-button size="mini" type="danger" slot="reference" icon="el-icon-delete"></el-button>
</el-popconfirm> </el-popconfirm>
</el-button-group> <el-button size="mini" type="success" @click="download(item)"
</el-row> icon="el-icon-download"></el-button>
</div> </el-button-group>
<div class="text item" @click="jump(item)" @mouseover="highlighting(item)" </el-row>
@mouseout="reset(item)"> </div>
<transition v-if="item.isEdit" @after-leave="save(item)"> <div class="text item" @click="jump(item)" @mouseover="highlighting(item)"
<el-tooltip class="item" effect="dark" :content="$t('read.tip.auto_save')" @mouseout="reset(item)">
v-model="item.isEdit"> <transition v-if="item.isEdit" @after-leave="save(item)">
<el-input autosize type="textarea" v-model="item.content"></el-input> <el-tooltip class="item" effect="dark" :content="$t('read.tip.auto_save')"
</el-tooltip> v-model="item.isEdit">
</transition> <el-input autosize type="textarea" v-model="item.content"></el-input>
<template v-else> </el-tooltip>
<el-tooltip :content="$t('read.tip.click_note_list')" :disabled="item.isEdit"> </transition>
<pre style="background-color: white">{{item.content}}</pre> <template v-else>
</el-tooltip> <el-tooltip :content="$t('read.tip.click_note_list')" :disabled="item.isEdit">
</template> <pre style="background-color: white">{{item.content}}</pre>
</div> </el-tooltip>
</el-card> </template>
</div>
</el-card>
<el-alert v-if="item.message" <el-alert v-if="item.message"
@close="item.message=null;item.type=null" @close="item.message=null;item.type=null"
:title="item.message" :title="item.message"
@ -165,12 +167,12 @@
rules: { rules: {
note_title: [{ note_title: [{
required: true, required: true,
message: this.$t('input_please', { keyword: this.$t('read.form.note_title') }), message: this.$t('input_please', { keyword: this.$t('note.table.note_title') }),
trigger: 'blur' trigger: 'blur'
}], }],
note_content: [{ note_content: [{
required: true, required: true,
message: this.$t('input_please', { keyword: this.$t('read.form.note_content') }), message: this.$t('input_please', { keyword: this.$t('note.table.note_content') }),
trigger: 'blur' trigger: 'blur'
}] }]
}, },
@ -232,31 +234,53 @@
}, },
methods: { methods: {
//导出笔记
download(item) {
console.info(item)
let ele = document.createElement('a')
//设置下载文件名
ele.download = `${this.$t('note.table.note_title')}.txt`
//隐藏元素
ele.style.display = 'none'
//字符内容转变成blob地址
let blob = new Blob([`${this.$t('note.table.note_title')}：${item.title}
${this.$t('note.table.paper_name')}：《${this.activeContent.title}》
${this.$t('note.table.original_text')}：${item.originalText}
${this.$t('note.table.note_content')}：${item.content}`])
//如果是链接，这里也可以直接设置链接地址
ele.href = URL.createObjectURL(blob)
document.body.appendChild(ele)
//模拟点击
ele.click()
//移除元素
document.body.removeChild(ele)
},
//收藏 //收藏
star(e,item){ star(e, item) {
e.stopPropagation() e.stopPropagation()
let that=this let that = this
this.GLOBAL.fetchJSON(`/v1/api/collect/${item.id}`,'POST',{},function(res) { this.GLOBAL.fetchJSON(`/v1/api/collect/${item.id}`, 'POST', {}, function(res) {
if(res.code==='200'){ if (res.code === '200') {
that.$store.commit('read/updateCollect',item.title) that.$store.commit('read/updateCollect', item.title)
that.$message.info(that.$t(res.msg)) that.$message.info(that.$t(res.msg))
}else{ } else {
that.$message.error(that.$t(res.msg)) that.$message.error(that.$t(res.msg))
} }
}) })
}, },
//查找评价记录 //查找评价记录
queryRating(){ queryRating() {
let that=this let that = this
this.GLOBAL.fetchGet('/v1/api/paper/findRating', { paperId:this.activeContent.id },function(res) { this.GLOBAL.fetchGet('/v1/api/paper/findRating', { paperId: this.activeContent.id }, function(res) {
if(res.code==='200'){ if (res.code === '200') {
if(res.data===null){ if (res.data === null) {
that.stars=[{ value: 0 }, { value: 0 }, { value: 0 }] that.stars = [{ value: 0 }, { value: 0 }, { value: 0 }]
}else{ } else {
that.stars=[{ value: res.data.score1 }, { value: res.data.score2 }, { value: res.data.score3 }] that.stars = [{ value: res.data.score1 }, { value: res.data.score2 }, { value: res.data.score3 }]
} }
that.show_star_button=res.data===null that.show_star_button = res.data === null
}else{ } else {
that.$message.error(that.$t('error_500').toString()) that.$message.error(that.$t('error_500').toString())
} }
}) })
@ -387,25 +411,25 @@
}, },
//保存笔记 //保存笔记
save(item: any) { save(item: any) {
let that=this let that = this
this.GLOBAL.fetchJSON('/v1/api/notes/update','PUT',{ this.GLOBAL.fetchJSON('/v1/api/notes/update', 'PUT', {
noteId:item.id, noteId: item.id,
noteContent:item.content noteContent: item.content
},function(res) { }, function(res) {
if(res.code==='200'){ if (res.code === '200') {
that.$set(item, 'type', 'success') that.$set(item, 'type', 'success')
that.$set(item, 'message', that.$t('read.tip.update_note_ok')) that.$set(item, 'message', that.$t('read.tip.update_note_ok'))
}else { } else {
that.$set(item, 'type', 'error') that.$set(item, 'type', 'error')
that.$set(item, 'message', that.$t('read.tip.update_note_fail')) that.$set(item, 'message', that.$t('read.tip.update_note_fail'))
} }
}) })
}, },
//删除笔记 //删除笔记
del(item: any, index: number) { del(item: any, index: number) {
let that=this let that = this
let span=document.getElementById(item.id) let span = document.getElementById(item.id)
if(span) { if (span) {
let text = document.createTextNode(span.innerText) let text = document.createTextNode(span.innerText)
span.replaceWith(text) span.replaceWith(text)
that.pre.normalize() that.pre.normalize()
@ -416,12 +440,12 @@
}, function(res) { }, function(res) {
if (res.code === '200') { if (res.code === '200') {
that.noteList.splice(index, 1) that.noteList.splice(index, 1)
that.$store.commit('read/updateContent',that.pre.innerHTML) that.$store.commit('read/updateContent', that.pre.innerHTML)
} else { } else {
that.$message.error(that.$t('error_500').toString()) that.$message.error(that.$t('error_500').toString())
} }
}) })
}else{ } else {
that.$message.error(that.$t('error_500').toString()) that.$message.error(that.$t('error_500').toString())
} }
@ -429,17 +453,17 @@
//提交评分 //提交评分
submitRating() { submitRating() {
console.info(this.stars) console.info(this.stars)
let that=this let that = this
this.GLOBAL.fetchJSON('/v1/api/paper/rating','POST',{ this.GLOBAL.fetchJSON('/v1/api/paper/rating', 'POST', {
paperId:this.activeContent.id, paperId: this.activeContent.id,
score1:this.stars[0].value, score1: this.stars[0].value,
score2:this.stars[1].value, score2: this.stars[1].value,
score3:this.stars[2].value, score3: this.stars[2].value
},function(res) { }, function(res) {
if(res.code==='200'){ if (res.code === '200') {
that.queryRating() that.queryRating()
that.$message.info(that.$t('read.tip.rating_ok').toString()) that.$message.info(that.$t('read.tip.rating_ok').toString())
}else{ } else {
that.$message.error(that.$t('error_500').toString()) that.$message.error(that.$t('error_500').toString())
} }
}) })
@ -459,12 +483,12 @@
}, },
//跳转到笔记位置 //跳转到笔记位置
jump(item: any) { jump(item: any) {
this.noteList.forEach(i=>{ this.noteList.forEach(i => {
if(i.id!==item.id){ if (i.id !== item.id) {
this.$set(i,'isActive',false) this.$set(i, 'isActive', false)
} }
}) })
this.$set(item,'isActive',true) this.$set(item, 'isActive', true)
let ele = document.getElementById(item.id) let ele = document.getElementById(item.id)
if (ele) { if (ele) {
ele.scrollIntoView({ ele.scrollIntoView({
@ -512,33 +536,33 @@
that.replace.replaceVal[index - 1].after(that.replace.replaceVal[index]) that.replace.replaceVal[index - 1].after(that.replace.replaceVal[index])
} }
that.GLOBAL.fetchJSON('/v1/api/notes/add','POST',{ that.GLOBAL.fetchJSON('/v1/api/notes/add', 'POST', {
noteId: this.note_form.note_id, noteId: this.note_form.note_id,
noteTitle: this.note_form.note_title, noteTitle: this.note_form.note_title,
noteContent: this.note_form.note_content, noteContent: this.note_form.note_content,
paperId: that.activeContent.id, paperId: that.activeContent.id,
fileId: that.activeContent.fileId, fileId: that.activeContent.fileId,
originalText:that.note_form.original_text, originalText: that.note_form.original_text,
content: that.pre.innerHTML content: that.pre.innerHTML
},function(res) { }, function(res) {
if(res.code==='200'){ if (res.code === '200') {
that.$message.info({ that.$message.info({
message: that.$t('read.tip.add_tip_ok').toString(), message: that.$t('read.tip.add_tip_ok').toString(),
showClose: true, showClose: true,
duration: 1000, duration: 1000,
onClose:function() { onClose: function() {
that.$store.commit('read/updateContent',that.pre.innerHTML) that.$store.commit('read/updateContent', that.pre.innerHTML)
that.noteList.unshift({ that.noteList.unshift({
id: that.note_form.note_id, id: that.note_form.note_id,
title: that.note_form.note_title, title: that.note_form.note_title,
content: that.note_form.note_content content: that.note_form.note_content
}) })
that.resetNote() that.resetNote()
} }
}) })
}else{ } else {
that.$message.error(that.$t('error_500').toString()) that.$message.error(that.$t('error_500').toString())
} }
}) })
} else { } else {
that.$message.error(that.$t('read.tip.add_tip_fail').toString()) that.$message.error(that.$t('read.tip.add_tip_fail').toString())
@ -590,42 +614,43 @@
} }
}, },
//查找笔记 //查找笔记
findNote(){ findNote() {
let that=this let that = this
this.GLOBAL.fetchGet(`/v1/api/notes/list/${this.activeContent.id}`,{},function(res) { this.GLOBAL.fetchGet(`/v1/api/notes/list/${this.activeContent.id}`, {}, function(res) {
if(res.code==='200'){ if (res.code === '200') {
that.noteList=[] that.noteList = []
res.data.data.forEach(item=>{ res.data.data.forEach(item => {
let obj={ let obj = {
id: item.noteId, id: item.noteId,
title: item.noteTitle, title: item.noteTitle,
content: item.noteContent, content: item.noteContent,
isActive:item.noteId===that.$route.query.noteId isActive: item.noteId === that.$route.query.noteId,
} originalText: item.originalText
that.noteList.push(obj) }
if(item.noteId===that.$route.query.noteId){ that.noteList.push(obj)
that.jump(obj) if (item.noteId === that.$route.query.noteId) {
that.$nextTick(() => { that.jump(obj)
let ele = document.querySelector('div[class$=active_card]') that.$nextTick(() => {
if (ele) { let ele = document.querySelector('div[class$=active_card]')
ele.scrollIntoView({ if (ele) {
block: 'center' ele.scrollIntoView({
}) block: 'center'
} })
}) }
} })
}) }
}else{ })
that.$message.error(that.$t('error_500').toString()) } else {
} that.$message.error(that.$t('error_500').toString())
}
}) })
} }
}, },
mounted() { mounted() {
let that = this let that = this
this.$nextTick(() => { this.$nextTick(() => {
if(this.activeContent) { if (this.activeContent) {
that.queryRating() that.queryRating()
that.findNote() that.findNote()
} }
@ -643,7 +668,7 @@
} else if ('ESCAPE' === event.key.toUpperCase()) { } else if ('ESCAPE' === event.key.toUpperCase()) {
that.showSearch = false that.showSearch = false
} }
if(that.activeContent) { if (that.activeContent) {
that.updateFind(that.showSearch) that.updateFind(that.showSearch)
} }
}, true) }, true)
@ -657,7 +682,7 @@
font-size: larger; font-size: larger;
} }
.active_card{ .active_card {
border: 1px solid black; border: 1px solid black;
} }

Write Preview
Loading…
Cancel
Save