mirror of
https://github.com/em-squared/5e-drs.git
synced 2025-10-31 13:34:21 +00:00
choix des colonnes à afficher dans le grimoire
This commit is contained in:
Maxime Moraine
parent
9e09371de0
commit
2d9ab2cd0d
1 changed files with 118 additions and 15 deletions
|
|
@ -11,6 +11,59 @@
|
||||||
|
|
||||||
<h1>Grimoire</h1>
|
<h1>Grimoire</h1>
|
||||||
|
|
||||||
|
<div><strong>Colonnes affichées :</strong></div>
|
||||||
|
<div class="columns-toggles d-flex mb-2">
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.school"
|
||||||
|
label="École"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.castingTime"
|
||||||
|
label="Temps d'incantation"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.duration"
|
||||||
|
label="Durée"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.concentration"
|
||||||
|
label="Concentration"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.ritual"
|
||||||
|
label="Rituel"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.components"
|
||||||
|
label="Composantes"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
<v-checkbox
|
||||||
|
class="mt-0 mr-4"
|
||||||
|
v-model="showColumn.description"
|
||||||
|
label="Description"
|
||||||
|
hide-details
|
||||||
|
@change="setShowColumn"
|
||||||
|
></v-checkbox>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="active-filters mb-2">
|
<div class="active-filters mb-2">
|
||||||
<div class="classes-filter mb-1" v-if="selectedClasses.length > 0">
|
<div class="classes-filter mb-1" v-if="selectedClasses.length > 0">
|
||||||
<strong>Classes</strong> : <v-chip class="mr-1" v-for="(c, idx) in selectedClasses">{{ c }}</v-chip>
|
<strong>Classes</strong> : <v-chip class="mr-1" v-for="(c, idx) in selectedClasses">{{ c }}</v-chip>
|
||||||
|
|
@ -96,9 +149,9 @@
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- <template v-slot:item.frontmatter.classes="{ item }">
|
<template v-slot:item.frontmatter.description="{ item }">
|
||||||
<span v-for="(c, idx) in item.frontmatter.classes" :key="idx">{{c}}<template v-if="idx != item.frontmatter.classes.length-1">, </template></span>
|
<div v-html="item.frontmatter.description"></div>
|
||||||
</template> -->
|
</template>
|
||||||
|
|
||||||
</v-data-table>
|
</v-data-table>
|
||||||
|
|
||||||
|
|
@ -120,6 +173,7 @@ import { setUrlParams, getUrlParameter } from '@theme/util/filterHelpers'
|
||||||
import { isResourceInLibrary } from '@theme/util'
|
import { isResourceInLibrary } from '@theme/util'
|
||||||
import Spell from '@theme/components/Spell'
|
import Spell from '@theme/components/Spell'
|
||||||
import MySpellsButton from '@theme/global-components/MySpellsButton'
|
import MySpellsButton from '@theme/global-components/MySpellsButton'
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { Breadcrumb, Spell, MySpellsButton },
|
components: { Breadcrumb, Spell, MySpellsButton },
|
||||||
|
|
@ -137,18 +191,27 @@ export default {
|
||||||
],
|
],
|
||||||
page: 1,
|
page: 1,
|
||||||
pageCount: 0,
|
pageCount: 0,
|
||||||
headers: [
|
// headers: [
|
||||||
{ text: "", align: 'center', sortable: false, value: 'isInSpellBook' },
|
// { text: "", align: 'center', sortable: false, value: 'isInSpellBook' },
|
||||||
{ text: "Nom", align: 'start', sortable: true, value: 'title' },
|
// { text: "Nom", align: 'start', sortable: true, value: 'title' },
|
||||||
{ text: "Niveau", align: 'center', sortable: true, value: 'frontmatter.level' },
|
// { text: "Niveau", align: 'center', sortable: true, value: 'frontmatter.level' },
|
||||||
{ text: "École", align: 'start', sortable: false, value: 'frontmatter.school' },
|
// { text: "École", align: 'start', sortable: false, value: 'frontmatter.school' },
|
||||||
{ text: "Temps d'incantation", align: 'start', sortable: false, value: 'frontmatter.casting_time' },
|
// { text: "Temps d'incantation", align: 'start', sortable: false, value: 'frontmatter.casting_time' },
|
||||||
{ text: "Durée", align: 'start', sortable: false, value: 'frontmatter.duration' },
|
// { text: "Durée", align: 'start', sortable: false, value: 'frontmatter.duration' },
|
||||||
{ text: "Concentration", align: 'center', sortable: false, value: 'frontmatter.concentration' },
|
// { text: "Concentration", align: 'center', sortable: false, value: 'frontmatter.concentration' },
|
||||||
{ text: "Rituel", align: 'center', sortable: false, value: 'frontmatter.ritual' },
|
// { text: "Rituel", align: 'center', sortable: false, value: 'frontmatter.ritual' },
|
||||||
{ text: "Composantes", align: 'center', sortable: false, value: 'frontmatter.components' },
|
// { text: "Composantes", align: 'center', sortable: false, value: 'frontmatter.components' },
|
||||||
// { text: "Classes", align: 'start', sortable: false, value: 'frontmatter.classes' }
|
// { text: "Description", align: 'start', sortable: false, value: 'frontmatter.description' },
|
||||||
],
|
// ],
|
||||||
|
showColumn: {
|
||||||
|
school: true,
|
||||||
|
castingTime: true,
|
||||||
|
duration: true,
|
||||||
|
concentration: true,
|
||||||
|
ritual: true,
|
||||||
|
components: true,
|
||||||
|
description: false,
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
@ -165,6 +228,36 @@ export default {
|
||||||
componentMaterial: state => state.spellFilters.componentMaterial,
|
componentMaterial: state => state.spellFilters.componentMaterial,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
headers() {
|
||||||
|
let headers = [
|
||||||
|
{ text: "", align: 'center', sortable: false, value: 'isInSpellBook' },
|
||||||
|
{ text: "Nom", align: 'start', sortable: true, value: 'title' },
|
||||||
|
{ text: "Niveau", align: 'center', sortable: true, value: 'frontmatter.level' }
|
||||||
|
]
|
||||||
|
if (this.showColumn.school) {
|
||||||
|
headers.push({ text: "École", align: 'start', sortable: false, value: 'frontmatter.school' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.castingTime) {
|
||||||
|
headers.push({ text: "Temps d'incantation", align: 'start', sortable: false, value: 'frontmatter.casting_time' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.duration) {
|
||||||
|
headers.push({ text: "Durée", align: 'start', sortable: false, value: 'frontmatter.duration' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.concentration) {
|
||||||
|
headers.push({ text: "Concentration", align: 'center', sortable: false, value: 'frontmatter.concentration' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.ritual) {
|
||||||
|
headers.push({ text: "Rituel", align: 'center', sortable: false, value: 'frontmatter.ritual' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.components) {
|
||||||
|
headers.push({ text: "Composantes", align: 'center', sortable: false, value: 'frontmatter.components' })
|
||||||
|
}
|
||||||
|
if (this.showColumn.description) {
|
||||||
|
headers.push({ text: "Description", align: 'start', sortable: false, value: 'frontmatter.description' })
|
||||||
|
}
|
||||||
|
return headers
|
||||||
|
},
|
||||||
|
|
||||||
selectedClasses() {
|
selectedClasses() {
|
||||||
let result = []
|
let result = []
|
||||||
for (let c of this.classes) {
|
for (let c of this.classes) {
|
||||||
|
|
@ -341,6 +434,10 @@ export default {
|
||||||
}
|
}
|
||||||
return level.level.toString() + '<sup>ème</sup>'
|
return level.level.toString() + '<sup>ème</sup>'
|
||||||
},
|
},
|
||||||
|
|
||||||
|
setShowColumn () {
|
||||||
|
Cookies.set('heros-et-dragons-grimoire-colonnes', this.showColumn)
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted () {
|
mounted () {
|
||||||
|
|
@ -357,6 +454,12 @@ export default {
|
||||||
if (page) {
|
if (page) {
|
||||||
this.page = page
|
this.page = page
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Choix des colonnes à afficher
|
||||||
|
const showColumn = Cookies.get('heros-et-dragons-grimoire-colonnes')
|
||||||
|
if (showColumn) {
|
||||||
|
this.showColumn = JSON.parse(showColumn)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue