84 lines
1.8 KiB
Vue
84 lines
1.8 KiB
Vue
<template>
|
|
<div v-if="user.authenticated">
|
|
<h1>{{ author.Forename }} {{ author.Lastname }}</h1>
|
|
|
|
<div class="ui info message" v-if="loading">
|
|
<icon name="refresh" spin></icon>
|
|
Loading...
|
|
</div>
|
|
|
|
<div class="ui negative message" v-if="error">
|
|
<div class="header">
|
|
An error occured.
|
|
</div>
|
|
{{ error.message }}
|
|
<p v-if="error.response.data">
|
|
{{ error.response.data.Message }}
|
|
</p>
|
|
</div>
|
|
|
|
<div v-if="!loading && !error">
|
|
|
|
<router-link :to="{ name: 'author-edit', params: { id: authorID} }" class="ui teal labeled icon button" style="float: right;">
|
|
<i class="edit icon"></i>
|
|
Edit
|
|
</router-link>
|
|
|
|
<div class="ui list">
|
|
<div class="item">
|
|
<div class="header">
|
|
Forename
|
|
</div>
|
|
{{ author.Forename }}
|
|
</div>
|
|
<div class="item">
|
|
<div class="header">
|
|
Lastname
|
|
</div>
|
|
{{ author.Lastname }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import auth from '../auth'
|
|
import {HTTP} from '../http-common'
|
|
|
|
export default {
|
|
name: 'Author',
|
|
data () {
|
|
return {
|
|
user: auth.user,
|
|
author: {},
|
|
error: '',
|
|
success: '',
|
|
authorID: this.$route.params.id
|
|
}
|
|
},
|
|
created () {
|
|
this.loadAuthor()
|
|
},
|
|
watch: {
|
|
// call again the method if the route changes
|
|
'$route': 'loadAuthor'
|
|
},
|
|
methods: {
|
|
loadAuthor () {
|
|
this.loading = true
|
|
this.author = {}
|
|
HTTP.get(`authors/` + this.authorID)
|
|
.then(response => {
|
|
this.author = response.data
|
|
this.loading = false
|
|
})
|
|
.catch(e => {
|
|
this.loading = false
|
|
this.error = e
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|