bachir/gdp_vuewp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

centralized tocs and paginations loading in Corpus Store @ app init

Browse Source
This commit is contained in:
bachir
2020-07-22 19:11:53 +02:00
parent d127864327
commit 7b2a801b47
4 changed files with 134 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/nav/HeaderMenu.vue
+9 -2
View File
@@ -1,6 +1,6 @@
<template>
<nav id="header-menu">
<ul>
<ul v-if="corpusLoaded">
<li><router-link to="/corpus">Corpus</router-link></li>
<li>
<span>Indexs</span>
@@ -23,11 +23,18 @@
<script>
import { mapState } from 'vuex'
export default {
name: 'HeaderMenu',
data: () => ({
})
}),
computed: {
...mapState({
corpusLoaded: state => state.Corpus.corpusLoaded
})
}
}
</script>
src/components/nav/Search.vue
+3 -2
View File
@@ -1,6 +1,6 @@
<template>
<div id="search" class="col-11">
<form class="search-form row">
<form v-if="corpusLoaded" class="search-form row">
<fieldset class="search">
<div>
<label for="keys">Search</label>
@@ -100,7 +100,8 @@ export default {
searchTypeOptions: state => state.Search.searchTypeOptions,
searchTypeValue: state => state.Search.searchTypeValue,
filters: state => state.Search.filters,
activeFilters: state => state.Search.activeFilters
activeFilters: state => state.Search.activeFilters,
corpusLoaded: state => state.Corpus.corpusLoaded
}),
personsOptions () {
return this.filters.persons.filter(option => !this.activeFilters.persons.includes(option))
src/pages/Edition.vue
+46 -83
View File
@@ -78,8 +78,11 @@
<script>
import qs from 'querystring'
import { REST } from 'api/rest-axios'
import { mapState, mapActions } from 'vuex'
import MainContentLayout from '../components/Layouts/MainContentLayout'
import EdText from '../components/Content/EdText'
import EdToc from '../components/Content/EdToc'
@@ -100,7 +103,6 @@ export default {
EdPagination
},
data: () => ({
toc: null,
meta: null,
editionid: null,
textid: null,
@@ -119,6 +121,8 @@ export default {
inifinite_load_distance: 10,
reftoscrollto: null,
//
toc: null,
//
pagination: null
}),
computed: {
@@ -162,103 +166,62 @@ export default {
this.scrollToPage(newp)
}
},
beforeCreate () {
console.log('texts this.$route', this.$route)
// http://localhost:8984/texts/gdpSauval1724/toc
// get the edition's toc
REST.get(`${window.apipath}/texts/` + this.$route.params.id + `/toc`, {})
.then(({ data }) => {
console.log('texts/toc REST: data', data)
this.meta = data.meta
this.author = data.meta.author
if (data.content && data.content !== 'vide') {
if (Array.isArray(data.content)) {
this.toc = data.content
} else {
this.toc = [data.content]
}
// if front page get the first item in toc
if (!this.$route.params.textid) {
// console.log('toc', this.toc)
this.textid = this.toc[0].children[1].uuid
}
} else {
console.warn('Bad edition uuid', this.$route.params.id, this.$route)
// this.$router.replace({
// name: 'notfound',
// query: { fullpath: this.$route.path }
// })
}
})
.catch((error) => {
console.warn('Issue with text toc', error)
Promise.reject(error)
})
// get the edition's pagination
REST.get(`${window.apipath}/texts/` + this.$route.params.id + `/pagination`, {})
.then(({ data }) => {
console.log('texts/pagination REST: data', data)
if (data.content && data.content !== 'vide') {
this.pagination = data.content
} else {
console.warn('Bad edition uuid', this.$route.params.id, this.$route)
// this.$router.replace({
// name: 'notfound',
// query: { fullpath: this.$route.path }
// })
}
})
.catch((error) => {
console.warn('Issue with text toc', error)
Promise.reject(error)
})
},
created () {
// console.log('Edition this.$route.params.id', this.$route.params.id)
this.editionid = this.$route.params.id
// load editions list from Corpus Store if not exist
if (!this.editionslist.length) {
// this.getCorpuses()
// subsribe to store to get the editionbyuuid list
// https://dev.to/viniciuskneves/watch-for-vuex-state-changes-2mgj
this.unsubscribe = this.$store.subscribe((mutation, state) => {
// console.log('Edition store subscribe', mutation.type)
if (mutation.type === 'Corpus/setEditionsByUUID') {
console.log('Edition state.Coprus.editionsbyuuid', this.editionid, state.Corpus.editionsbyuuid)
// this.title = 'HoHoHo'
this.title = this.metainfotitle = state.Corpus.editionsbyuuid[this.editionid].title
}
})
} else {
this.title = this.metainfotitle = this.editionsbyuuid[this.editionid].title
}
// get the text if textid available
if (this.$route.params.textid) {
this.textid = this.$route.params.textid
}
// wait for editions list from Corpus Store if not already loaded
if (!this.editionslist.length) {
// this.getCorpuses()
// subsribe to store to get the editionbyuuid list
// https://dev.to/viniciuskneves/watch-for-vuex-state-changes-2mgj
this.edUuuidsUnsubscribe = this.$store.subscribe((mutation, state) => {
// console.log('Edition store subscribe', mutation.type)
if (mutation.type === 'Corpus/setEditionsByUUID') {
// console.log('Edition state.Coprus.editionsbyuuid', this.editionid, state.Corpus.editionsbyuuid)
this.title = this.metainfotitle = state.Corpus.editionsbyuuid[this.editionid].title
}
if (mutation.type === 'Corpus/setTocs') {
// console.log('Edition state.Coprus.editionsbyuuid', this.editionid, state.Corpus.editionsbyuuid)
this.toc = state.Corpus.editionsbyuuid[this.editionid].toc
// if no textid in new route (e.g. edition front)
// but we have toc
// get the first item
// will be replaced by front page of edition
if (!this.textid) { this.textid = this.toc[0].children[1].uuid }
}
if (mutation.type === 'Corpus/setPaginations') {
// console.log('Edition state.Coprus.editionsbyuuid', this.editionid, state.Corpus.editionsbyuuid)
this.pagination = state.Corpus.editionsbyuuid[this.editionid].pagination
}
})
} else {
this.title = this.metainfotitle = this.editionsbyuuid[this.editionid].title
this.toc = this.editionsbyuuid[this.editionid].toc
// if no textid in new route (e.g. edition front)
// but we have toc
// get the first item
// will be replaced by front page of edition
if (!this.textid) { this.textid = this.toc[0].children[1].uuid }
this.pagination = this.editionsbyuuid[this.editionid].pagination
}
},
// beforeRouteUpdate (to, from, next) {
// // called when the route that renders this component has changed,
// // but this component is reused in the new route.
// // For example, for a route with dynamic params `/foo/:id`, when we
// // navigate between `/foo/1` and `/foo/2`, the same `Foo` component instance
// // will be reused, and this hook will be called when that happens.
// // has access to `this` component instance.
// // console.log('beforeRouteUpdate to', to)
// if (to.params.textid) {
// this.textid = to.params.textid
// }
// next()
// },
methods: {
...mapActions({
getCorpuses: 'Corpus/getCorpuses'
}),
getTextContent (textid, $state = null, direction = 'next') {
console.log('getTextContent', textid)
REST.get(`${window.apipath}/items/${textid}`, {})
let params = {
depth: 0
}
let q = qs.stringify(params)
REST.get(`${window.apipath}/items/${textid}?${q}`, {})
.then(({ data }) => {
console.log('text REST: data', data)
if (direction === 'next') {
src/store/modules/corpus.js
+76 -1
View File
@@ -8,7 +8,9 @@ export default {
// items: [],
authors: [],
editionslist: [],
editionsbyuuid: {}
editionsbyuuid: {},
editionsuuids: [],
corpusLoaded: false
},
// getters
@@ -26,9 +28,27 @@ export default {
for (var i = 0; i < editionlist.length; i++) {
for (var j = 0; j < editionlist[i].editions.content.length; j++) {
state.editionsbyuuid[editionlist[i].editions.content[j].uuid] = editionlist[i].editions.content[j]
state.editionsuuids.push(editionlist[i].editions.content[j].uuid)
}
}
console.log('corpus editionsbyuuid', state.editionsbyuuid)
},
setTocs (state, tocslist) {
console.log('setTocs', tocslist)
tocslist.forEach((toc, i) => {
state.editionsbyuuid[toc.uuid].toc = toc.toc
})
// console.log('corpus editionsbyuuid', state.editionsbyuuid)
},
setPaginations (state, paginationslist) {
console.log('setPaginations', paginationslist)
paginationslist.forEach((pagination, i) => {
state.editionsbyuuid[pagination.uuid].pagination = pagination.pagination
})
// console.log('corpus editionsbyuuid', state.editionsbyuuid)
},
setCorpusLoaded (state) {
state.corpusLoaded = true
}
},
@@ -51,6 +71,19 @@ export default {
console.log('all texts returned: editionslist', editionslist)
commit('setEditionslist', editionslist)
commit('setEditionsByUUID', editionslist)
dispatch('getEditionsTocs')
.then((tocslist) => {
console.log('all tocs returned: tocslist', tocslist)
commit('setTocs', tocslist)
dispatch('getEditionsPaginations')
.then((paginationslist) => {
console.log('all paginations returned: paginationslist', paginationslist)
commit('setPaginations', paginationslist)
commit('setCorpusLoaded')
})
})
})
})
})
@@ -87,6 +120,48 @@ export default {
Promise.reject(error)
})
}))
},
// get tocslist
getEditionsTocs ({ dispatch, commit, state }) {
return Promise.all(state.editionsuuids.map(function (uuid) {
return REST.get(`${window.apipath}/texts/${uuid}/toc`, {})
.then(({ data }) => {
console.log('corpus getEditionsTocs REST: uuid, data', uuid, data)
// work arround
// if (!Array.isArray(data.content)) {
// data.content = [data.content]
// }
return {
uuid: uuid,
toc: data.content
}
})
.catch((error) => {
console.warn('Issue with getEditionsTocs', error)
Promise.reject(error)
})
}))
},
// get tocslist
getEditionsPaginations ({ dispatch, commit, state }) {
return Promise.all(state.editionsuuids.map(function (uuid) {
return REST.get(`${window.apipath}/texts/${uuid}/pagination`, {})
.then(({ data }) => {
console.log('corpus getEditionsPaginations REST: uuid, data', uuid, data)
// work arround
// if (!Array.isArray(data.content)) {
// data.content = [data.content]
// }
return {
uuid: uuid,
pagination: data.content
}
})
.catch((error) => {
console.warn('Issue with getEditionsPaginations', error)
Promise.reject(error)
})
}))
}
}
}