48 lines
1.0 KiB
Vue
48 lines
1.0 KiB
Vue
|
<template>
|
||
|
<div>
|
||
|
|
||
|
|
||
|
<h2 v-if="page" v-html="page.name"></h2>
|
||
|
|
||
|
<div v-if="page" v-html="page.content"></div>
|
||
|
<b-button :to="editTarget" variant="outline"><i class="fa fa-2x fa-fw fa-edit"></i></b-button>
|
||
|
<hr>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import axios from 'axios';
|
||
|
|
||
|
export default {
|
||
|
name: "Pages",
|
||
|
data: () => ({
|
||
|
page: null
|
||
|
}),
|
||
|
watch: {
|
||
|
$route() {
|
||
|
console.log("watch called")
|
||
|
this.getPagesDetails()
|
||
|
}
|
||
|
},
|
||
|
beforeMount() {
|
||
|
this.getPagesDetails()
|
||
|
},
|
||
|
methods: {
|
||
|
getPagesDetails() {
|
||
|
const slug = this.$route.params.slug
|
||
|
console.log("slug: " + slug)
|
||
|
|
||
|
axios
|
||
|
.get('/api/pages?slug=' + slug)
|
||
|
.then(response => (this.page = response.data['hydra:member'][0]))
|
||
|
}
|
||
|
},
|
||
|
computed: {
|
||
|
editTarget() {
|
||
|
if (this.page) {
|
||
|
return "/pages/edit/" + this.page.slug
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|