126 lines
3.5 KiB
Vue
126 lines
3.5 KiB
Vue
<template>
|
|
<div v-if="user.authenticated">
|
|
<h1>{{ author.forename }} {{ author.lastname }}</h1>
|
|
|
|
<div class="fullscreen-loader-wrapper" v-if="loading">
|
|
<div class="half-circle-spinner">
|
|
<div class="circle circle-1"></div>
|
|
<div class="circle circle-2"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="!loading">
|
|
|
|
<router-link :to="{ name: 'author-edit', params: { id: authorID} }" class="ui teal labeled icon button" style="float: right;">
|
|
<i class="edit icon"></i>
|
|
<span v-lang.general.edit></span>
|
|
</router-link>
|
|
|
|
<list :infos="authorList"/>
|
|
|
|
<p class="grey">
|
|
<span v-lang.general.created="this.createdTime"></span><br/>
|
|
<span v-if="this.author.created !== this.author.updated" v-lang.general.lastEdit="this.editedTime"></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import auth from '../auth'
|
|
import {HTTP} from '../http-common'
|
|
|
|
export default {
|
|
name: 'Author',
|
|
data () {
|
|
return {
|
|
user: auth.user,
|
|
author: {},
|
|
authorID: this.$route.params.id,
|
|
authorList: [],
|
|
createdTime: {
|
|
date: '',
|
|
time: ''
|
|
},
|
|
editedTime: {
|
|
date: '',
|
|
time: ''
|
|
}
|
|
}
|
|
},
|
|
created () {
|
|
this.loadAuthor()
|
|
|
|
// Set the title
|
|
document.title = this.translate('nav').authors
|
|
},
|
|
watch: {
|
|
// call again the method if the route changes
|
|
'$route': 'loadAuthor'
|
|
},
|
|
computed: {
|
|
langGeneral () {
|
|
return this.translate('general')
|
|
}
|
|
},
|
|
methods: {
|
|
loadAuthor () {
|
|
this.loading = true
|
|
this.author = {}
|
|
HTTP.get(`authors/` + this.authorID)
|
|
.then(response => {
|
|
this.author = response.data
|
|
|
|
// Make a list
|
|
this.authorList = [
|
|
{
|
|
header: this.translate('authors').forename,
|
|
content: this.author.forename
|
|
},
|
|
{
|
|
header: this.translate('authors').lastname,
|
|
content: this.author.lastname
|
|
}
|
|
]
|
|
|
|
// Beautify the date
|
|
let c = new Date(this.author.created * 1000)
|
|
// c.setSeconds()
|
|
this.createdTime = {
|
|
date: ('0' + c.getDate()).slice(-2) + '.' + ('0' + (c.getMonth() + 1)).slice(-2) + '.' + c.getFullYear(),
|
|
time: ('0' + c.getHours()).slice(-2) + ':' + ('0' + c.getMinutes()).slice(-2)
|
|
}
|
|
|
|
let e = new Date(this.author.updated * 1000)
|
|
// e.setSeconds()
|
|
this.editedTime = {
|
|
date: ('0' + e.getDate()).slice(-2) + '.' + ('0' + (e.getMonth() + 1)).slice(-2) + '.' + e.getFullYear(),
|
|
time: ('0' + e.getHours()).slice(-2) + ':' + ('0' + e.getMinutes()).slice(-2)
|
|
}
|
|
|
|
// Set the title
|
|
document.title = this.author.forename + ' ' + this.author.lastname + ' | ' + this.translate('nav').authors
|
|
|
|
this.loading = false
|
|
})
|
|
.catch(e => {
|
|
this.loading = false
|
|
// Build the notification text from error response
|
|
console.log(e)
|
|
let err = e.message
|
|
if (e.response.data.message) {
|
|
err += '<br/>' + e.response.data.message
|
|
}
|
|
|
|
// Fire a notification
|
|
this.$notify({
|
|
type: 'error',
|
|
title: this.langGeneral.error,
|
|
text: err
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|