diff --git a/app/Classes/Modules/Billplzs/ControllersLogic/CallbackBillplzLogic.php b/app/Classes/Modules/Billplzs/ControllersLogic/CallbackBillplzLogic.php
index ae8ae28f..e9daa5f1 100644
--- a/app/Classes/Modules/Billplzs/ControllersLogic/CallbackBillplzLogic.php
+++ b/app/Classes/Modules/Billplzs/ControllersLogic/CallbackBillplzLogic.php
@@ -44,6 +44,9 @@ class CallbackBillplzLogic
     /** @var UpdateDoFromYDPortalProcessor */
     private $updateDoFromYDPortalProcessor ;
 
+    /** @var UpdatesWalletBalance */
+    private $updatesWalletBalance;
+
     /**
      * CallbackBillplzLogic constructor.
      * @param GetBillplzBill $getBillplzBill
@@ -52,13 +55,14 @@ class CallbackBillplzLogic
      * @param UpdateDoFromVTPortalProcessor $updateDoFromVTPortalProcessor
      * @param UpdateDoFromYDPortalProcessor $updateDoFromYDPortalProcessor
      */
-    public function __construct(GetBillplzBill $getBillplzBill, FetchesTransaction $fetchesTransaction, UpdatesTransactionStatus $updatesTransactionStatus, UpdateDoFromVTPortalProcessor $updateDoFromVTPortalProcessor, UpdateDoFromYDPortalProcessor $updateDoFromYDPortalProcessor)
+    public function __construct(GetBillplzBill $getBillplzBill, FetchesTransaction $fetchesTransaction, UpdatesTransactionStatus $updatesTransactionStatus, UpdateDoFromVTPortalProcessor $updateDoFromVTPortalProcessor, UpdateDoFromYDPortalProcessor $updateDoFromYDPortalProcessor, UpdatesWalletBalance $updatesWalletBalance)
     {
         $this->getBillplzBill = $getBillplzBill;
         $this->fetchesTransaction = $fetchesTransaction;
         $this->updatesTransactionStatus = $updatesTransactionStatus;
         $this->updateDoFromVTPortalProcessor = $updateDoFromVTPortalProcessor;
         $this->updateDoFromYDPortalProcessor = $updateDoFromYDPortalProcessor;
+        $this->updatesWalletBalance = $updatesWalletBalance;
     }
 
 
@@ -101,9 +105,14 @@ class CallbackBillplzLogic
         $token = Auth::fromUser(User::find(1));
         $request->headers->set('Authorization', 'Bearer '.$token);
 
+        // check if is wallet top up
+        if($transaction->owner instanceof Wallet && $transaction->status !== ApprovalStatus::APPROVED) {
+            $this->updatesWalletBalance->execute($transaction->owner, $transaction->amount);
+        }
+        
         $this->updatesTransactionStatus->execute($transaction, ApprovalStatus::APPROVED);
 
-        if(($invoice->amount - $transaction->amount) < 0.01) {
+        if(($invoice->amount - $transaction->amount) < 0.01 && !$transaction->owner instanceof Wallet) {
             $this->updatesTransactionStatus->execute($invoice, ApprovalStatus::COMPLETED);
 
             $packingList->status = ApprovalStatus::APPROVED;
diff --git a/app/Classes/Modules/Wallets/ControllersLogic/FetchWalletByCompanyModuleControllerLogic.php b/app/Classes/Modules/Wallets/ControllersLogic/FetchWalletByCompanyModuleControllerLogic.php
index 8a97929c..6a7c9515 100644
--- a/app/Classes/Modules/Wallets/ControllersLogic/FetchWalletByCompanyModuleControllerLogic.php
+++ b/app/Classes/Modules/Wallets/ControllersLogic/FetchWalletByCompanyModuleControllerLogic.php
@@ -24,7 +24,7 @@ class FetchWalletByCompanyModuleControllerLogic extends AbstractControllerLogic
     protected function notification():array {
         return [
             'title' => 'Retrieved Wallet',
-            'message' => 'You have successfully created a wallet'
+            'message' => 'You have successfully retrieved a wallet'
         ];
     }
 
@@ -78,7 +78,11 @@ class FetchWalletByCompanyModuleControllerLogic extends AbstractControllerLogic
             return $this->resourceResponse(new WalletResource($wallet));
         }
 
-        $query = $this->fetchesWallet->execute(['owner_id' => $request->route('company_module_id')]);
+        $filters = $this->fetchesWallet->deserializeFilters($request->input('filters'));
+
+        $filters['owner_id'] = $request->route('company_module_id');
+
+        $query = $this->fetchesWallet->execute($filters);
 
         return $this->resourceResponse(new WalletResource($query));
     }
