diff --git a/app/Classes/General/Eloquent/Filters/WithTotalPayments.php b/app/Classes/General/Eloquent/Filters/WithTotalPayments.php
index 48ca169a..9721f8d7 100644
--- a/app/Classes/General/Eloquent/Filters/WithTotalPayments.php
+++ b/app/Classes/General/Eloquent/Filters/WithTotalPayments.php
@@ -21,6 +21,6 @@ class WithTotalPayments implements Filter
     {
         return $builder->leftJoin('bookings', 'companies.id', '=', 'bookings.company_id')->rightJoin('transactions', function ($join) {
             $join->on('bookings.id', '=', 'transactions.owner_id')->where('owner_type', '=', Booking::class)->where('transactions.type', TransactionType::PAYMENT)->whereIn('transactions.status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED]);
-        })->addSelect(['companies.*', DB::raw('SUM(transactions.amount) as total_payments'), DB::raw('SUM(transactions.amount / DATEDIFF(companies.created_at, CURRENT_DATE)) as spending_average_per_day')])->groupBy(['companies.id']);
+        })->addSelect(['companies.*', DB::raw('SUM(transactions.amount) as total_payments'), DB::raw('SUM(transactions.amount / DATEDIFF(companies.created_at, CURRENT_DATE)) as spending_average_per_day'), DB::raw('SUM(transactions.amount) / count(distinct bookings.id) as spending_average_booking')])->groupBy(['companies.id']);
     }
 }
\ No newline at end of file
diff --git a/app/Http/Resources/CompanyResource.php b/app/Http/Resources/CompanyResource.php
index 19d6d04f..54ab047d 100644
--- a/app/Http/Resources/CompanyResource.php
+++ b/app/Http/Resources/CompanyResource.php
@@ -40,9 +40,14 @@ class CompanyResource extends JsonResource
             'employee' => new UserResource(Auth::user()->type === RoleTypes::USER ? $this->employees()->where('email', '=', Auth::user()->email)->first() : $this->employees()->orderBy('id', 'DESC')->first()),
             'identification' => new DocumentResource($this->documents->whereIn('document_type', DocumentType::IDENTIFICATION_DOCUMENTS)->first()),
             'bookings' => $this->whenLoaded('bookings', $this->bookings()->orderBy('id', 'DESC')->get(), []),
+            'confirmed_bookings' => $this->bookings()->whereHas('transactions', function ($query){
+                $query->where('type', TransactionType::PAYMENT)->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED]);
+            })->count(),
             'total_payments' => (float) $totalPayments,
             'average_spending_per_day' => (float) $totalPayments / ($this->created_at->diff(Carbon::now())->days === 0 ? 1 : $this->created_at->diff(Carbon::now())->days),
