113 lines
2.5 KiB
Vue
113 lines
2.5 KiB
Vue
<style type="text/css" scoped>
|
|
|
|
</style>
|
|
|
|
<template>
|
|
<div>
|
|
|
|
<div class="ui grid" v-if="this.shareUsername == null">
|
|
|
|
<div class="row">
|
|
<div class="eight wide column">
|
|
<div class="ui form">
|
|
<div class="field">
|
|
<input type="text" placeholder="Share with someone" v-model="shareUserInput" v-on:keyup="onKeyup">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="eight wide column">
|
|
<div class="ui disabled button" v-if="shareUserInput.length == 0">
|
|
Share
|
|
</div>
|
|
<div class="ui green button" v-if="shareUserInput.length > 0" v-on:click="onSubmitClick">
|
|
Share
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="sixteen wide column" v-if="sharedWithUsers.length > 0">
|
|
<h3>Users who can edit this note</h3>
|
|
</div>
|
|
<div class="row" v-for="item in sharedWithUsers">
|
|
<div class="eight wide middle aligned column">
|
|
<h3><i class="green user circle icon"></i>{{item.username}}</h3>
|
|
</div>
|
|
<div class="eight wide column">
|
|
<div class="ui basic compact button" v-on:click="onRevokeAccess(item.noteId)">Remove Access</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="ui grid" v-if="this.shareUsername != null">
|
|
<div class="sixteen wide column">
|
|
Shared with you by <h3><i class="green user circle icon"></i>{{shareUsername}}</h3>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import axios from 'axios'
|
|
|
|
export default {
|
|
name: 'ShareNoteComponent',
|
|
props: [ 'noteId', 'rawTextId', 'shareUsername' ],
|
|
data () {
|
|
return {
|
|
sharedWithUsers: [],
|
|
shareUserInput: '',
|
|
debounce: null,
|
|
enableSubmitShare: false,
|
|
}
|
|
},
|
|
beforeMount(){
|
|
|
|
},
|
|
mounted(){
|
|
|
|
if(this.shareUsername == null){
|
|
this.loadShareList()
|
|
}
|
|
|
|
},
|
|
methods: {
|
|
loadShareList(){
|
|
axios.post('/api/note/getshareusers', {'rawTextId':this.rawTextId })
|
|
.then( ({data}) => {
|
|
this.sharedWithUsers = data
|
|
})
|
|
},
|
|
onRevokeAccess(noteId){
|
|
axios.post('/api/note/shareremoveuser', {'noteId':noteId})
|
|
.then( ({data}) => {
|
|
console.log(data)
|
|
if(data == true){
|
|
this.loadShareList()
|
|
}
|
|
})
|
|
},
|
|
onKeyup(event){
|
|
if(event.keyCode == 13){
|
|
this.onSubmitClick()
|
|
return
|
|
}
|
|
},
|
|
onSubmitClick(){
|
|
|
|
axios.post('/api/note/shareadduser', {'noteId':this.noteId, 'rawTextId':this.rawTextId, 'username':this.shareUserInput })
|
|
.then( ({data}) => {
|
|
if(data == true){
|
|
this.shareUserInput = ''
|
|
this.loadShareList()
|
|
} else {
|
|
this.$bus.$emit('notification', 'User not found')
|
|
}
|
|
})
|
|
|
|
},
|
|
}
|
|
}
|
|
</script>
|