Add ability to clear all filters

This commit is contained in:
Angelina Filippova 2019-03-25 15:55:39 +03:00
parent 28c2833583
commit ab12129b8a
2 changed files with 20 additions and 3 deletions

View file

@ -44,11 +44,19 @@ const users = {
}, },
SET_USERS_FILTER: (state, filter) => { SET_USERS_FILTER: (state, filter) => {
state.filters[filter] = !state.filters[filter] state.filters[filter] = !state.filters[filter]
},
CLEAR_USERS_FILTERS: (state) => {
state.filters = {
showLocalUsersOnly: false,
showExternalUsersOnly: false,
showActiveUsersOnly: false,
showDeactivatedUsersOnly: false
}
} }
}, },
actions: { actions: {
async FetchUsers({ commit, state, getters }, { page }) { async FetchUsers({ commit, state, getters }, { page }) {
const response = await fetchUsers(state.filters.showLocalUsersOnly, getters.authHost, getters.token, page) const response = await fetchUsers(state.filters, getters.authHost, getters.token, page)
commit('SET_LOADING', true) commit('SET_LOADING', true)
@ -67,14 +75,18 @@ const users = {
commit('SET_LOADING', true) commit('SET_LOADING', true)
commit('SET_SEARCH_QUERY', query) commit('SET_SEARCH_QUERY', query)
const response = await searchUsers(query, state.filters.showLocalUsersOnly, getters.authHost, getters.token, page) const response = await searchUsers(query, state.filters, getters.authHost, getters.token, page)
loadUsers(commit, page, response.data) loadUsers(commit, page, response.data)
} }
}, },
async ToggleUsersFilter({ commit, dispatch, state }, filter) { async ToggleUsersFilter({ commit, dispatch, state }, filter) {
commit('SET_USERS_FILTER', filter) commit('SET_USERS_FILTER', filter)
// dispatch('SearchUsers', { query: state.searchQuery, page: 1 }) dispatch('SearchUsers', { query: state.searchQuery, page: 1 })
},
async ClearFilters({ commit, dispatch, state }) {
commit('CLEAR_USERS_FILTERS')
dispatch('SearchUsers', { query: state.searchQuery, page: 1 })
}, },
async ToggleRight({ commit, getters }, { user, right }) { async ToggleRight({ commit, getters }, { user, right }) {
user.roles[right] user.roles[right]

View file

@ -3,9 +3,11 @@
v-model="value" v-model="value"
:collapse-tags="isMobile" :collapse-tags="isMobile"
multiple multiple
clearable
placeholder="Select filter" placeholder="Select filter"
class="select-field" class="select-field"
@change="handleFilterToggle" @change="handleFilterToggle"
@clear="clearFilters"
@remove-tag="handleFilterToggle"> @remove-tag="handleFilterToggle">
<el-option-group <el-option-group
v-for="group in filters" v-for="group in filters"
@ -55,6 +57,9 @@ export default {
handleFilterToggle(filters) { handleFilterToggle(filters) {
const currentFilter = filters[filters.length - 1] const currentFilter = filters[filters.length - 1]
this.$store.dispatch('ToggleUsersFilter', currentFilter) this.$store.dispatch('ToggleUsersFilter', currentFilter)
},
clearFilters() {
this.$store.dispatch('ClearFilters')
} }
} }
} }