added vue-meta plugin, fixed article prev next, fixed page title on articles
This commit is contained in:
parent
78155f83b8
commit
c1f117d7bb
|
|
@ -190,6 +190,7 @@ module:
|
|||
filefield_sources: 1
|
||||
menu_admin_per_menu: 1
|
||||
menu_link_content: 1
|
||||
pathauto: 1
|
||||
content_translation: 10
|
||||
views: 10
|
||||
materio_id: 11
|
||||
|
|
|
|||
|
|
@ -5348,7 +5348,8 @@
|
|||
"deepmerge": {
|
||||
"version": "4.2.2",
|
||||
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
|
||||
"integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
|
||||
"integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
|
||||
"dev": true
|
||||
},
|
||||
"define-properties": {
|
||||
"version": "1.1.3",
|
||||
|
|
@ -11807,6 +11808,7 @@
|
|||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/vue-meta/-/vue-meta-2.4.0.tgz",
|
||||
"integrity": "sha512-XEeZUmlVeODclAjCNpWDnjgw+t3WA6gdzs6ENoIAgwO1J1d5p1tezDhtteLUFwcaQaTtayRrsx7GL6oXp/m2Jw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"deepmerge": "^4.2.2"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,7 +23,6 @@
|
|||
"vue-autofocus-directive": "^1.0.4",
|
||||
"vue-cool-lightbox": "^2.6.9",
|
||||
"vue-infinite-loading": "^2.4.5",
|
||||
"vue-meta": "^2.4.0",
|
||||
"vue-router": "^3.4.9",
|
||||
"vue-vimeo-player": "^0.1.0",
|
||||
"vue-youtube-embed": "^2.2.2",
|
||||
|
|
@ -68,6 +67,7 @@
|
|||
"vue-jest": "^3.0.7",
|
||||
"vue-js-modal": "^2.0.0-rc.6",
|
||||
"vue-loader": "^15.9.5",
|
||||
"vue-meta": "^2.4.0",
|
||||
"vue-server-renderer": "^2.6.12",
|
||||
"vue-style-loader": "^4.1.2",
|
||||
"vue-template-compiler": "^2.6.12",
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -31,6 +31,9 @@ import router from 'vuejs/route'
|
|||
// import * as Locales from 'assets/i18n/locales.json'
|
||||
import { i18n, loadLanguageAsync } from 'vuejs/i18n'
|
||||
|
||||
import VueMeta from 'vue-meta'
|
||||
Vue.use(VueMeta)
|
||||
|
||||
import VUserBlock from 'vuejs/components/Block/UserBlock'
|
||||
import VMainContent from 'vuejs/components/Content/MainContent'
|
||||
import VSearchBlock from 'vuejs/components/Block/SearchBlock'
|
||||
|
|
@ -273,6 +276,12 @@ import 'theme/assets/styles/main.scss'
|
|||
_v_main_content = new Vue({
|
||||
store,
|
||||
i18n,
|
||||
metaInfo: {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
title: "materiO'",
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | materiO'"
|
||||
},
|
||||
render: h => h(VMainContent, { props: { id: id, html: main_html, isfront: drupalSettings.path.isFront } })
|
||||
}).$mount('#' + id)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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
|
||||
}
|
||||
|
|
|
|||
|
|
@ -68,11 +68,14 @@ export default {
|
|||
dispatch('getItems')
|
||||
},
|
||||
getItemIndex ({ dispatch, commit, state }, nid) {
|
||||
console.log('getItemIndex nid', nid)
|
||||
return state.items.findIndex((e) => {
|
||||
return e.nid == nid
|
||||
// console.log('findIndex', e, nid);
|
||||
return e.nid === nid
|
||||
})
|
||||
},
|
||||
getPrevNextItems ({ dispatch, commit, state }, index) {
|
||||
// TODO: preload prev and next items
|
||||
return {
|
||||
prev: state.items[index - 1],
|
||||
next: state.items[index + 1]
|
||||
|
|
|
|||
Loading…
Reference in New Issue