diff --git a/resources/assets/vue/components/companies/elements/CustomerPaymentBillingInnerComponent.vue b/resources/assets/vue/components/companies/elements/CustomerPaymentBillingInnerComponent.vue
index 1bbf3d5d..8ec98df2 100644
--- a/resources/assets/vue/components/companies/elements/CustomerPaymentBillingInnerComponent.vue
+++ b/resources/assets/vue/components/companies/elements/CustomerPaymentBillingInnerComponent.vue
@@ -6,7 +6,7 @@
                     <div v-show="!$store.getters.isLoading(section)">
                         <list-component :section="section" :endpoint="route('api.transaction.list')" :options="options">
                             <template slot="list" slot-scope="{data}">
-                                <payments-billing-components :data="data" :selectedInvoice="selectedInvoice" v-on:input="updateList($event)"></payments-billing-components>
+                                <payments-billing-components :section="section" :data="data" :selectedInvoice="selectedInvoice" v-on:input="updateList($event)"></payments-billing-components>
                             </template>
                         </list-component>
                     </div>
@@ -59,10 +59,10 @@
                             </div>
                         </div>
                     </div>
-                    <div class="row">
+                    <div class="row" v-if="selectedInvoice.length">
                         <div class="col">
-                            <div v-if="section === 'customerPendingPaymentInvoiceComponent'" class="btn btn-xl btn-success pointer m-t-10 w-100" @click='makePayment'>Make Payment</div>
-                            <div v-if="section === 'customerPaidInvoiceComponent'" class="btn btn-xl btn-success pointer m-t-10 w-100" @click='generateSummaryInvoice'>Generate Summary Invoice</div>
+                            <div v-if="section === 'customerPendingPaymentInvoiceComponent'" class="btn btn-success btn-xl pointer m-t-10 w-100" @click='makePayment'>Make Payment</div>
+                            <div v-if="section === 'customerPaidInvoiceComponent'" class="btn btn-info btn-xl pointer m-t-10 w-100" @click='generateSummaryInvoice'>Generate Summary Invoice</div>
                         </div>
                     </div>
                 </div>
diff --git a/resources/assets/vue/components/paymentsBilling/elements/PaymentsBillingComponents.vue b/resources/assets/vue/components/paymentsBilling/elements/PaymentsBillingComponents.vue
index 4c27be29..b3c896b7 100644
--- a/resources/assets/vue/components/paymentsBilling/elements/PaymentsBillingComponents.vue
+++ b/resources/assets/vue/components/paymentsBilling/elements/PaymentsBillingComponents.vue
@@ -28,7 +28,7 @@
                                 <div v-for="file in item.documents[0].files" v-bind:key="file.id" class="col-auto no-padding">
                                     <document-file-viewer-component :file="file">
                                         <template slot="button">
-                                            <div class="btn btn-success no-border muted">
+                                            <div class="btn no-border muted" :class="{'btn-info': section === 'customerPaidInvoiceComponent', 'btn-success': section !== 'customerPaidInvoiceComponent'}">
                                                 <i class="fa fa-file-pdf-o"></i>
                                             </div>
                                         </template>
