123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104 |
- <template>
- <MainContentLayout id="index-nominum" class="index">
- <template v-slot:header>
- <h1>Personnes</h1>
- <span v-if="!items.length" class="loading">Loading ...</span>
- </template>
- <ul v-if="items.length" class="item-list">
- <li
- v-for="item in items"
- :key="item.url"
- :class="{ hidden: activeLetter && item.letter !== activeLetter }"
- >
- <NominumItem :item="item" />
- </li>
- </ul>
- <template v-slot:nav>
- <div v-if="items.length" class="abc">
- <ul>
- <li :class="{ inactive: activeLetter }">
- <span
- @click.prevent="onClickLetter(null)"
- @keyup.enter="onClickLetter(null)"
- >tout</span>
- </li>
- <li
- v-for="l in letters" :key="l"
- :class="{ inactive: activeLetter && l !== activeLetter }"
- >
- <span
- @click.prevent="onClickLetter(l)"
- @keyup.enter="onClickLetter(l)"
- >{{ l }}</span>
- </li>
- </ul>
- </div>
- </template>
- </MainContentLayout>
- </template>
- <script>
- import { REST } from 'api/rest-axios'
- import MainContentLayout from '../components/Layouts/MainContentLayout'
- import NominumItem from '../components/Content/NominumItem'
- export default {
- name: 'IndexNominum',
- metaInfo: {
- title: 'Index Nominum'
- },
- components: {
- NominumItem,
- MainContentLayout
- },
- data: () => ({
- items: [],
- letters: [],
- activeLetter: null
- }),
- beforeCreate () {
- // items/gdpLeMaire1685T01BodyFr01.003.016
- // texts/gdpSauval1724
- REST.get(`${window.apipath}/indexNominum`, {})
- .then(({ data }) => {
- console.log('index nominum REST: data', data)
- if (data.content.length) {
- this.items = data.content.sort((a, b) => {
- let Aletter = a.letter.toLowerCase()
- let Bletter = b.letter.toLowerCase()
- if (Aletter < Bletter) {
- return -1
- } else if (Aletter > Bletter) {
- return 1
- } else {
- return 0
- }
- })
- }
- for (let i = 0; i < this.items.length; i++) {
- if (this.letters.indexOf(this.items[i].letter.toLowerCase()) === -1) {
- this.letters.push(this.items[i].letter.toLowerCase())
- }
- }
- this.letters = this.letters.sort()
- })
- .catch((error) => {
- console.warn('Issue with index nominum', error)
- Promise.reject(error)
- })
- },
- methods: {
- onClickLetter (l) {
- this.activeLetter = l
- // console.log('activeLetter', this.activeLetter)
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- </style>
|