add customer filter on index

This commit is contained in:
Jay Makwana
2020-03-18 17:19:09 +05:30
parent c72265ed50
commit 4bb44f8c93
7 changed files with 32 additions and 5 deletions

View File

@ -43,7 +43,19 @@
<transition name="fade">
<div v-show="showFilters" class="filter-section">
<div class="row">
<div class="col-md-4">
<div class="col-md-3">
<label>{{ $t('expenses.customer') }}</label>
<base-select
v-model="filters.user"
:options="customers"
:searchable="true"
:show-labels="false"
:placeholder="$t('expenses.select_a_customer')"
label="name"
@click="filter = ! filter"
/>
</div>
<div class="col-md-3">
<label>{{ $t('expenses.category') }}</label>
<base-select
v-model="filters.category"
@ -55,7 +67,7 @@
@click="filter = ! filter"
/>
</div>
<div class="col-md-4">
<div class="col-md-3">
<label>{{ $t('expenses.from_date') }}</label>
<base-date-picker
v-model="filters.from_date"
@ -63,7 +75,7 @@
calendar-button-icon="calendar"
/>
</div>
<div class="col-md-4">
<div class="col-md-3">
<label>{{ $t('expenses.to_date') }}</label>
<base-date-picker
v-model="filters.to_date"
@ -237,10 +249,12 @@ export default {
showFilters: false,
filtersApplied: false,
isRequestOngoing: true,
customers: [],
filters: {
category: null,
from_date: '',
to_date: ''
to_date: '',
user: ''
}
}
},
@ -308,6 +322,7 @@ export default {
]),
async fetchData ({ page, filter, sort }) {
let data = {
user_id: this.filters.user ? this.filters.user.id : null,
expense_category_id: this.filters.category !== null ? this.filters.category.id : '',
from_date: this.filters.from_date === '' ? this.filters.from_date : moment(this.filters.from_date).format('DD/MM/YYYY'),
to_date: this.filters.to_date === '' ? this.filters.to_date : moment(this.filters.to_date).format('DD/MM/YYYY'),
@ -318,6 +333,7 @@ export default {
this.isRequestOngoing = true
let response = await this.fetchExpenses(data)
this.customers = response.data.customers
this.isRequestOngoing = false
return {
@ -340,7 +356,8 @@ export default {
this.filters = {
category: null,
from_date: '',
to_date: ''
to_date: '',
user: null
}
this.$nextTick(() => {