add customer filter on index

app/Http/Controllers/ExpensesController.php

@@ -37,8 +37,13 @@ class ExpensesController extends Controller
             ->select('expenses.*', 'expense_categories.name')
             ->paginate($limit);
 
+        $customers = User::customer()
+            ->whereCompany($request->header('company'))
+            ->get();
+
         return response()->json([
             'expenses' => $expenses,
+            'customers' => $customers,
             'currency' => Currency::findOrFail(
                 CompanySetting::getSetting('currency', $request->header('company'))
             )

resources/assets/js/plugins/ar.json

@@ -412,6 +412,7 @@
     "title": "النفقات",
     "expenses_list": "قائمة النفقات",
     "expense_title": "Title",
+    "select_a_customer": "حدد عميلاً",
     "customer": "العميل",
     "contact": "تواصل",
     "category": "الفئة",

resources/assets/js/plugins/de.json

@@ -201,6 +201,7 @@
     "action": "Aktion",
     "add_expense": "Aufwendung hinzufügen",
     "add_new_expense": "Neue Aufwendung hinzufügen",
+    "select_a_customer": "Wählen Sie einen Kunden aus",
     "amount": "Summe",
     "categories": {
       "actions": "Aktionen",

resources/assets/js/plugins/en.json

@@ -426,6 +426,7 @@
   "expenses": {
     "title": "Expenses",
     "expenses_list": "Expenses List",
+    "select_a_customer": "Select a customer",
     "expense_title": "Title",
     "customer": "Customer",
     "contact": "Contact",

resources/assets/js/plugins/es.json

@@ -413,6 +413,7 @@
     "expense_title": "Título",
     "contact": "Contacto",
     "customer": "Cliente",
+    "select_a_customer": "Selecciona un cliente",
     "category": "Categoría",
     "from_date": "Desde la fecha",
     "to_date": "Hasta la fecha",

resources/assets/js/plugins/fr.json

@@ -411,6 +411,7 @@
     "expense_title": "Titre",
     "contact": "Contact",
     "customer": "Client Client",
+    "select_a_customer": "Sélectionnez un client",
     "category": "Catégorie",
     "from_date": "A partir de la date",
     "to_date": "À ce jour",

resources/assets/js/views/expenses/Index.vue

@@ -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(() => {