82 lines
1.8 KiB
Vue
82 lines
1.8 KiB
Vue
<template>
|
|
<div class="content">
|
|
<FilterBar
|
|
:filter="filter"
|
|
:range="range"
|
|
@set-filter="setFilter"
|
|
@set-range="setRange"
|
|
/>
|
|
|
|
<div class="content-inner">
|
|
<ul class="scenes nolist">
|
|
<li
|
|
v-for="release in releases"
|
|
:key="release.id"
|
|
class="scene"
|
|
>
|
|
<ReleaseTile :release="release" />
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import FilterBar from './filter-bar.vue';
|
|
import ReleaseTile from '../tile/release.vue';
|
|
|
|
import rangeDates from '../../js/range-dates';
|
|
|
|
async function fetchReleases() {
|
|
this.releases = await this.$store.dispatch('fetchReleases', {
|
|
filter: this.filter,
|
|
...rangeDates(this.range),
|
|
});
|
|
}
|
|
|
|
async function setFilter(filter) {
|
|
this.filter = filter;
|
|
localStorage.setItem('filter', this.filter);
|
|
|
|
await this.fetchReleases();
|
|
}
|
|
|
|
async function setRange(range) {
|
|
this.range = range;
|
|
localStorage.setItem('range', this.range);
|
|
|
|
await this.fetchReleases();
|
|
}
|
|
|
|
async function mounted() {
|
|
this.pageTitle = '';
|
|
|
|
await this.fetchReleases();
|
|
}
|
|
|
|
export default {
|
|
components: {
|
|
FilterBar,
|
|
ReleaseTile,
|
|
},
|
|
data() {
|
|
const storedFilter = localStorage.getItem('filter');
|
|
const storedRange = localStorage.getItem('range');
|
|
|
|
return {
|
|
filter: storedFilter ? storedFilter.split(',') : ['gay', 'transsexual'],
|
|
range: storedRange || 'new',
|
|
releases: [],
|
|
networks: [],
|
|
pageTitle: null,
|
|
};
|
|
},
|
|
mounted,
|
|
methods: {
|
|
fetchReleases,
|
|
setFilter,
|
|
setRange,
|
|
},
|
|
};
|
|
</script>
|