-            'average_spending_per_booking' => (float) $totalPayments / ($this->created_at->diff(Carbon::now())->days === 0 ? 1 : $this->created_at->diff(Carbon::now())->days),
+            'average_spending_per_booking' => (float) $totalPayments > 0 ? $totalPayments / $this->bookings()->whereHas('transactions', function ($query){
+                $query->where('type', TransactionType::PAYMENT)->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED]);
+                })->count() : $totalPayments,
             'last_payment' => $lastPayment ? $lastPayment->created_at->diffForHumans() : 'No Payments',
             'personal_banks' => BankResource::collection($this->banks->where('type', BankAccountType::PERSONAL)),
             'recipient_banks' => [
diff --git a/resources/assets/vue/components/companies/elements/CompanyComponent.vue b/resources/assets/vue/components/companies/elements/CompanyComponent.vue
index 7848cb91..4e194aba 100644
--- a/resources/assets/vue/components/companies/elements/CompanyComponent.vue
+++ b/resources/assets/vue/components/companies/elements/CompanyComponent.vue
@@ -12,7 +12,7 @@
                 </div>
             </div>
         </div>
-        <div class="col-3 text-center">
+        <div class="col-2 text-center">
             <div class="row">
                 <div class="col">
                     <div class="font-heading fs-10 muted all-caps">Payments</div>
@@ -27,7 +27,7 @@
         <div class="col-2 text-center">
             <div class="row">
                 <div class="col">
-                    <div class="font-heading fs-10 muted all-caps">Average Spending</div>
+                    <div class="font-heading fs-10 muted all-caps">Average Daily Spending</div>
                 </div>
             </div>
             <div class="row">
@@ -37,6 +37,18 @@
             </div>
         </div>
         <div class="col-2 text-center">
+            <div class="row">
+                <div class="col">
+                    <div class="font-heading fs-10 muted all-caps">Average Booking Spending</div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col">
+                    <div class="font-heading fs-11">MYR {{(Math.round((this.item.average_spending_per_booking + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
+                </div>
+            </div>
+        </div>
+        <div class="col-auto text-center">
             <div class="row">
                 <div class="col">
                     <div class="font-heading fs-10 muted all-caps">Last Payment</div>
@@ -48,7 +60,7 @@
                 </div>
             </div>
         </div>
-        <div class="col-1 text-center">
+        <div class="col-auto text-center">
             <div class="row">
                 <div class="col">
                     <div class="font-heading fs-10 muted all-caps">Bookings</div>
@@ -56,7 +68,7 @@
             </div>
             <div class="row">
                 <div class="col">
-                    <div class="font-heading all-caps fs-11">{{this.item.bookings.length}}</div>
+                    <div class="font-heading all-caps fs-11"><span v-if="item.confirmed_bookings">{{this.item.confirmed_bookings}} / </span>{{this.item.bookings.length}}</div>
                 </div>
             </div>
         </div>
diff --git a/resources/views/pages/customers/index.blade.php b/resources/views/pages/customers/index.blade.php
index 93a05ac5..c5807fd5 100644
--- a/resources/views/pages/customers/index.blade.php
+++ b/resources/views/pages/customers/index.blade.php
@@ -43,7 +43,26 @@
                                                             </div>
                                                             <div class="row">
                                                                 <div class="col">
-                                                                    <div class="fs-12 m-t-5 all-caps">Average Spending</div>
+                                                                    <div class="fs-12 m-t-5 all-caps">Average Daily Spending</div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div class="col b-r b-white">
+                                                    <div class="row fs-12 text-center">
+                                                        <div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="top-average-booking-spenders">
+                                                            <div class="row justify-content-center m-b-5">
+                                                                <div class="col-auto">
+                                                                    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
+                                                                         width="35" height="35"
+                                                                         viewBox="0 0 172 172"
+                                                                         style=" fill:#000000;"><defs><linearGradient x1="104.8125" y1="95.74219" x2="104.8125" y2="114.9175" gradientUnits="userSpaceOnUse" id="color-1_TUOBhQt-Vj1j_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="67.1875" y1="95.74219" x2="67.1875" y2="114.9175" gradientUnits="userSpaceOnUse" id="color-2_TUOBhQt-Vj1j_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="125.40413" x2="86" y2="133.41288" gradientUnits="userSpaceOnUse" id="color-3_TUOBhQt-Vj1j_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="10.234" x2="86" y2="158.13788" gradientUnits="userSpaceOnUse" id="color-4_TUOBhQt-Vj1j_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><circle cx="39" cy="39" transform="scale(2.6875,2.6875)" r="3" fill="url(#color-1_TUOBhQt-Vj1j_gr1)"></circle><circle cx="25" cy="39" transform="scale(2.6875,2.6875)" r="3" fill="url(#color-2_TUOBhQt-Vj1j_gr2)"></circle><rect x="28" y="47" transform="scale(2.6875,2.6875)" width="8" height="3" fill="url(#color-3_TUOBhQt-Vj1j_gr3)"></rect><path d="M142.4375,80.11975v-7.55725c0,-31.11856 -25.31625,-56.4375 -56.4375,-56.4375c-31.12125,0 -56.4375,25.31894 -56.4375,56.4375v7.55725c-4.81062,2.79231 -8.0625,7.98994 -8.0625,13.94275c0,8.89294 7.23206,16.125 16.125,16.125h0.13706c1.40556,25.42106 22.47019,45.6875 48.23794,45.6875c25.76775,0 46.83238,-20.26644 48.23794,-45.6875h0.13706c8.89294,0 16.125,-7.23206 16.125,-16.125c0,-5.95281 -3.25188,-11.15044 -8.0625,-13.94275zM34.9375,77.9375v-5.375h16.125c7.40944,0 13.4375,-6.02806 13.4375,-13.4375v-5.375h-5.375v5.375c0,4.44512 -3.61738,8.0625 -8.0625,8.0625h-15.83744c2.69556,-25.63875 24.43475,-45.6875 50.77494,-45.6875c26.34019,0 48.07938,20.04875 50.77494,45.6875h-42.71244c-4.44512,0 -8.0625,-3.61738 -8.0625,-8.0625v-5.375h-5.375v5.375c0,7.40944 6.02806,13.4375 13.4375,13.4375h43v5.375h-46.91837c-8.213,0 -14.89413,-6.68113 -14.89413,-14.89413v-9.29337h-5.375v8.94937c0,8.40113 -6.837,15.23813 -15.23813,15.23813zM26.875,94.0625c0,-5.92863 4.82138,-10.75 10.75,-10.75v8.0625h-2.6875c-1.4835,0 -2.6875,1.20131 -2.6875,2.6875c0,1.48619 1.204,2.6875 2.6875,2.6875h2.6875v8.0625c-5.92862,0 -10.75,-4.82137 -10.75,-10.75zM86,150.5c-23.70912,0 -43,-19.29087 -43,-43v-24.1875h11.63687c7.61906,0 14.28675,-4.15488 17.85575,-10.31731c3.48031,6.15438 10.08888,10.31731 17.6515,10.31731h38.85587v24.1875c0,23.70913 -19.29087,43 -43,43zM134.375,104.8125v-8.0625h2.6875c1.4835,0 2.6875,-1.20131 2.6875,-2.6875c0,-1.48619 -1.204,-2.6875 -2.6875,-2.6875h-2.6875v-8.0625c5.92863,0 10.75,4.82137 10.75,10.75c0,5.92863 -4.82137,10.75 -10.75,10.75z" fill="url(#color-4_TUOBhQt-Vj1j_gr4)"></path></g></g></svg>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <div class="fs-12 m-t-5 all-caps">Average Booking Spending</div>
                                                                 </div>
                                                             </div>
                                                         </div>
@@ -70,6 +89,13 @@
                                             </template>
                                         </list-component>
                                     </div>
+                                    <div class="row tabsContainer tabContent hide m-l-0 m-r-0 hide" tab-name="top-average-booking-spenders" v-if="$store.getters.isAdmin">
+                                        <list-component  key="2" section="topAverageBookingSpenders" :endpoint="route('api.company.list')" :options="{'with_total_payments': true, 'business_type': 2, with_bookings:true, order_by:{ column:'spending_average_booking', DESC:true}}">
+                                            <template slot="list" slot-scope="{data}">
+                                                <company-component :data="data"></company-component>
+                                            </template>
+                                        </list-component>
+                                    </div>
                                 </div>
                             </div>
                         </div>