86 lines
1.9 KiB
Vue
86 lines
1.9 KiB
Vue
<template>
|
|
<section>
|
|
<LandingBanner />
|
|
|
|
<div v-for="list in lists">
|
|
<list-header :title="list.title" :link="'/list/' + list.route" />
|
|
|
|
<results-list :results="list.data" :shortList="true" />
|
|
<loader v-if="!list.data.length" />
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import LandingBanner from '@/components/LandingBanner'
|
|
import ListHeader from '@/components/ListHeader'
|
|
import ResultsList from '@/components/ResultsList'
|
|
import Loader from '@/components/ui/Loader'
|
|
|
|
import { getTmdbMovieListByName, getRequests } from '@/api'
|
|
|
|
export default {
|
|
name: 'home',
|
|
components: { LandingBanner, ResultsList, ListHeader, Loader },
|
|
data(){
|
|
return {
|
|
imageFile: 'dist/pulp-fiction.jpg',
|
|
requests: [],
|
|
nowplaying: [],
|
|
upcoming: [],
|
|
popular: []
|
|
}
|
|
},
|
|
computed: {
|
|
lists() {
|
|
return [
|
|
{
|
|
title: 'Requests',
|
|
route: 'request',
|
|
data: this.requests
|
|
},
|
|
{
|
|
title: 'Now playing',
|
|
route: 'now_playing',
|
|
data: this.nowplaying
|
|
},
|
|
{
|
|
title: 'Upcoming',
|
|
route: 'upcoming',
|
|
data: this.upcoming
|
|
},
|
|
{
|
|
title: 'Popular',
|
|
route: 'popular',
|
|
data: this.popular
|
|
}
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
fetchRequests() {
|
|
getRequests()
|
|
.then(results => this.requests = results.results)
|
|
},
|
|
fetchNowPlaying() {
|
|
getTmdbMovieListByName('now_playing')
|
|
.then(results => this.nowplaying = results.results)
|
|
},
|
|
fetchUpcoming() {
|
|
getTmdbMovieListByName('upcoming')
|
|
.then(results => this.upcoming = results.results)
|
|
},
|
|
fetchPopular() {
|
|
getTmdbMovieListByName('popular')
|
|
.then(results => this.popular = results.results)
|
|
}
|
|
},
|
|
created(){
|
|
this.fetchRequests()
|
|
this.fetchNowPlaying()
|
|
this.fetchUpcoming()
|
|
this.fetchPopular()
|
|
}
|
|
}
|
|
</script>
|