80 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			80 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <template>
 | |
| 	<div class="content">
 | |
| 		<div
 | |
| 			ref="content"
 | |
| 			class="content-inner"
 | |
| 		>
 | |
| 			<FilterBar
 | |
| 				:fetch-releases="fetchReleases"
 | |
| 				:is-home="true"
 | |
| 				:items-total="totalCount"
 | |
| 				:items-per-page="limit"
 | |
| 				:content="$refs.content"
 | |
| 			/>
 | |
| 
 | |
| 			<Releases :releases="releases" />
 | |
| 
 | |
| 			<Pagination
 | |
| 				v-if="totalCount > 0"
 | |
| 				:items-total="totalCount"
 | |
| 				:items-per-page="limit"
 | |
| 				class="pagination-bottom"
 | |
| 			/>
 | |
| 		</div>
 | |
| 	</div>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import FilterBar from '../header/filter-bar.vue';
 | |
| import Releases from '../releases/releases.vue';
 | |
| import Pagination from '../pagination/pagination.vue';
 | |
| 
 | |
| async function fetchReleases() {
 | |
| 	const { releases, totalCount } = await this.$store.dispatch('fetchReleases', {
 | |
| 		limit: this.limit,
 | |
| 		range: this.$route.params.range,
 | |
| 		pageNumber: Number(this.$route.params.pageNumber) || 1,
 | |
| 	});
 | |
| 
 | |
| 	this.totalCount = totalCount;
 | |
| 	this.releases = releases;
 | |
| 
 | |
| 	this.$refs.content.scrollTop = 0;
 | |
| }
 | |
| 
 | |
| async function route() {
 | |
| 	await this.fetchReleases();
 | |
| }
 | |
| 
 | |
| async function mounted() {
 | |
| 	this.pageTitle = '';
 | |
| 
 | |
| 	await this.fetchReleases();
 | |
| }
 | |
| 
 | |
| export default {
 | |
| 	components: {
 | |
| 		FilterBar,
 | |
| 		Releases,
 | |
| 		Pagination,
 | |
| 	},
 | |
| 	data() {
 | |
| 		return {
 | |
| 			releases: [],
 | |
| 			networks: [],
 | |
| 			pageTitle: null,
 | |
| 			limit: 20,
 | |
| 			totalCount: 0,
 | |
| 			from: null,
 | |
| 		};
 | |
| 	},
 | |
| 	watch: {
 | |
| 		$route: route,
 | |
| 	},
 | |
| 	mounted,
 | |
| 	methods: {
 | |
| 		fetchReleases,
 | |
| 	},
 | |
| };
 | |
| </script>
 |