added vue-meta plugin, fixed article prev next, fixed page title on articles

This commit is contained in:
2020-12-24 19:05:45 +01:00
parent 78155f83b8
commit c1f117d7bb
7 changed files with 114 additions and 51 deletions

View File

@ -7,18 +7,18 @@
<ul>
<li>
<a
@click.prevent="onPrev"
href="#"
v-if="prevnext.prev"
:href="prevnext.prev.view_node"
v-html="prevnext.prev.title"
@click.prevent="onPrevNext(prevnext.prev.view_node)"
/>
</li>
<li>
<a
@click.prevent="onNext"
href="#"
v-if="prevnext.next"
:href="prevnext.next.view_node"
v-html="prevnext.next.title"
@click.prevent="onPrevNext(prevnext.next.view_node)"
/>
</li>
</ul>
@ -95,18 +95,18 @@
<ul>
<li>
<a
@click.prevent="onPrev"
href="#"
v-if="prevnext.prev"
:href="prevnext.prev.view_node"
v-html="prevnext.prev.title"
@click.prevent="onPrevNext(prevnext.prev.view_node)"
/>
</li>
<li>
<a
@click.prevent="onNext"
href="#"
v-if="prevnext.next"
:href="prevnext.next.view_node"
v-html="prevnext.next.title"
@click.prevent="onPrevNext(prevnext.next.view_node)"
/>
</li>
</ul>
@ -142,13 +142,18 @@ export default {
prevnext:{},
nid:null,
path: null,
article:null,
article:{},
image_accroche: null,
lightbox_items: null,
loading:true,
lightbox_index:null,
}
},
metaInfo () {
return {
title: this.article.title
}
},
computed: {
...mapState({
items: state => state.Blabla.items
@ -187,17 +192,6 @@ export default {
if(this.path){
this.loadArticle()
// get the prev next items
if(!this.items.length){
// if items list not yet loaded preload them
this.getItems().then(() => {
// then get the index
this.getIndex()
})
}else{
// or directly get the index
this.getIndex()
}
}else{
// if for any reason we dont have the uuid
// redirect to home
@ -205,10 +199,10 @@ export default {
}
},
getIndex(){
console.log("Article getIndex");
this.getItemIndex(this.nid).then((index) => {
console.log("Article getIndex article.id:", this.article.id);
this.getItemIndex(this.article.id).then((index) => {
this.index = index
// console.log('article index', index, this);
console.log('article index', index, this);
this.getPrevNextItems(index).then((pn) => {
this.prevnext = pn
})
@ -218,13 +212,6 @@ export default {
console.log('loadArticle')
this.loading = true
// let ast = gql`{
// article(id: ${this.nid}) {
// ...ArticleFields
// }
// }
// ${ articleFields }
// `
let ast = gql`{
route(path: "${this.path}") {
...ArticleFields
@ -232,7 +219,6 @@ export default {
}
${ articleFields }
`
MGQ.post('', { query: print(ast)
})
.then(({ data:{data:{route}}}) => {
@ -248,6 +234,18 @@ export default {
console.log('parseDataGQL article', article)
this.article = article
// get the prev next items
if(!this.items.length){
// if items list not yet loaded preload them
this.getItems().then(() => {
// then get the index
this.getIndex()
})
}else{
// or directly get the index
this.getIndex()
}
this.image_accroche = article.images[0]
this.lightbox_items = [];
@ -296,24 +294,34 @@ export default {
this.loading = false;
},
onNext(){
onPrevNext(a){
// console.log('clicked on next', this.prevnext.next);
let alias = this.prevnext.next.view_node.replace(/^.?\/blabla\//g, '')
// let alias = this.prevnext.next.view_node.replace(/^.?\/blabla\//g, '')
let alias = a.replace(/^.?\/blabla\//g, '')
this.$router.push({
name:`article`,
params: { alias:alias },
query: { uuid: this.prevnext.next.uuid }
})
},
onPrev(){
// console.log('clicked on prev', this.prevnext.next);
let alias = this.prevnext.prev.view_node.replace(/^.?\/blabla\//g, '')
this.$router.push({
name:`article`,
params: { alias:alias },
query: { uuid: this.prevnext.prev.uuid }
params: { alias:alias }
// query: { uuid: this.prevnext.next.uuid }
})
},
// onNext(){
// // console.log('clicked on next', this.prevnext.next);
// let alias = this.prevnext.next.view_node.replace(/^.?\/blabla\//g, '')
// this.$router.push({
// name:`article`,
// params: { alias:alias }
// // query: { uuid: this.prevnext.next.uuid }
// })
// },
// onPrev(){
// // console.log('clicked on prev', this.prevnext.next);
// let alias = this.prevnext.prev.view_node.replace(/^.?\/blabla\//g, '')
// this.$router.push({
// name:`article`,
// params: { alias:alias }
// // query: { uuid: this.prevnext.prev.uuid }
// })
// },
setLightboxIndex(index) {
this.lightbox_index = index
}