@@ -54,7 +54,11 @@
             selectedInvoice: {
                 type: Array,
                 required: false,
-            }  
+            }, 
+            section:{
+                type: String,
+                default: null
+            },
         },
         data(){
             return {
diff --git a/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue b/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
index 25577b5c..4f41552c 100644
--- a/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
+++ b/resources/assets/vue/components/wallets/elements/CustomerTransactionSectionComponent.vue
@@ -2,14 +2,14 @@
     <div class="row">
         <div class="col">
             <loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="isLoading"></loading-component>
-            <div class="row" v-if="company">
-                <div class="col-8">
-                    <div class="row p-b-5 b-b b-grey m-b-10 m-l-0 m-r-0">
+            <div class="row m-l-5 m-t-15" v-if="wallet">
+                <div class="col-8 p-r-30">
+                    <div class="row p-b-5 b-b b-grey m-b-10 m-l-0 m-r-0 padding-15">
                         <div class="col no-padding">
                             <h6>Transaction History</h6>
                         </div>
                     </div>
-                    <div class="row" v-if="company.wallet">
+                    <div class="row" v-if="wallet.transactions">
                         <div class="col">
                             <div class="row padding-10">
                                 <div class="col-3 fs-10">Date</div>
@@ -19,7 +19,7 @@
                                 <div class="col-2 fs-10 text-right">Balance</div>
                             </div>
 
-                            <div class="row bg-white padding-10 m-b-10 rounded" v-for="(item, index) in company.wallet.transactions" v-bind:key="item.id" :data="item">
+                            <div class="row bg-white padding-10 m-b-10 rounded" 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" v-html="item.description"></div>
                                 <div class="col-2 text-success text-center">{{[5, 9].includes(parseFloat(item.type)) ? (Math.round((parseFloat(item.amount) + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : ''}}</div>
@@ -29,8 +29,8 @@
                         </div>
                     </div>
 
-                    <div class="row align-items-center justify-content-center p-t-50 p-b-50" v-if="!company.wallet || !company.wallet.transactions.length">
-                        <div class="col-10">
+                    <div class="row align-items-center justify-content-center p-t-50 p-b-50" v-if="!wallet.transactions || !wallet.transactions.length">
+                        <div class="col-12">
                             <div class="row align-items-center justify-content-center hint-text">
                                 <div class="col-4 hint-text"><img src="/images/not-found-illustration.png" class="w-100 hint-text"></div>
                             </div>
@@ -51,8 +51,8 @@
                         </div>
                     </div>
                 </div>
-                <div class="col-3 m-l-15">
-                    <wallet-component :data="company" :creditable=true></wallet-component>
+                <div class="col-4">
+                    <wallet-component :data="wallet" :company_module_id="id" section="CompanyWalletTransactionSection"></wallet-component>
                     <div class="row m-t-20">
                         <div class="col">
                             <div class="row m-b-10">
@@ -60,12 +60,12 @@
                                     <div class="font-head fs-10 all-caps">Top Up Records</div>
                                 </div>
                             </div>
-                            <div class="row" v-if="company.wallet">
+                            <div class="row">
                                 <div class="col">
-                                    <wallet-top-up-history-component v-for="item in company.wallet.top_up_records" v-bind:key="item.id" :data="item"></wallet-top-up-history-component>
+                                    <wallet-top-up-history-component v-for="item in wallet.top_up_records" v-bind:key="item.id" :data="item"></wallet-top-up-history-component>
                                 </div>
                             </div>
-                            <div class="row align-items-center justify-content-center p-t-50 p-b-50" v-if="!company.wallet || !company.wallet.top_up_records.length">
+                            <div class="row align-items-center justify-content-center p-t-50 p-b-50" v-if="!wallet.top_up_records.length">
                                 <div class="col-10">
                                     <div class="row align-items-center justify-content-center hint-text">
                                         <div class="col-4 hint-text"><img src="/images/not-found-illustration.png" class="w-100 hint-text"></div>
@@ -99,13 +99,13 @@ export default {
         id: {
             type: Number,
             required: true
-        }
+        },
     },
     data(){
         return {
             section: 'customerTransactionSection',
             isLoading: true,
-            company: null,
+            wallet: null,
             attention: false
         }
     },
@@ -117,7 +117,7 @@ export default {
     watch: {
         pendingQueue(inComplete){
             if(inComplete){
-                this.fetchCompany();
+                this.fetchWallet();
             }
         }
     },
@@ -125,15 +125,16 @@ export default {
         this.$store.dispatch('updateListQueue', {'name': this.section});
     },
     methods: {
-        fetchCompany(){
+        fetchWallet(){
             this.isLoading = true;
-            this.submit(route('api.company.show', this.id), 'get', this.section, false, false)
+            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;
 
-            if(this.company.wallet){
-                let transactions = this.company.wallet.transactions.slice().reverse();
+            if(this.wallet){
+                let transactions = this.wallet.transactions.slice().reverse();
                 transactions.slice(0, transactions.length - index).map(function(transaction) {
                     [1, 11].includes(transaction.type) ? tempBalance -= (transaction.amount) : tempBalance += (transaction.amount);
                     return tempBalance
@@ -144,7 +145,7 @@ export default {
         },
         successHandler(response){
             this.isLoading = false;
-            this.company = response.payload.data;
+            this.wallet = response.payload.data;
         }
     }
 }
diff --git a/resources/assets/vue/components/wallets/elements/WalletComponent.vue b/resources/assets/vue/components/wallets/elements/WalletComponent.vue
index f36f865f..e3d61d0d 100644
--- a/resources/assets/vue/components/wallets/elements/WalletComponent.vue
+++ b/resources/assets/vue/components/wallets/elements/WalletComponent.vue
@@ -1,35 +1,41 @@
 <template>
-    <!-- <div class="row parentContainer" v-if="item.status === 2"> -->
-    <div class="row parentContainer">
+    <div class="row">
         <div class="col">
-            <div class="row" v-if="!reload && section !== 'customerPaidInvoiceComponent'">
+            <loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
+            <!-- <div class="row parentContainer" v-if="item.status === 2"> -->
+            <div class="row parentContainer" v-if="!isLoading">
                 <div class="col">
-                    <div class="bg-primary" :class="[{'padding-25': !mini}, {'padding-15': mini}]">
-                        <div class="row align-items-end">
-                            <div class="col-auto">
-                                <div class="text-primary-lighter fs-10 text-uppercase">Wallet Balance</div>
-                                <h5 class="text-white no-margin bold">MYR {{ wallet ? (Math.round((wallet.amount + Number.EPSILON) * 100) / 100).toFixed(2) : '0.00'}}</h5>
-                            </div>
-                        </div>
-                        <div class="row m-t-10 d-flex align-items-center">
-                            <div class="col-auto">
-                                <div class="btn btn-xs p-l-15 p-r-20 b-rad-none font-heading btn-rounded bg-white" @click="reload = true"><i class="fa fa-plus fs-8 m-r-5"></i> Reload</div>
-                            </div>
-                            <div class="col-auto p-l-0" v-if="!mini && wallet">
-                                <a class="text-white fs-10" :href="route('wallet.details', wallet.company_module_marking)" target="_blank">Transaction History<i class="fa fa-angle-right p-l-5"></i></a>
+                    <div class="row" v-if="!reload && section !== 'customerPaidInvoiceComponent'">
+                        <div class="col">
+                            <div class="bg-primary" :class="[{'padding-25': !mini}, {'padding-15': mini}]">
+                                <div class="row align-items-end">
+                                    <div class="col-auto">
+                                        <div class="text-primary-lighter fs-10 text-uppercase">Wallet Balance</div>
+                                        <h5 class="text-white no-margin bold">MYR {{ wallet ? (Math.round((wallet.amount + Number.EPSILON) * 100) / 100).toFixed(2) : '0.00'}}</h5>
+                                    </div>
+                                </div>
+                                <div class="row m-t-10 d-flex align-items-center">
+                                    <div class="col-auto">
+                                        <div class="btn btn-xs p-l-15 p-r-20 b-rad-none font-heading btn-rounded bg-white" @click="reload = true"><i class="fa fa-plus fs-8 m-r-5"></i> Reload</div>
+                                    </div>
+                                    <div class="col-auto p-l-0" v-if="!mini && wallet && section!=='CompanyWalletTransactionSection'">
+                                        <!-- <a class="text-white fs-10" :href="route('wallet.details', wallet.company_module_marking)" target="_blank">Transaction History<i class="fa fa-angle-right p-l-5"></i></a> -->
+                                        <a class="text-white fs-10" :href="route('wallet.details', wallet.company_module_marking)">Transaction History<i class="fa fa-angle-right p-l-5"></i></a>
+                                    </div>
+                                </div>
                             </div>
                         </div>
                     </div>
-                </div>
-            </div>
-            <div class="row no-margin" v-if="reload && company_module_id">
-                <div class="col rounded bg-white p-b-15">
-                    <div class="row m-b-15">
-                        <div class="col p-t-15 p-b-15 bg-primary">
-                            <label class="fs-10 text-white m-b-0 text-uppercase cursor" @click="reload = false"><i class="fa fa-angle-left p-r-15"></i>Top Up Wallet</label>
+                    <div class="row no-margin" v-if="reload && company_module_id">
+                        <div class="col rounded bg-white p-b-15">
+                            <div class="row m-b-15">
+                                <div class="col p-t-15 p-b-15 bg-primary">
+                                    <label class="fs-10 text-white m-b-0 text-uppercase cursor" @click="reload = false"><i class="fa fa-angle-left p-r-15"></i>Top Up Wallet</label>
+                                </div>
+                            </div>
+                            <wallet-top-up-form-component :company_module_id="company_module_id" :amount="(!wallet ? amount : (Math.round((((amount - wallet.amount) < '0.00' ? '0.00' : (amount - wallet.amount))  + Number.EPSILON) * 100) / 100).toFixed(2))" :creditable="creditable"></wallet-top-up-form-component>
                         </div>
                     </div>
-                    <wallet-top-up-form-component :company_module_id="company_module_id" :amount="(!wallet ? amount : (Math.round((((amount - wallet.amount) < '0.00' ? '0.00' : (amount - wallet.amount))  + Number.EPSILON) * 100) / 100).toFixed(2))" :creditable="creditable"></wallet-top-up-form-component>
                 </div>
             </div>
         </div>
@@ -61,12 +67,17 @@
                 type: Number,
                 required: true,
             },
+            data: {
+                default () {
+                    return {}
+                }
+            },
         },
         data(){
             return {
                 reload: false,
-                isLoading: true,
-                wallet: null,
+                isLoading: false,
+                wallet: this.data,
             }
         },
         computed: {
@@ -76,7 +87,7 @@
         },
         watch: {
             pendingQueue(inComplete){
-                if(inComplete){
+                if(inComplete && this.section !== 'CompanyWalletTransactionSection'){
                     this.fetchCompany();
                 }
             }
diff --git a/resources/views/layouts/base_portal.blade.php b/resources/views/layouts/base_portal.blade.php
index f437664d..e6bec7e5 100644
--- a/resources/views/layouts/base_portal.blade.php
+++ b/resources/views/layouts/base_portal.blade.php
@@ -17,7 +17,7 @@
                                 <div class="col col-md-9">
                                     <div class="absolute bg-master w-100 h-100" style="opacity: 0.3; z-index:9998; left:0;" v-if="$store.getters.isShowing('sideMenu')"></div>
                                     @include('partials.header')
-                                    <div class="row no-margin p-b-50">
+                                    <div class="row no-margin p-b-50 h-100">
                                         <div class="col p-t-15 p-b-25">
                                             @yield('inner_content')
                                         </div>
diff --git a/resources/views/pages/wallet/transactions.blade.php b/resources/views/pages/wallet/transactions.blade.php
index ce31dec6..67a479d5 100644
--- a/resources/views/pages/wallet/transactions.blade.php
+++ b/resources/views/pages/wallet/transactions.blade.php
@@ -1,4 +1,5 @@
-<div class="row">
+<a class="fs-14 m-b-15 d-block" :href="route('customer.payment-and-billing', '{{$marking}}')"><i class="fa fa-angle-left p-r-5"></i>Back to Payment and Billing</a>
+<div class="row bg-master-lightest h-100">
     <div class="col">
         <customer-transaction-section-component :id="{{$id}}"></customer-transaction-section-component>
     </div>
diff --git a/routes/web.php b/routes/web.php
index cd05ba71..91159d1f 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -959,6 +959,33 @@ Route::get('/packing-lists/delete-duplicated', function(Request $request){
 Route::get('/wallet/{marking}/details', function ($marking) {
     $connection = CompanyConnection::where('invitee_reference', $marking)->first();
     $id = $connection->invitee->id;
-    return view('pages.wallet.index', ['id' => $id]);
+    return view('pages.wallet.index', ['id' => $id, 'marking' => $marking]);
 })->name('wallet.details');
 
+Route::get('/wallet/audit', function (Request $request) {
+    $wallets = \App\Models\Wallet::all();
+
+    $i = 0;
+    foreach ($wallets as $wallet){
+        $topups = 0;
+        $credit = 0;
+        $payments = 0;
+        $debit = 0;
+
+        foreach ($wallet->transactions as $transaction){
+            if(!in_array((int) $transaction->status, [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])) continue;
+            if((int) $transaction->type === TransactionType::TOP_UP) {
+                $topups += (float) $transaction->amount;
+            }
+            if((int) $transaction->type === TransactionType::CREDIT_NOTE) $credit += (float) $transaction->amount;
+            if((int) $transaction->type === TransactionType::PAYMENT) $payments += (float) $transaction->amount;
+            if((int) $transaction->type === TransactionType::DEBIT_NOTE) $debit += (float) $transaction->amount;
+        }
+        if((round((float) $wallet->amount - (($topups + $credit) - ($payments + $debit)), 2) == 0) AND $wallet->amount > -0.01) continue;
+
+        $i++;
+
+        echo $i.". Marking: ". $wallet->owner->connections->first()->invitee_reference ."(".$wallet->id.")<br>Current Balance: ". $wallet->amount ."<br>Audit Balance: ". (($topups + $credit) - ($payments + $debit)) ."<br>Difference: ". round((float) $wallet->amount - (($topups + $credit) - ($payments + $debit)), 2) ."<br><br><br>";
+    }
+});
+