Add ability to filter reports

This commit is contained in:
Angelina Filippova 2019-05-23 00:16:41 +02:00
parent 1494f7fd9d
commit 63bf0ecb84
3 changed files with 42 additions and 24 deletions

View file

@ -11,7 +11,13 @@ export async function fetchReports(limit, max_id, authHost, token) {
}) })
} }
export async function toggleReportsFilter(authHost, token, filters) { export async function filterReports(filter, limit, max_id, authHost, token) {
return await request({
baseURL: baseName(authHost),
url: `/api/pleroma/admin/reports?state=${filter}&limit=${limit}&max_id=${max_id}`,
method: 'get',
headers: authHeaders(token)
})
} }
const authHeaders = (token) => token ? { 'Authorization': `Bearer ${getToken()}` } : {} const authHeaders = (token) => token ? { 'Authorization': `Bearer ${getToken()}` } : {}

View file

@ -1,40 +1,59 @@
import { fetchReports, toggleReportsFilter } from '@/api/reports' import { fetchReports, filterReports } from '@/api/reports'
const reports = { const reports = {
state: { state: {
fetchedReports: [], fetchedReports: [],
idOfLastReport: '', idOfLastReport: '',
page_limit: 5, page_limit: 5,
stateFilter: '',
loading: true loading: true
}, },
mutations: { mutations: {
SET_REPORTS: (state, reports) => { SET_LAST_REPORT_ID: (state, id) => {
state.fetchedReports = state.fetchedReports.concat(reports) state.idOfLastReport = id
},
SET_REPORT: (state, { index, report }) => {
state.fetchedReports[index] = report
}, },
SET_LOADING: (state, status) => { SET_LOADING: (state, status) => {
state.loading = status state.loading = status
}, },
SET_LAST_REPORT_ID: (state, id) => { SET_REPORTS: (state, reports) => {
state.idOfLastReport = id state.fetchedReports = reports
},
SET_REPORTS_FILTER: (state, filter) => {
state.stateFilter = filter
} }
// SET_REPORT: (state, { index, report }) => {
// state.fetchedReports[index] = report
// },
}, },
actions: { actions: {
async FetchReports({ commit, state, getters }) { async FetchReports({ commit, state, getters }) {
commit('SET_LOADING', true) commit('SET_LOADING', true)
const response = await fetchReports(state.page_limit, state.idOfLastReport, getters.authHost, getters.token) const response = await fetchReports(state.page_limit, state.idOfLastReport, getters.authHost, getters.token)
const reports = response.data.reports const reports = state.fetchedReports.concat(response.data.reports)
const id = reports.length > 0 ? reports[reports.length - 1].id : state.idOfLastReport const id = reports.length > 0 ? reports[reports.length - 1].id : state.idOfLastReport
commit('SET_REPORTS', reports) commit('SET_REPORTS', reports)
commit('SET_LAST_REPORT_ID', id) commit('SET_LAST_REPORT_ID', id)
commit('SET_LOADING', false) commit('SET_LOADING', false)
}, },
async ToggleReportsFilter({ getters }, filters) { async ToggleReportsFilter({ commit, dispatch, getters, state }, filter) {
const response = await toggleReportsFilter(getters.authHost, getters.token, filters) commit('SET_REPORTS', [])
return response.data commit('SET_LAST_REPORT_ID', '')
if (filter.length === 0) {
dispatch('FetchReports')
} else {
commit('SET_REPORTS_FILTER', filter)
commit('SET_LOADING', true)
const response = await filterReports(state.stateFilter, state.page_limit, state.idOfLastReport, getters.authHost, getters.token)
const reports = state.fetchedReports.concat(response.data.reports)
const id = reports.length > 0 ? reports[reports.length - 1].id : state.idOfLastReport
commit('SET_REPORTS', reports)
commit('SET_LAST_REPORT_ID', id)
commit('SET_LOADING', false)
}
} }
// async AddNote({ commit, state, getters }, { reportId, note }) { // async AddNote({ commit, state, getters }, { reportId, note }) {
// const report = state.fetchedReports.find(report => report.id === reportId) // const report = state.fetchedReports.find(report => report.id === reportId)

View file

@ -1,9 +1,8 @@
<template> <template>
<el-select <el-select
v-model="value" v-model="filter"
:clearable="isDesktop"
:placeholder="$t('reportsFilter.inputPlaceholder')" :placeholder="$t('reportsFilter.inputPlaceholder')"
multiple clearable
class="select-field" class="select-field"
@change="toggleFilters"> @change="toggleFilters">
<el-option value="open">{{ $t('reportsFilter.open') }}</el-option> <el-option value="open">{{ $t('reportsFilter.open') }}</el-option>
@ -16,18 +15,12 @@
export default { export default {
data() { data() {
return { return {
value: [] filter: []
}
},
computed: {
isDesktop() {
return this.$store.state.app.device === 'desktop'
} }
}, },
methods: { methods: {
toggleFilters() { toggleFilters() {
const currentFilters = this.$data.value.reduce((acc, filter) => ({ ...acc, [filter]: true }), {}) this.$store.dispatch('ToggleReportsFilter', this.$data.filter)
this.$store.dispatch('ToggleReportsFilter', currentFilters)
} }
} }
} }