diff --git a/app/Classes/General/Eloquent/Filters/CreatedAfterOrEqual.php b/app/Classes/General/Eloquent/Filters/CreatedAfterOrEqual.php
new file mode 100644
index 00000000..9df98f40
--- /dev/null
+++ b/app/Classes/General/Eloquent/Filters/CreatedAfterOrEqual.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+
+use Carbon\Carbon;
+use Illuminate\Database\Eloquent\Builder;
+
+class CreatedAfterOrEqual implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        $table = $builder->getModel()->getTable();
+        $startDate = Carbon::createFromFormat('d-m-Y', $value)->startOfDay();
+        return $builder->where("{$table}.created_at", '>=', $startDate);
+    }
+}
\ No newline at end of file
diff --git a/app/Classes/General/Eloquent/Filters/CreatedBeforeOrEqual.php b/app/Classes/General/Eloquent/Filters/CreatedBeforeOrEqual.php
new file mode 100644
index 00000000..5b349540
--- /dev/null
+++ b/app/Classes/General/Eloquent/Filters/CreatedBeforeOrEqual.php
@@ -0,0 +1,22 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+use Carbon\Carbon;
+use Illuminate\Database\Eloquent\Builder;
+
+class CreatedBeforeOrEqual implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        $table = $builder->getModel()->getTable();
+        $endDate = Carbon::createFromFormat('d-m-Y', $value)->endOfDay();    
+        return $builder->where("{$table}.created_at", '<=', $endDate);
+    }
+}
diff --git a/app/Classes/General/Eloquent/Filters/OwnerId.php b/app/Classes/General/Eloquent/Filters/OwnerId.php
index eac7e32d..c2dfa685 100644
--- a/app/Classes/General/Eloquent/Filters/OwnerId.php
+++ b/app/Classes/General/Eloquent/Filters/OwnerId.php
@@ -14,7 +14,8 @@ class OwnerId implements Filter
      */
     public static function apply(Builder $builder, $value)
     {
-        return $builder->where('owner_id', $value);
+        $table = $builder->getModel()->getTable();
+        return $builder->where("{$table}.owner_id", $value);
     }
 
 }
\ No newline at end of file
diff --git a/app/Classes/General/Eloquent/Filters/OwnerType.php b/app/Classes/General/Eloquent/Filters/OwnerType.php
new file mode 100644
index 00000000..3feedccd
--- /dev/null
+++ b/app/Classes/General/Eloquent/Filters/OwnerType.php
@@ -0,0 +1,21 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+use Illuminate\Database\Eloquent\Builder;
+
+class OwnerType implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return Builder|mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        $table = $builder->getModel()->getTable();
+        return $builder->where("{$table}.owner_type", $value);
+    }
+
+}
\ No newline at end of file
diff --git a/app/Classes/General/Eloquent/Filters/StatusIn.php b/app/Classes/General/Eloquent/Filters/StatusIn.php
index cbfdfbd0..85425802 100644
--- a/app/Classes/General/Eloquent/Filters/StatusIn.php
+++ b/app/Classes/General/Eloquent/Filters/StatusIn.php
@@ -14,7 +14,8 @@ class StatusIn implements Filter
      */
     public static function apply(Builder $builder, $value)
     {
-        return $builder->whereIn('status', $value);
+        $table = $builder->getModel()->getTable();
+        return $builder->whereIn("{$table}.status", $value);
     }
 
 }
