83 lines
1.7 KiB
Vue
83 lines
1.7 KiB
Vue
|
<template>
|
||
|
|
<div class="ui basic segment no-fluf-segment">
|
||
|
|
<div class="ui grid">
|
||
|
|
|
||
|
|
<div class="ui sixteen wide column">
|
||
|
|
<h2 class="ui header">
|
||
|
|
<i class="folder icon"></i>
|
||
|
|
<div class="content">
|
||
|
|
Attachments
|
||
|
|
<div class="sub header">Files and scraped web pages from notes</div>
|
||
|
|
</div>
|
||
|
|
</h2>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="ui segment" v-if="searchParams.noteId">
|
||
|
|
Showing Attachments for note. <div class="ui button" v-on:click="clearNote">Clear</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="ui basic segment">
|
||
|
|
<attachment-display
|
||
|
|
v-for="item in attachments"
|
||
|
|
:item="item"
|
||
|
|
:key="item.id"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
|
||
|
|
import axios from 'axios'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
'attachment-display': require('@/components/AttachmentDisplayCard').default,
|
||
|
|
},
|
||
|
|
data: function(){
|
||
|
|
return {
|
||
|
|
attachments: [],
|
||
|
|
searchParams: {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
beforeCreate: function(){
|
||
|
|
//
|
||
|
|
// Perform Login check
|
||
|
|
//
|
||
|
|
this.$parent.loginGateway()
|
||
|
|
},
|
||
|
|
mounted: function(){
|
||
|
|
|
||
|
|
//Mount notes on load if note ID is set
|
||
|
|
if(this.$route.params && this.$route.params.id){
|
||
|
|
const inputNoteId = this.$route.params.id
|
||
|
|
this.searchParams['noteId'] = inputNoteId
|
||
|
|
}
|
||
|
|
|
||
|
|
this.searchAttachments()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
clearNote(){
|
||
|
|
this.$router.push('/attachments/')
|
||
|
|
delete this.searchParams.noteId
|
||
|
|
this.searchAttachments()
|
||
|
|
},
|
||
|
|
searchAttachments (){
|
||
|
|
|
||
|
|
axios.post('/api/attachment/search', this.searchParams)
|
||
|
|
.then( results => {
|
||
|
|
this.attachments = results.data
|
||
|
|
})
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style type="text/css" scoped>
|
||
|
|
.attachment-display-area {
|
||
|
|
width: 100%;
|
||
|
|
margin-top: 15px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 0 5%;
|
||
|
|
}
|
||
|
|
</style>
|