kopia lustrzana https://github.com/manuelkasper/sotlas-frontend
rodzic
8f12d1e150
commit
cab322500c
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"include": [
|
||||||
|
"./src/**/*"
|
||||||
|
]
|
||||||
|
}
|
|
@ -4,8 +4,13 @@
|
||||||
<template v-slot:title-right>
|
<template v-slot:title-right>
|
||||||
<b-field>
|
<b-field>
|
||||||
<b-dropdown class="control" v-model="selectedAssociations" multiple aria-role="list" position="is-bottom-left" :scrollable="$mq.desktop" @change="loadNewPhotos">
|
<b-dropdown class="control" v-model="selectedAssociations" multiple aria-role="list" position="is-bottom-left" :scrollable="$mq.desktop" @change="loadNewPhotos">
|
||||||
<b-button icon-right="angle-down" slot="trigger">
|
<b-button icon-left="globe" icon-right="angle-down" slot="trigger">
|
||||||
|
<template v-if="$mq.mobile">
|
||||||
|
{{ selectedAssociations.length > 0 ? (selectedAssociations.length) : '' }}
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
Associations {{ selectedAssociations.length > 0 ? ('(' + selectedAssociations.length + ')') : '' }}
|
Associations {{ selectedAssociations.length > 0 ? ('(' + selectedAssociations.length + ')') : '' }}
|
||||||
|
</template>
|
||||||
</b-button>
|
</b-button>
|
||||||
<b-dropdown-item v-for="association in associations" :key="association.code" :value="association.code" aria-role="listitem">
|
<b-dropdown-item v-for="association in associations" :key="association.code" :value="association.code" aria-role="listitem">
|
||||||
{{ association.code }} – {{ association.name }}
|
{{ association.code }} – {{ association.name }}
|
||||||
|
@ -18,6 +23,9 @@
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<SummitPhotos v-for="summit in summits" :key="summit.code" :summit="summit" :minDate="minDate" :showSummitName="true" />
|
<SummitPhotos v-for="summit in summits" :key="summit.code" :summit="summit" :minDate="minDate" :showSummitName="true" />
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="hasMore" class="has-text-centered">
|
||||||
|
<b-button type="is-info" @click="loadMore">Load more</b-button>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section v-else-if="summits != null" class="section">
|
<section v-else-if="summits != null" class="section">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
@ -51,7 +59,7 @@ export default {
|
||||||
loadNewPhotos () {
|
loadNewPhotos () {
|
||||||
this.loadingComponent = this.$buefy.loading.open({ canCancel: true })
|
this.loadingComponent = this.$buefy.loading.open({ canCancel: true })
|
||||||
|
|
||||||
let recentPhotosParams = { limit: this.limit }
|
let recentPhotosParams = { limit: this.limit + 1 }
|
||||||
let associations = '*'
|
let associations = '*'
|
||||||
if (this.selectedAssociations.length > 0) {
|
if (this.selectedAssociations.length > 0) {
|
||||||
associations = this.selectedAssociations.join('|')
|
associations = this.selectedAssociations.join('|')
|
||||||
|
@ -59,7 +67,8 @@ export default {
|
||||||
axios.get('https://api.sotl.as/summits/recent_photos/' + associations + '/' + this.days, { params: recentPhotosParams })
|
axios.get('https://api.sotl.as/summits/recent_photos/' + associations + '/' + this.days, { params: recentPhotosParams })
|
||||||
.then(response => {
|
.then(response => {
|
||||||
this.loadingComponent.close()
|
this.loadingComponent.close()
|
||||||
this.summits = response.data
|
this.summits = response.data.slice(0, -1)
|
||||||
|
this.hasMore = (this.limit < response.data.length)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
loadAssociations () {
|
loadAssociations () {
|
||||||
|
@ -67,6 +76,10 @@ export default {
|
||||||
.then(response => {
|
.then(response => {
|
||||||
this.associations = response.data
|
this.associations = response.data
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
loadMore () {
|
||||||
|
this.limit += 20
|
||||||
|
this.loadNewPhotos()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -85,6 +98,7 @@ export default {
|
||||||
summits: null,
|
summits: null,
|
||||||
days: 7,
|
days: 7,
|
||||||
limit: 20,
|
limit: 20,
|
||||||
|
hasMore: false,
|
||||||
associations: null,
|
associations: null,
|
||||||
selectedAssociations: []
|
selectedAssociations: []
|
||||||
}
|
}
|
||||||
|
|
Ładowanie…
Reference in New Issue