\ No newline at end of file
diff --git a/app/Classes/General/Eloquent/Filters/WithOrderReferenceLike.php b/app/Classes/General/Eloquent/Filters/WithOrderReferenceLike.php
new file mode 100644
index 00000000..acc9f161
--- /dev/null
+++ b/app/Classes/General/Eloquent/Filters/WithOrderReferenceLike.php
@@ -0,0 +1,27 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+
+use Illuminate\Database\Eloquent\Builder;
+
+class WithOrderReferenceLike implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        return $builder->join('transactions as t2', 't2.payment_reference', '=', 'transactions.bill_no')
+            ->join('transactions as t3', 't3.id', '=', 't2.owner_id')
+            ->join('packing_lists', 'packing_lists.id', '=', 't3.owner_id')
+            ->join('orders', function ($join) use ($value) {
+                $join->on('orders.id', '=', 'packing_lists.owner_id')
+                    ->where('orders.reference', 'LIKE', '%'.$value.'%');
+            })
+            ->addSelect(['transactions.*', 't2.id as paymentTransactionId', 't3.id as invoiceTransactionId', 'packing_lists.id as packingListId', 'orders.reference as orderReference']);
+    }
+}
\ No newline at end of file
diff --git a/app/Classes/Modules/Exports/Services/ExportsCustomersWalletTransactionHistory.php b/app/Classes/Modules/Exports/Services/ExportsCustomersWalletTransactionHistory.php
new file mode 100644
index 00000000..69571b1f
--- /dev/null
+++ b/app/Classes/Modules/Exports/Services/ExportsCustomersWalletTransactionHistory.php
@@ -0,0 +1,108 @@
+<?php
+
+namespace App\Classes\Modules\Exports\Services;
+
+use App\Classes\ValueObjects\Constants\TransactionType;
+use App\Models\Transaction;
+use App\Models\Company;
+use App\Models\Wallet;
+use Carbon\Carbon;
+use Illuminate\Http\Request;
+use Maatwebsite\Excel\Concerns\Exportable;
+use Maatwebsite\Excel\Concerns\FromQuery;
+use Maatwebsite\Excel\Concerns\ShouldAutoSize;
+use Maatwebsite\Excel\Concerns\WithHeadingRow;
+use Maatwebsite\Excel\Concerns\WithHeadings;
+use Maatwebsite\Excel\Concerns\WithMapping;
+
+class ExportsCustomersWalletTransactionHistory implements FromQuery, WithHeadings, WithHeadingRow, WithMapping, ShouldAutoSize
+{
+    use Exportable;
+
+    private $request;
+    private $runningBalance = 0;
+
+    public function __construct(Request $request)
+    {
+        $this->request = $request;
+    }
+
+    public function headings(): array
+    {
+        return [
+            'Date',
+            'Description',
+            'Incoming',
+            'Outgoing',
+            'Balance',
+        ];
+    }
+
+    /**
+     * @return \Illuminate\Support\Collection|mixed
+     */
+    public function query()
+    {
+        $wallet = Wallet::find($this->request->route('wallet_id'));
+        $transactions = $wallet->transactions()->whereIn('transactions.status', [2, 3])->orderBy('id');
+
+        return $transactions;
+    }
+
+    /**
+     * @param Transaction $transaction
+     *
+     * @return array
+     */
+    public function map($transaction): array
+    {
+        $decimals = $this->request->route('is_precise') == 'true' ? 5 : 2;
+
+        $description = '';
+        switch ((int) $transaction->type) {
+            case TransactionType::TOP_UP:
+                $description = (float) $transaction->amount . ' Credit Top up';
+                break;
+            case TransactionType::GROUP_PAYMENT:
+                $description = (float) $transaction->amount . ' Credit Top up';
+                break;
+            case TransactionType::CREDIT_NOTE:
+                $description = 'Credit Voucher for ' . $transaction->payment_reference;
+                break;
+            case TransactionType::PAYMENT:
+                $booking = Transaction::where('payment_reference', $transaction->bill_no)->first()->owner;
+
+                if (!$booking) {
+                    $description = 'Payment for unknown booking, please contact tech support.';
+                    break;
+                }
+
+                $marking = $booking->marking;
+                $description = 'Payment For booking refs' . $marking;
+                break;
+            case TransactionType::DEBIT_NOTE:
+                $description = 'Debit Voucher for ' . $transaction->payment_reference;
+                break;
+        }
+
+        $incoming = $outgoing = '';
+
+        if (in_array($transaction->type, [TransactionType::TOP_UP, TransactionType::CREDIT_NOTE, TransactionType::GROUP_PAYMENT])) {
+            $incoming =  number_format($transaction->amount, $decimals, '.', ',');
+            $this->runningBalance += $transaction->amount;
+        }
+
+        if (in_array($transaction->type, [TransactionType::PAYMENT, TransactionType::DEBIT_NOTE])) {
+            $outgoing =  number_format($transaction->amount, $decimals, '.', ',');
+            $this->runningBalance -= $transaction->amount;
+        }
+
+        return [
+            Carbon::parse($transaction->created_at)->format('d-m-Y h:i:s A'),
+            $description,
+            $incoming,
+            $outgoing,
+            number_format($this->runningBalance, $decimals, '.', ',')
+        ];
+    }
+}
diff --git a/app/Classes/Modules/Transactions/ControllersLogic/ListWalletTransactionsLogic.php b/app/Classes/Modules/Transactions/ControllersLogic/ListWalletTransactionsLogic.php
new file mode 100644
index 00000000..af51b2e9
--- /dev/null
+++ b/app/Classes/Modules/Transactions/ControllersLogic/ListWalletTransactionsLogic.php
@@ -0,0 +1,79 @@
+<?php
+
+
+namespace App\Classes\Modules\Transactions\ControllersLogic;
+
+use App\Classes\General\Abstracts\AbstractControllerLogic;
+use App\Classes\Modules\Transactions\Services\ListsTransactions;
+use App\Classes\ValueObjects\Constants\ApprovalStatus;
+use App\Classes\ValueObjects\Constants\TransactionType;
+use App\Http\Resources\WalletTransactionResource ;
+use App\Models\Transaction;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+class ListWalletTransactionsLogic extends AbstractControllerLogic
+{
+    /**
+     * ListTransactionsLogic constructor.
+     * @param ListsTransactions $listsTransactions
+     */
+    public function __construct(ListsTransactions $listsTransactions)
+    {
+        $this->listsTransactions = $listsTransactions;
+    }
+
+    /**
+     * @return array
+     */
+    protected function notification():array {
+        return [
+            'title' => 'Retrieved Wallet Transactions',
+            'message' => 'You have successfully retrieved a list of transactions'
+        ];
+    }
+
+    /** @var ListsTransactions */
+    private $listsTransactions;
+
+    public function logic(Request $request) : JsonResponse
+    {
+        $query = $this->listsTransactions->execute($this->listsTransactions->deserializeFilters($request->input('filters')));
+
+        if (str_contains($request->input('filters'), "owner_id") && $query->count() > 0) {
+            $wallet_total_incoming = Transaction::where('owner_type', $query->first()->owner_type)
+                ->where('owner_id', $query->first()->owner_id)
+                ->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])
+                ->whereIn('type', [TransactionType::TOP_UP, TransactionType::CREDIT_NOTE, TransactionType::GROUP_PAYMENT])
+                ->sum('amount');
+            
+            $wallet_total_outgoing = Transaction::where('owner_type', $query->first()->owner_type)
+                ->where('owner_id', $query->first()->owner_id)
+                ->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])
+                ->whereIn('type', [TransactionType::PAYMENT, TransactionType::DEBIT_NOTE])
+                ->sum('amount');
+
+            $currentWalletBalance = $wallet_total_incoming - $wallet_total_outgoing;
+            $incoming = Transaction::where('owner_type', $query->first()->owner_type)
+                ->where('owner_id', $query->first()->owner_id)
+                ->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])
+                ->whereIn('type', [TransactionType::TOP_UP, TransactionType::CREDIT_NOTE, TransactionType::GROUP_PAYMENT])
+                ->where('id', '>', $query->first()->id)
+                ->sum('amount');
+            $outgoing = Transaction::where('owner_type', $query->first()->owner_type)
+                ->where('owner_id', $query->first()->owner_id)
+                ->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])
+                ->whereIn('type', [TransactionType::PAYMENT, TransactionType::DEBIT_NOTE])
+                ->where('id', '>', $query->first()->id)
+                ->sum('amount');
+            $runningBalanceInReverse = $currentWalletBalance - $incoming + $outgoing;
+            $request['running_balance'] = $runningBalanceInReverse;
+        }
+
+        return $this->collectionResponse(WalletTransactionResource::collection($query));
+
+    }
+
+
+
+}
diff --git a/app/Http/Controllers/Exports/ExportCustomersWalletTransactionToExcelController.php b/app/Http/Controllers/Exports/ExportCustomersWalletTransactionToExcelController.php
new file mode 100644
index 00000000..742c4be1
--- /dev/null
+++ b/app/Http/Controllers/Exports/ExportCustomersWalletTransactionToExcelController.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Http\Controllers\Exports;
+
+use App\Classes\Modules\Exports\Services\ExportsCustomersWalletTransactionHistory;
+use App\Models\User;
+use App\Models\Wallet;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Maatwebsite\Excel\Excel;
+
+class ExportCustomersWalletTransactionToExcelController
+{
+
+    /**
+     * ExportCustomersWalletTransactionToExcelController constructor.
+     * @param Request $request
+     */
+    public function __construct(Request $request)
+    {
+        $token = Auth::fromUser(User::find(1));
+        $request->headers->set('Authorization', 'Bearer ' . $token);
+    }
+
+    public function export(Request $request)
+    {
+        $exportsTransactions = new ExportsCustomersWalletTransactionHistory($request);
+        $wallet = Wallet::find($request->route('wallet_id'));
+        $company_marking = $wallet->owner->connections->first()->invitee_reference;
+
+        $filename = $company_marking . '-wallet-' . ($request->route('is_precise') == 'true' ? 'precise-' : '') . 'transaction-history.xls';
+        $response = $exportsTransactions->download($filename, Excel::XLS, ['Content-Type' => 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']);
+        ob_end_clean();
+        return $response;
+    }
+}
diff --git a/app/Http/Controllers/Transactions/ListWalletTransactionsController.php b/app/Http/Controllers/Transactions/ListWalletTransactionsController.php
new file mode 100644
index 00000000..e83d7b58
--- /dev/null
+++ b/app/Http/Controllers/Transactions/ListWalletTransactionsController.php
@@ -0,0 +1,21 @@
+<?php
+
+
+namespace App\Http\Controllers\Transactions;
+
+use App\Classes\Modules\Transactions\ControllersLogic\ListWalletTransactionsLogic;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+
+class ListWalletTransactionsController
+{
+    /**
+     * @param Request $request
+     * @param ListWalletTransactionsLogic $logic
+     * @return JsonResponse
+     */
+    public function list(Request $request, ListWalletTransactionsLogic $logic) : JsonResponse {
+        return $logic->execute($request);
+    }
+}
diff --git a/app/Http/Resources/WalletTransactionResource.php b/app/Http/Resources/WalletTransactionResource.php
index b668c053..2550a061 100644
--- a/app/Http/Resources/WalletTransactionResource.php
+++ b/app/Http/Resources/WalletTransactionResource.php
@@ -20,12 +20,15 @@ class WalletTransactionResource extends JsonResource
     public function toArray($request)
     {
         $description = '';
+        $current_running_balance = $request['running_balance'];
         switch((int) $this->type){
             case TransactionType::TOP_UP:
                 $description = (double) $this->amount.' Credit Top up';
+                $request['running_balance'] = bcsub($request['running_balance'], $this->amount, 5);
                 break;
             case TransactionType::CREDIT_NOTE:
                 $description = 'Credit Voucher for '.$this->payment_reference;
+                $request['running_balance'] = bcsub($request['running_balance'], $this->amount, 5);
                 break;
             case TransactionType::PAYMENT:
                 $invoice = Transaction::where('payment_reference', $this->bill_no)->first();
@@ -40,13 +43,16 @@ class WalletTransactionResource extends JsonResource
                     break;
                 }
 
+                $request['running_balance'] = bcadd($request['running_balance'], $this->amount, 5);
                 $marking = $order->reference;
                 $description = 'Payment For order refs.'.'<a href="'.route('order.details', $marking).'">'.$marking.'</a>';
                 break;
             case 11:
+                $request['running_balance'] = bcadd($request['running_balance'], $this->amount, 5);
                 $description = 'Debit Voucher for '.$this->payment_reference;
                 break;
             case 15:
+                $request['running_balance'] = bcsub($request['running_balance'], $this->amount, 5);
                 $description = (double) $this->amount.' Credit Top up';
                 break;
 
@@ -61,6 +67,7 @@ class WalletTransactionResource extends JsonResource
             'payment_method' => (float) $this->payment_method,
             // 'issuer_name' => $this->issuerCompany->name,
             'amount' => (double) $this->amount,
+            'running_balance' => (double) $current_running_balance,
             'service_charge' => (double) $this->service_charge,
             'tax' => (double) $this->tax,
             'status' => (int) $this->status,
diff --git a/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue b/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
index d60032e0..7ad12009 100644
--- a/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
+++ b/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
@@ -9,6 +9,43 @@
                             <h6>Transaction History</h6>
                         </div>
                     </div>
+                    <div class="row m-t-10 m-b-10">
+                        <div class="col">
+                            <div class="d-flex align-items-center h-100">
+                                <span class="btn btn-md fs-11 bg-primary text-white fs-12 m-r-5" :class="[{'bg-primary-darker': showingPreciseAmount}]" @click="showingPreciseAmount=!showingPreciseAmount">{{ showingPreciseAmount ? 'Showing Precise Wallet Transaction' : 'Show Precise Wallet Transaction'}}</span>
+                                <a v-if="wallet" :href="route('wallet.details-export', wallet.id, showingPreciseAmount)" target="_blank" class="btn btn-md btn-primary fs-11"><i class="fa fa-download m-r-5"></i>{{ showingPreciseAmount ? 'Download Precise Transaction' : 'Download Transaction'}}</a>
+                            </div>
+                        </div>
+                        <div class="col-3">
+                            <validation-wrapper-component selectable :validator="$v.showingTransactionCount">
+                                <label>Showing Rows</label>
+                                <select-component :options="[5, 10, 20, 30, 50]" v-model="showingTransactionCount"></select-component>
+                            </validation-wrapper-component>
+                        </div>
+                    </div>
+                    <div class="row m-b-5" @keyup.enter="submitSearch">
+                        <div class="col p-r-0">
+                            <validation-wrapper-component :validator="$v.reference_no">
+                                <label class="all-caps">Order Reference</label>
+                                <input type="text" class="form-control" v-model="reference_no">
+                            </validation-wrapper-component>
+                        </div>
+                        <div class="col p-r-0">
+                            <validation-wrapper-component :validator="$v.startDate">
+                                <label class="all-caps">Start Date</label>
+                                <date-picker-component v-model.lazy="startDate"></date-picker-component>
+                            </validation-wrapper-component>
+                        </div>
+                        <div class="col p-r-0">
+                            <validation-wrapper-component :validator="$v.endDate">
+                                <label class="all-caps">End Date</label>
+                                <date-picker-component v-model.lazy="endDate"></date-picker-component>
+                            </validation-wrapper-component>
+                        </div>
+                        <div class="col col-md-auto d-flex justify-content-center align-items-center">
+                            <button type="button" class="btn btn-lg btn-primary fs-11 w-100" @click="submitSearch()">Search</button>
+                        </div>
+                    </div>
                     <div class="row" v-if="wallet.transactions">
                         <div class="col">
                             <div class="row padding-10">
@@ -19,13 +56,11 @@
                                 <div class="col-2 fs-10 text-right">Balance</div>
                             </div>
 
-                            <div class="row bg-white padding-10 m-b-10 rounded align-items-center" v-for="(item, index) in wallet.transactions" v-bind:key="item.id" :data="item">
-                                <div class="col-3 fs-12">{{item.created_at}}</div>
-                                <div class="col fs-12"><span v-html="item.description"></span> <a target=”_blank” v-if="[9,11].includes(item.type) " :href="route('transaction.credit_note.download', item.id)"><i class="fa fa-download fs-11 m-l-5 text-secondary hover-primary"></i></a></div>
-                                <div class="col-2 text-success text-center">{{[5, 9, 15].includes(parseFloat(item.type)) ? (Math.round((parseFloat(item.amount) + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : ''}}</div>
-                                <div class="col-2 text-danger text-center">{{[2, 11].includes(parseFloat(item.type)) ? '- ' + (Math.round((parseFloat(item.amount) + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : ''}}</div>
-                                <div class="col-2 text-right">{{remainingBalance(index)}}</div>
-                            </div>  
+                            <list-component :key="key" section="walletTransactionSection" :endpoint="route('api.transaction.wallet.list')" :options="options">
+                                <template slot="list" slot-scope="{data}">
+                                    <customer-wallet-transaction-component :data="data" :showingPreciseAmount="showingPreciseAmount" ></customer-wallet-transaction-component>
+                                </template>
+                            </list-component>
                         </div>
                     </div>
 
@@ -103,10 +138,22 @@ export default {
     },
     data(){
         return {
+            key: 1,
             section: 'customerTransactionSection',
             isLoading: true,
             wallet: null,
-            attention: false
+            showingPreciseAmount: false,
+            showingTransactionCount: 10,
+            attention: false,
+            reference_no: null,
+            startDate: null,
+            endDate: null,
+            options: {
+                status_in: [2, 3], 
+                owner_type: 'App\\Models\\Wallet', 
+                owner_id: 0, 
+                per_page: this.showingTransactionCount
+            }
         }
     },
     computed: {
@@ -119,8 +166,17 @@ export default {
             if(inComplete){
                 this.fetchWallet();
             }
+        },
+        showingTransactionCount() {
+            this.key ++;
         }
     },
+    validations: {
+        showingTransactionCount: {  },
+        reference_no: {  },
+        startDate: {  },
+        endDate: {  },
+    },
     created(){
         this.$store.dispatch('updateListQueue', {'name': this.section});
     },
@@ -130,22 +186,29 @@ export default {
             var filters = {with_transactions: true};
             this.submit(route('api.wallet.company_module.show', this.id) + '?filters=' + JSON.stringify(filters), 'get', this.section, false, false);
         },
-        remainingBalance(index) {
-            let tempBalance = 0;
+        submitSearch() {
+            console.log("searcvhing");
+            delete this.options.with_order_reference_like;
+            delete this.options.created_after_or_equal;
+            delete this.options.created_before_or_equal;
 
-            if(this.wallet){
-                let transactions = this.wallet.transactions.slice().reverse();
-                transactions.slice(0, transactions.length - index).map(function(transaction) {
-                    [2, 11].includes(transaction.type) ? tempBalance -= (transaction.amount) : tempBalance += (transaction.amount);
-                    return tempBalance
-                }, 0);
+            if (this.reference_no) {
+                this.options.with_order_reference_like = this.reference_no
             }
-
-            return (Math.round((tempBalance + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+            if (this.startDate) {
+                this.options.created_after_or_equal = this.startDate
+            }
+            if (this.endDate) {
+                this.options.created_before_or_equal = this.endDate
+            }
+            
+            this.key ++;
         },
         successHandler(response){
             this.isLoading = false;
             this.wallet = response.payload.data;
+            this.options.owner_id = this.wallet.id
+            this.key ++;
         }
     }
 }
diff --git a/resources/assets/vue/components/wallets/elements/CustomerWalletTransactionComponent.vue b/resources/assets/vue/components/wallets/elements/CustomerWalletTransactionComponent.vue
new file mode 100644
index 00000000..cb0bb88f
--- /dev/null
+++ b/resources/assets/vue/components/wallets/elements/CustomerWalletTransactionComponent.vue
@@ -0,0 +1,35 @@
+<template>
+    <div class="row bg-white padding-10 m-b-10 rounded align-datas-center">
+        <div class="col-3 fs-12">{{data.created_at}}</div>
+        <div class="col fs-12"><span v-html="data.description"></span> <a target=”_blank” v-if="[9,11].includes(data.type) " :href="route('transaction.credit_note.download', data.id)"><i class="fa fa-download fs-11 m-l-5 text-secondary hover-primary"></i></a></div>
+        <div class="col-2 text-success text-center">{{[5, 9, 15].includes(parseFloat(data.type)) ? formatValue(data.amount) : ''}}</div>
+        <div class="col-2 text-danger text-center">{{[2, 11].includes(parseFloat(data.type)) ? '- ' + formatValue(data.amount, ) : ''}}</div>
+        <div class="col-2 text-right">{{formatValue(data.running_balance)}}</div>
+    </div> 
+</template>
+<script>
+    import componentHandler from '../../../general/mixins/componentHandler';
+
+    export default {
+        props: {
+            data: {
+                required: true,
+                type: Object
+            },
+            showingPreciseAmount: {
+                type: Boolean,
+                required: true
+            },
+        },
+        methods: {
+            formatValue(value) {
+                if (this.showingPreciseAmount) {
+                    return (Math.round((parseFloat(value) + Number.EPSILON) * 100000) / 100000).toLocaleString('en-US', { minimumFractionDigits: 5, maximumFractionDigits: 5 });
+                }
+
+                return (Math.round((parseFloat(value) + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
+            }
+        },
+        mixins: [componentHandler],
+    }
+</script>
\ No newline at end of file
diff --git a/routes/transaction.php b/routes/transaction.php
index 9f770be8..07a1cf1c 100644
--- a/routes/transaction.php
+++ b/routes/transaction.php
@@ -10,6 +10,8 @@ Route::group(['prefix' => 'transactions', 'namespace' => 'Transactions', 'as' =>
     Route::delete('/delete-payment/{id}', 'DeletePaymentTransactionController@delete')->name('payment.delete');
     Route::put('{id}/status/update/{status}', 'UpdateTransactionStatusController@update')->where('status', 'approve|expire|reject')->name('update');
 
+    Route::get('wallet/list', 'ListWalletTransactionsController@list')->name('wallet.list');
+
     Route::group(['prefix' => 'payment', 'as' => 'payment.'], function () {
         Route::post('/create', 'CreatePaymentTransactionController@create')->name('create');
         Route::post('/upload-verification-document/{transaction_id}', 'UploadPaymentVerificationDocumentController@upload')->name('verification.create');
diff --git a/routes/web.php b/routes/web.php
index edb799cc..ab9f5f3e 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1069,6 +1069,8 @@ Route::get('/wallet/{marking}/details', function ($marking) {
     return view('pages.wallet.index', ['id' => $id, 'marking' => $marking]);
 })->name('wallet.details');
 
+Route::get('/wallet/{wallet_id}/{is_precise}/export', 'Exports\ExportCustomersWalletTransactionToExcelController@export')->name('wallet.details-export');
+
 Route::get('/wallet/audit', function (Request $request) {
     $wallets = \App\Models\Wallet::all();