Fix pagination bug

This commit is contained in:
Angelina Filippova 2019-03-03 23:46:14 +03:00
parent 9eb99cb3a3
commit 3adcd048a1
2 changed files with 14 additions and 10 deletions

View file

@ -6,7 +6,8 @@ const user = {
loading: true, loading: true,
searchQuery: '', searchQuery: '',
totalUsersCount: 0, totalUsersCount: 0,
pageSize: 2 pageSize: 2,
currentPage: 1
}, },
mutations: { mutations: {
SET_USERS: (state, users) => { SET_USERS: (state, users) => {
@ -27,6 +28,9 @@ const user = {
SET_COUNT: (state, count) => { SET_COUNT: (state, count) => {
state.totalUsersCount = count state.totalUsersCount = count
}, },
SET_PAGE: (state, page) => {
state.currentPage = page
},
SET_PAGE_SIZE: (state, pageSize) => { SET_PAGE_SIZE: (state, pageSize) => {
state.pageSize = pageSize state.pageSize = pageSize
}, },
@ -40,7 +44,7 @@ const user = {
commit('SET_LOADING', true) commit('SET_LOADING', true)
loadUsers(commit, response.data) loadUsers(commit, page, response.data)
}, },
async ToggleUserActivation({ commit }, nickname) { async ToggleUserActivation({ commit }, nickname) {
const response = await toggleUserActivation(nickname) const response = await toggleUserActivation(nickname)
@ -49,9 +53,6 @@ const user = {
}, },
async SearchUsers({ commit, dispatch }, { query, page, page_size }) { async SearchUsers({ commit, dispatch }, { query, page, page_size }) {
if (query.length === 0) { if (query.length === 0) {
// console.log(page)
// console.log(query)
// console.log(page_size)
commit('SET_SEARCH_QUERY', query) commit('SET_SEARCH_QUERY', query)
dispatch('FetchUsers', { page, page_size: 2 }) dispatch('FetchUsers', { page, page_size: 2 })
} else { } else {
@ -60,15 +61,16 @@ const user = {
const response = await searchUsers(query, page, page_size) const response = await searchUsers(query, page, page_size)
loadUsers(commit, response.data) loadUsers(commit, page, response.data)
} }
} }
} }
} }
const loadUsers = (commit, { users, count, page_size }) => { const loadUsers = (commit, page, { users, count, page_size }) => {
commit('SET_USERS', users) commit('SET_USERS', users)
commit('SET_COUNT', count) commit('SET_COUNT', count)
commit('SET_PAGE', page)
commit('SET_PAGE_SIZE', page_size) commit('SET_PAGE_SIZE', page_size)
commit('SET_LOADING', false) commit('SET_LOADING', false)
} }

View file

@ -26,7 +26,8 @@
<div v-if="!loading" class="pagination"> <div v-if="!loading" class="pagination">
<el-pagination <el-pagination
:total="usersCount" :total="usersCount"
:page-size.sync="pageSize" :current-page="currentPage"
:page-size="pageSize"
background background
layout="prev, pager, next" layout="prev, pager, next"
@current-change="handlePageChange" @current-change="handlePageChange"
@ -52,6 +53,9 @@ export default {
}, },
pageSize() { pageSize() {
return this.$store.state.users.pageSize return this.$store.state.users.pageSize
},
currentPage() {
return this.$store.state.users.currentPage
} }
}, },
created() { created() {
@ -71,8 +75,6 @@ export default {
if (searchQuery === '') { if (searchQuery === '') {
this.$store.dispatch('FetchUsers', { page, page_size: 2 }) this.$store.dispatch('FetchUsers', { page, page_size: 2 })
} else { } else {
console.log(searchQuery)
console.log(page)
this.$store.dispatch('SearchUsers', { query: searchQuery, page, page_size: 2 }) this.$store.dispatch('SearchUsers', { query: searchQuery, page, page_size: 2 })
} }
}, },