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

started corpus indexes filters #1801

Browse Source
This commit is contained in:
bachir
2023-03-01 18:41:25 +01:00
parent 7dbb43e0ed
commit 249d7fdb02
4 changed files with 180 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/app.scss
+12
View File
@@ -953,6 +953,18 @@ section[role="main-content"]{
// }
}
div#indexes-filters{
// height:$pager_h;
overflow: hidden;
box-sizing: content-box;
padding:1em 0 0 1.5em;
select{
option{
padding:0;
}
}
}
div#page-nav{
height:$pager_h;
overflow: hidden;
src/components/Content/EdIndexes.vue
+117
View File
@@ -0,0 +1,117 @@
<template>
<div>
<div
v-for="(opts, key) in options"
:key="key"
>
<v-select
:id="key"
type="select"
:placeholder="key"
append-to-body
:calculate-position="dropDownMenuPos"
:options="opts"
:clearable="true"
@input="onClickIndexItem"
>
<template v-slot:option="option">
<span v-html="option.label" />
</template>
</v-select>
</div>
</div>
</template>
<script>
import { createPopper } from '@popperjs/core'
export default {
name: 'EdIndexes',
props: {
indexes: Object
},
data: () => ({
options: {},
persons_selected: '',
objects_selected: '',
places_selected: ''
}),
created () {
this.parseIndexesToOptions()
},
// watch: {
// loadedtextsuuids (n, o) {
// console.log('EdToc watch loadedtxtsuuids', o, n)
// }
// },
methods: {
parseIndexesToOptions () {
console.log('EdIndexes parseIndexesToOptions', this.indexes)
Object.keys(this.indexes).forEach(key => {
// console.log('OPTION', key)
this.options[key] = []
Object.keys(this.indexes[key]).forEach(uuid => {
// console.log('OPTIONS ITEM', key, uuid)
this.options[key].push({
code: uuid,
label: `${this.indexes[key][uuid].title} [${this.indexes[key][uuid].quantity}]`
})
})
if (!this.options[key].length) {
delete this.options[key]
}
})
},
dropDownMenuPos (dropdownList, component, { width }) {
/**
* We need to explicitly define the dropdown width since
* it is usually inherited from the parent with CSS.
*/
dropdownList.style.width = width
/**
* Here we position the dropdownList relative to the $refs.toggle Element.
*
* The 'offset' modifier aligns the dropdown so that the $refs.toggle and
* the dropdownList overlap by 1 pixel.
*
* The 'toggleClass' modifier adds a 'drop-up' class to the Vue Select
* wrapper so that we can set some styles for when the dropdown is placed
* above.
*/
const popper = createPopper(component.$refs.toggle, dropdownList, {
placement: 'top',
modifiers: [
{
name: 'offset',
options: {
offset: [0, -1]
}
},
{
name: 'toggleClass',
enabled: true,
phase: 'write',
fn ({ state }) {
component.$el.classList.toggle('drop-up', state.placement === 'top')
}
}]
})
/**
* To prevent memory leaks Popper needs to be destroyed.
* If you return function, it will be called just before dropdown is removed from DOM.
*/
return () => popper.destroy()
},
onClickIndexItem (o) {
// this.page_selected = o
// this.$emit('onClickPaginationItem', o)
}
}
}
</script>
<style lang="scss" scoped>
</style>
src/pages/Edition.vue
+15 -2
View File
@@ -109,6 +109,11 @@
:loadedtextsuuids="textsuuids"
@onClickTocItem="onClickTocItem"
/>
<EdIndexes
v-if="indexes"
id="indexes-filters"
:indexes="indexes"
/>
<EdPagination
v-if="pagination"
id="page-nav"
@@ -129,6 +134,7 @@ import { mapState, mapActions } from 'vuex'
import MainContentLayout from '../components/Layouts/MainContentLayout'
import EdText from '../components/Content/EdText'
import EdToc from '../components/Content/EdToc'
import EdIndexes from '../components/Content/EdIndexes'
import EdPagination from '../components/Content/EdPagination'
export default {
@@ -143,6 +149,7 @@ export default {
MainContentLayout,
EdText,
EdToc,
EdIndexes,
EdPagination
},
data: () => ({
@@ -150,6 +157,7 @@ export default {
editionid: null,
textid: null,
extract: null,
extractid: null,
texts: [],
textsuuids: [],
metainfotitle: undefined,
@@ -172,6 +180,8 @@ export default {
toc: null,
flattoc: null,
//
indexes: null,
//
pagination: null,
//
navopened: false
@@ -272,8 +282,8 @@ export default {
console.log('Edition Corpus/setTocs', this.editionid, state.Corpus.editionsbyuuid)
this.toc = state.Corpus.editionsbyuuid[this.editionid].toc
}
if (mutation.type === 'Corpus/buildFlatTocs') {
console.log('Edition Corpus/buildFlatTocs', this.editionid, state.Corpus.editionsbyuuid)
if (mutation.type === 'Corpus/buildFlatTocsAndFilters') {
console.log('Edition Corpus/buildFlatTocsAndFilters', this.editionid, state.Corpus.editionsbyuuid)
this.flattoc = state.Corpus.editionsbyuuid[this.editionid].flattoc
// launch infinitloading
this.inifinite_load_id += 1
@@ -282,6 +292,8 @@ export default {
// get the first item
// will be replaced by front page of edition
if (!this.textid) { this.textid = this.flattoc[1] }
//
this.indexes = state.Corpus.editionsbyuuid[this.editionid].indexes
}
if (mutation.type === 'Corpus/setPaginations') {
// console.log('Edition state.Coprus.editionsbyuuid', this.editionid, state.Corpus.editionsbyuuid)
@@ -302,6 +314,7 @@ export default {
// get the first item
// will be replaced by front page of edition
if (!this.textid) { this.textid = this.toc[0].children[0].uuid }
this.indexes = this.editionsbyuuid[this.editionid].indexes
this.pagination = this.editionsbyuuid[this.editionid].pagination
}
},
src/store/modules/corpus.js
+36 -47
View File
@@ -41,24 +41,51 @@ export default {
})
// console.log('corpus editionsbyuuid', state.editionsbyuuid)
},
buildFlatTocs (state, eeuid) {
let recurseFlatToc = (state, eduuid, a) => {
// console.log('recurseFlatToc', a)
buildFlatTocsAndFilters (state) {
let recurseToc = (state, eduuid, a) => {
// console.log('recurseToc', a)
a.forEach((item, i) => {
if (item) {
// flatToc
state.editionsbyuuid[eduuid].flattoc.push(item.uuid)
state.numTocsItem++
// filters
let indexes = item.indexes[0]
for (const key in indexes) {
// loop through indexes (objects, persons, places)
if (Object.hasOwnProperty.call(indexes, key)) {
indexes[key].forEach(element => {
// loop through index elements
if (!(element.uuid in state.editionsbyuuid[eduuid].indexes[key])) {
state.editionsbyuuid[eduuid].indexes[key][element.uuid] = element
}
})
}
}
// recursive loop
if (item.children && item.children.length) {
recurseFlatToc(state, eduuid, item.children)
recurseToc(state, eduuid, item.children)
}
}
})
}
state.editionsuuids.forEach((eduuid, i) => {
// console.log('buildFlatTocs', i, eduuid)
// console.log('buildFlatTocsAndFilters', i, eduuid)
state.editionsbyuuid[eduuid].flattoc = []
recurseFlatToc(state, eduuid, state.editionsbyuuid[eduuid].toc)
// console.log('buildFlatTocs DONE', eduuid, state.editionsbyuuid[eduuid].flattoc)
state.editionsbyuuid[eduuid].indexes = {
objects: {},
persons: {},
places: {}
}
recurseToc(state, eduuid, state.editionsbyuuid[eduuid].toc)
console.log('buildFlatTocsAndFilters DONE',
eduuid,
`places: ${Object.keys(state.editionsbyuuid[eduuid].indexes['places']).length}`,
`objects: ${Object.keys(state.editionsbyuuid[eduuid].indexes['objects']).length}`,
`persons: ${Object.keys(state.editionsbyuuid[eduuid].indexes['persons']).length}`,
state.editionsbyuuid[eduuid].indexes)
})
console.log('numTocsItem', state.numTocsItem)
},
@@ -73,6 +100,7 @@ export default {
console.info('corpusLoaded')
state.corpusLoaded = true
}
},
// actions
@@ -84,11 +112,6 @@ export default {
.then(({ data }) => {
// console.log('getCorpuses authors data', data)
commit('setAuthors', data.content)
// get the texts list for each corpus (aka author)
// let authorsUuids = []
// for (let author of data.content) {
// authorsUuids.push(author.uuid)
// }
dispatch('getEditionsList', data.content)
.then((editionslist) => {
console.log('all texts returned: editionslist', editionslist)
@@ -99,9 +122,7 @@ export default {
.then((tocslist) => {
console.log('all tocs returned: tocslist', tocslist)
commit('setTocs', tocslist)
// this.methods.testMethod()
// dispatch('buildFlatTocs')
commit('buildFlatTocs')
commit('buildFlatTocsAndFilters')
dispatch('getEditionsPaginations')
.then((paginationslist) => {
console.log('all paginations returned: paginationslist', paginationslist)
@@ -188,38 +209,6 @@ export default {
})
}))
}
// ,
// buildFlatTocs ({ dispatch, commit, state }) {
// state.editionsuuids.forEach((eduuid, i) => {
// // console.log('buildFlatTocs', i, eduuid)
// dispatch('recurseFlatToc', state.editionsbyuuid[eduuid].toc)
// .then((ft) => {
// console.log('buildFlatTocs DONE', eduuid, ft)
// state.editionsbyuuid[eduuid].flattoc = ft
// })
// })
// },
// recurseFlatToc ({ dispatch, commit, state }, a) {
// // console.log('recurseFlatToc', a)
// let na = []
// // a.forEach((item, i) => {
// return Promise.all(a.map(function (item) {
// console.log('item', item)
// na.push(item.uuid)
// if (item.children && item.children.length) {
// return dispatch('recurseFlatToc', item.children)
// .then((nna) => {
// console.log('recurseFlatToc: na, nna', na, nna)
// na.concat(nna)
// })
// }
// // else {
// // return na
// // }
// }))
// // })
// // return na
// }
},
methods: {
testMethod () {