From 3ea234c6356d77a92cf7c20ba9f2afb12fd57795 Mon Sep 17 00:00:00 2001
From: omair saleh <uldvstar@gmail.com>
Date: Thu, 17 Jun 2021 00:08:14 +0800
Subject: [PATCH] display announcement on customers dashboard

---
 .../General/Eloquent/Filters/HasSegments.php  |   3 +-
 .../forms/ViewAnnouncementFormComponent.vue   |  52 +-
 .../customerDashboardSectionComponent.vue     | 982 +++++++++---------
 .../general/elements/ListComponent.vue        |   6 +-
 resources/views/pages/settings.blade.php      |   9 +-
 5 files changed, 538 insertions(+), 514 deletions(-)

diff --git a/app/Classes/General/Eloquent/Filters/HasSegments.php b/app/Classes/General/Eloquent/Filters/HasSegments.php
index 26d94dd8..4d100f4c 100644
--- a/app/Classes/General/Eloquent/Filters/HasSegments.php
+++ b/app/Classes/General/Eloquent/Filters/HasSegments.php
@@ -2,6 +2,7 @@
 
 namespace App\Classes\General\Eloquent\Filters;
 
+use App\Models\Company;
 use Illuminate\Database\Eloquent\Builder;
 
 class HasSegments implements Filter
@@ -15,7 +16,7 @@ class HasSegments implements Filter
     public static function apply(Builder $builder, $value)
     {
         return $builder->whereHas('segments', function ($q) use ($value) {
-            $q->whereIn('id', $value);
+            $q->whereIn('id', Auth()->user()->company()->first()->segments()->pluck('segment_id'));
         });
     }
 }
diff --git a/resources/assets/vue/components/announcements/forms/ViewAnnouncementFormComponent.vue b/resources/assets/vue/components/announcements/forms/ViewAnnouncementFormComponent.vue
index 6308af30..ee70f8ad 100644
--- a/resources/assets/vue/components/announcements/forms/ViewAnnouncementFormComponent.vue
+++ b/resources/assets/vue/components/announcements/forms/ViewAnnouncementFormComponent.vue
@@ -1,29 +1,43 @@
 <template>
-    <div class="row">
+    <div class="row m-b-10">
         <div class="col">
-            <loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
-            <div class="row bg-white" v-show="!isLoading">
-                <div class="col">
-
-                    <div class="row m-b-20">
-                        <div class="col">
-                            <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="50" height="50" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="99.4375" y1="43.33594" x2="99.4375" y2="60.14625" gradientUnits="userSpaceOnUse" id="color-1_43971_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="106.15625" y1="26.875" x2="106.15625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-2_43971_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="83.3125" y1="26.875" x2="83.3125" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-3_43971_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="73.90625" y1="26.875" x2="73.90625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-4_43971_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="51.0625" y1="26.875" x2="51.0625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-5_43971_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="51.0625" y1="26.875" x2="51.0625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-6_43971_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="26.875" x2="45.6875" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-7_43971_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="43" y1="26.875" x2="43" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-8_43971_gr8"><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><path d="M112.875,59.125h-26.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h26.875c1.4835,0 2.6875,1.204 2.6875,2.6875v10.75c0,1.4835 -1.204,2.6875 -2.6875,2.6875z" fill="url(#color-1_43971_gr1)"></path><path d="M155.875,96.75c0,-7.97381 -5.82381,-14.59581 -13.4375,-15.88313v-18.82325c0,-2.08819 -1.16906,-3.94525 -3.05031,-4.85094c-1.88125,-0.90031 -4.06081,-0.65575 -5.69481,0.64769l-21.48925,17.18925c-0.08062,0.0645 -0.13975,0.14781 -0.21769,0.21769h-31.36044c-7.40944,0 -13.4375,6.02806 -13.4375,13.4375h-5.375c-2.96431,0 -5.375,2.41069 -5.375,5.375v5.375c0,2.96431 2.41069,5.375 5.375,5.375h5.375c0,7.40944 6.02806,13.4375 13.4375,13.4375v16.125c0,5.92863 4.82138,10.75 10.75,10.75c5.92863,0 10.75,-4.82137 10.75,-10.75v-16.125h9.86044c0.07794,0.06988 0.13706,0.15319 0.22038,0.22037l21.48656,17.18925c0.98094,0.78475 2.16075,1.18519 3.35131,1.18519c0.79281,0 1.59369,-0.17738 2.3435,-0.5375c1.88125,-0.903 3.05031,-2.76275 3.05031,-4.84825v-18.82325c7.61369,-1.28731 13.4375,-7.90931 13.4375,-15.88312zM61.8125,99.4375v-5.375h5.375v5.375zM96.75,134.375c0,2.96431 -2.41069,5.375 -5.375,5.375c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-16.125h10.75zM80.625,112.875c-4.44513,0 -8.0625,-3.61738 -8.0625,-8.0625v-16.125c0,-4.44513 3.61737,-8.0625 8.0625,-8.0625h29.5625v32.25h-8.0625zM137.05175,131.46175l-21.48925,-17.19462v-35.04231l10.75,-8.59194v26.11713h5.375v-30.41175l5.375,-4.29462l0.00538,69.42887c0,0 -0.00538,-0.00269 -0.01613,-0.01075zM142.4375,107.11837v-20.73675c4.6225,1.20131 8.0625,5.375 8.0625,10.36838c0,4.99337 -3.44,9.16706 -8.0625,10.36838z" fill="url(#color-2_43971_gr2)"></path><path d="M77.9375,91.375v5.375h5.375v-5.375h5.375v-5.375h-5.375c-2.96431,0 -5.375,2.41069 -5.375,5.375z" fill="url(#color-3_43971_gr3)"></path><path d="M21.5,107.5v-67.1875c0,-4.44512 3.61737,-8.0625 8.0625,-8.0625h88.6875c4.44512,0 8.0625,3.61738 8.0625,8.0625v10.75h5.375v-10.75c0,-7.40944 -6.02806,-13.4375 -13.4375,-13.4375h-88.6875c-7.40944,0 -13.4375,6.02806 -13.4375,13.4375v67.1875c0,7.40944 6.02806,13.4375 13.4375,13.4375h32.25v-5.375h-32.25c-4.44513,0 -8.0625,-3.61737 -8.0625,-8.0625z" fill="url(#color-4_43971_gr4)"></path><path d="M32.25,43h37.625v5.375h-37.625z" fill="url(#color-5_43971_gr5)"></path><path d="M32.25,53.75h37.625v5.375h-37.625z" fill="url(#color-6_43971_gr6)"></path><path d="M32.25,64.5h26.875v5.375h-26.875z" fill="url(#color-7_43971_gr7)"></path><path d="M32.25,75.25h21.5v5.375h-21.5z" fill="url(#color-8_43971_gr8)"></path></g></g></svg>
-                            <label class="fs-20 all-caps"><b>{{item.title}}</b></label>
-                            <label class="float-right fs-10"><i>{{item.created_at}}</i></label>
-                        </div>
+            <div class="alert alert-info padding-15" role="alert" v-show="!isLoading">
+                <div class="row">
+                    <div class="col">
+                        <h5 class="pull-left">{{item.title}}</h5>
                     </div>
-                    <div class="row m-b-20">
-                        <div class="col">
-                            <div class=""><b>{{item.description}}</b></div>
-                        </div>
+                    <div class="col-auto">
+                        <i class="fa fa-times text-info-darker pointer" data-dismiss="alert"></i>
                     </div>
-                    <div class="row justify-content-md-center p-b-10">
-                        <div class="col-3">
-                            <div class="btn btn-sm btn-success btn-block b-rad-none" data-dismiss="modal">OK</div>
-                        </div>
+                </div>
+                <div class="row">
+                    <div class="col">
+                        <p>{{item.description}}</p>
                     </div>
                 </div>
             </div>
+            <!--<div class="row bg-white" v-show="!isLoading">-->
+                <!--<div class="col">-->
+
+                    <!--<div class="row m-b-20">-->
+                        <!--<div class="col">-->
+                            <!--<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="50" height="50" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="99.4375" y1="43.33594" x2="99.4375" y2="60.14625" gradientUnits="userSpaceOnUse" id="color-1_43971_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="106.15625" y1="26.875" x2="106.15625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-2_43971_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="83.3125" y1="26.875" x2="83.3125" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-3_43971_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="73.90625" y1="26.875" x2="73.90625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-4_43971_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="51.0625" y1="26.875" x2="51.0625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-5_43971_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="51.0625" y1="26.875" x2="51.0625" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-6_43971_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="26.875" x2="45.6875" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-7_43971_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="43" y1="26.875" x2="43" y2="146.16775" gradientUnits="userSpaceOnUse" id="color-8_43971_gr8"><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><path d="M112.875,59.125h-26.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h26.875c1.4835,0 2.6875,1.204 2.6875,2.6875v10.75c0,1.4835 -1.204,2.6875 -2.6875,2.6875z" fill="url(#color-1_43971_gr1)"></path><path d="M155.875,96.75c0,-7.97381 -5.82381,-14.59581 -13.4375,-15.88313v-18.82325c0,-2.08819 -1.16906,-3.94525 -3.05031,-4.85094c-1.88125,-0.90031 -4.06081,-0.65575 -5.69481,0.64769l-21.48925,17.18925c-0.08062,0.0645 -0.13975,0.14781 -0.21769,0.21769h-31.36044c-7.40944,0 -13.4375,6.02806 -13.4375,13.4375h-5.375c-2.96431,0 -5.375,2.41069 -5.375,5.375v5.375c0,2.96431 2.41069,5.375 5.375,5.375h5.375c0,7.40944 6.02806,13.4375 13.4375,13.4375v16.125c0,5.92863 4.82138,10.75 10.75,10.75c5.92863,0 10.75,-4.82137 10.75,-10.75v-16.125h9.86044c0.07794,0.06988 0.13706,0.15319 0.22038,0.22037l21.48656,17.18925c0.98094,0.78475 2.16075,1.18519 3.35131,1.18519c0.79281,0 1.59369,-0.17738 2.3435,-0.5375c1.88125,-0.903 3.05031,-2.76275 3.05031,-4.84825v-18.82325c7.61369,-1.28731 13.4375,-7.90931 13.4375,-15.88312zM61.8125,99.4375v-5.375h5.375v5.375zM96.75,134.375c0,2.96431 -2.41069,5.375 -5.375,5.375c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-16.125h10.75zM80.625,112.875c-4.44513,0 -8.0625,-3.61738 -8.0625,-8.0625v-16.125c0,-4.44513 3.61737,-8.0625 8.0625,-8.0625h29.5625v32.25h-8.0625zM137.05175,131.46175l-21.48925,-17.19462v-35.04231l10.75,-8.59194v26.11713h5.375v-30.41175l5.375,-4.29462l0.00538,69.42887c0,0 -0.00538,-0.00269 -0.01613,-0.01075zM142.4375,107.11837v-20.73675c4.6225,1.20131 8.0625,5.375 8.0625,10.36838c0,4.99337 -3.44,9.16706 -8.0625,10.36838z" fill="url(#color-2_43971_gr2)"></path><path d="M77.9375,91.375v5.375h5.375v-5.375h5.375v-5.375h-5.375c-2.96431,0 -5.375,2.41069 -5.375,5.375z" fill="url(#color-3_43971_gr3)"></path><path d="M21.5,107.5v-67.1875c0,-4.44512 3.61737,-8.0625 8.0625,-8.0625h88.6875c4.44512,0 8.0625,3.61738 8.0625,8.0625v10.75h5.375v-10.75c0,-7.40944 -6.02806,-13.4375 -13.4375,-13.4375h-88.6875c-7.40944,0 -13.4375,6.02806 -13.4375,13.4375v67.1875c0,7.40944 6.02806,13.4375 13.4375,13.4375h32.25v-5.375h-32.25c-4.44513,0 -8.0625,-3.61737 -8.0625,-8.0625z" fill="url(#color-4_43971_gr4)"></path><path d="M32.25,43h37.625v5.375h-37.625z" fill="url(#color-5_43971_gr5)"></path><path d="M32.25,53.75h37.625v5.375h-37.625z" fill="url(#color-6_43971_gr6)"></path><path d="M32.25,64.5h26.875v5.375h-26.875z" fill="url(#color-7_43971_gr7)"></path><path d="M32.25,75.25h21.5v5.375h-21.5z" fill="url(#color-8_43971_gr8)"></path></g></g></svg>-->
+                            <!--<label class="fs-20 all-caps"><b>{{item.title}}</b></label>-->
+                            <!--<label class="float-right fs-10"><i>{{item.created_at}}</i></label>-->
+                        <!--</div>-->
+                    <!--</div>-->
+                    <!--<div class="row m-b-20">-->
+                        <!--<div class="col">-->
+                            <!--<div class=""><b>{{item.description}}</b></div>-->
+                        <!--</div>-->
+                    <!--</div>-->
+                    <!--<div class="row justify-content-md-center p-b-10">-->
+                        <!--<div class="col-3">-->
+                            <!--<div class="btn btn-sm btn-success btn-block b-rad-none" data-dismiss="modal">OK</div>-->
+                        <!--</div>-->
+                    <!--</div>-->
+                <!--</div>-->
+            <!--</div>-->
         </div>
     </div>
 </template>
diff --git a/resources/assets/vue/components/companies/sections/customerDashboardSectionComponent.vue b/resources/assets/vue/components/companies/sections/customerDashboardSectionComponent.vue
index df33cc3a..6334bb29 100644
--- a/resources/assets/vue/components/companies/sections/customerDashboardSectionComponent.vue
+++ b/resources/assets/vue/components/companies/sections/customerDashboardSectionComponent.vue
@@ -1,517 +1,529 @@
 <template>
-
     <div class="row">
-        <div class="order-last col-md-12 order-md-last col-lg-3 order-lg-first col-xl-3 order-xl-first">
+        <div class="col">
             <div class="row">
-                <div class="col no-padding">
-                    <div
-                        class="absolute b-a b-success b-thick padding-5 animate__animated animate__infinite animate__pulse w-100 h-100"
-                        v-if="attention" style="top:0; left:0; z-index: -1;">
-                        <div class="b-a b-thick b-success h-100"></div>
-                    </div>
+                <div class="col-10"l>
+                    <list-component style="min-height: auto;" section="customerAnnouncements" :emptyListSection=false :endpoint="route('api.announcement.list')" :options="{has_segments:true,is_published:true}">
+                        <template slot="list" slot-scope="{data}">
+                            <view-announcement-form-component :data="data" section="customerAnnouncements"></view-announcement-form-component>
+                        </template>
+                    </list-component>
+                </div>
+            </div>
+            <div class="row">
+                <div class="order-last col-md-12 order-md-last col-lg-3 order-lg-first col-xl-3 order-xl-first">
                     <div class="row">
-                        <div class="col">
-                            <booking-form-component :data="company" section="customerProfileSection" v-if="company"
-                                                    v-on:click.native="attention = false"></booking-form-component>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-        </div>
-        <div class="order-first col-md-12 order-md-first col-lg order-lg-last col-xl order-xl-last">
-            <loading-component style="height: 200px; top: 0;" key="1" color="success"
-                               v-show="isLoading"></loading-component>
-            <div class="row" v-if="!isLoading">
-                <div class="col">
-                    <div class="row m-l-0 m-r-0" v-show="!company.status || !company.bookings.length">
-                        <div class="col">
-                            <onboarding-section-component :data="company"
-                                                          v-on:attention="attention = true"></onboarding-section-component>
-                        </div>
-                    </div>
-                    <div class="row tabsContainer"
-                         v-show="(company.status === 2 || company.status === 1) && company.bookings.length">
-                        <div class="col">
-                            <div class="row m-l-0 m-r-0 d-none d-md-flex">
+                        <div class="col no-padding">
+                            <div
+                                    class="absolute b-a b-success b-thick padding-5 animate__animated animate__infinite animate__pulse w-100 h-100"
+                                    v-if="attention" style="top:0; left:0; z-index: -1;">
+                                <div class="b-a b-thick b-success h-100"></div>
+                            </div>
+                            <div class="row">
                                 <div class="col">
-                                    <div class="row">
-                                        <div class="col m-r-5">
-                                            <div class="row fs-12 text-center">
-                                                <div class="col p-t-20 p-b-20 bg-master-lighter active tabButton"
-                                                     tab-name="transfers">
-                                                    <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="86" y1="104.14063" x2="86" y2="140.57775" gradientUnits="userSpaceOnUse" id="color-1_44825_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.125" x2="86" y2="159.93044" gradientUnits="userSpaceOnUse" id="color-2_44825_gr2"><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><path d="M121.41588,139.75h-70.83175c-2.53431,0 -3.66575,-3.18469 -1.6985,-4.78106l33.72544,-27.40175c1.97531,-1.60444 4.80256,-1.60444 6.77787,0l33.72544,27.40175c1.96725,1.59638 0.83581,4.78106 -1.6985,4.78106z" fill="url(#color-1_44825_gr1)"></path><path d="M148.135,71.77238l-8.385,-8.385v-28.42031c0,-4.46125 -3.63081,-8.09206 -8.09206,-8.09206h-2.65794v-2.65794c0,-4.46125 -3.63081,-8.09206 -8.09206,-8.09206h-69.81587c-4.46125,0 -8.09206,3.63081 -8.09206,8.09206v2.65794h-2.65794c-4.46125,0 -8.09206,3.63081 -8.09206,8.09206v28.42031l-8.385,8.385c-1.5265,1.52381 -2.365,3.55019 -2.365,5.70825v64.95688c0,7.40944 6.02806,13.4375 13.4375,13.4375h102.125c7.40944,0 13.4375,-6.02806 13.4375,-13.4375v-64.95688c0,-2.15806 -0.84119,-4.18444 -2.365,-5.70825zM77.60156,91.96356l-0.30906,0.24725c-1.28731,-1.79525 -2.0425,-3.92375 -2.0425,-6.21081c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,2.26287 -0.70413,4.41019 -2.01294,6.235l-0.34131,-0.27412c-4.93962,-3.95063 -11.84919,-3.95063 -16.79419,0.00269zM86,69.875c-8.89294,0 -16.125,7.23206 -16.125,16.125c0,3.53406 1.14487,6.85581 3.18738,9.59438l-10.578,8.46025l-3.35937,-2.6875v-55.88388c6.95256,-1.06963 12.16094,-6.28069 13.23325,-13.23325h27.2835c1.06963,6.95256 6.28069,12.16094 13.23325,13.23325v55.88656l-3.35937,2.6875l-10.56994,-8.45488c2.07744,-2.79231 3.17931,-6.10869 3.17931,-9.60244c0,-8.89294 -7.23206,-16.125 -16.125,-16.125zM58.179,107.5l-31.304,25.04481v-50.08694zM145.125,82.45519v50.08963l-31.30669,-25.04481zM144.33488,75.5725c0.11825,0.11825 0.18006,0.27412 0.27412,0.4085l-4.859,3.88612v-8.8795zM131.65794,32.25c1.49962,0 2.71706,1.21744 2.71706,2.71706v49.20275l-5.375,4.3v-56.21981zM51.09206,21.5h69.81856c1.49694,0 2.71438,1.21744 2.71438,2.71706v68.55275l-5.375,4.3v-56.75731h-2.6875c-6.22694,0 -10.75,-4.52306 -10.75,-10.75v-2.6875h-37.625v2.6875c0,6.22694 -4.52306,10.75 -10.75,10.75h-2.6875v56.75731l-5.375,-4.3v-68.55275c0,-1.49962 1.21744,-2.71706 2.71706,-2.71706zM40.34206,32.25h2.65794v56.21981l-5.375,-4.3v-49.20275c0,-1.49963 1.21744,-2.71706 2.71706,-2.71706zM32.25,70.98763v8.88219l-4.859,-3.88881c0.09406,-0.13438 0.15587,-0.29025 0.27412,-0.4085zM137.0625,150.5h-102.125c-4.44513,0 -8.0625,-3.61738 -8.0625,-8.0625v-3.00463l54.08325,-43.27144c2.96969,-2.37306 7.11381,-2.37306 10.08081,0l54.08594,43.26875v3.00731c0,4.44513 -3.61737,8.0625 -8.0625,8.0625z" fill="url(#color-2_44825_gr2)"></path></g></g></svg>
-                                                        </div>
-                                                    </div>
-                                                    <div class="row">
-                                                        <div class="col">
-                                                            <div class="fs-12 m-t-5">My Transfers</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="col m-r-5">
-                                            <div class="row fs-12 text-center">
-                                                <div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="payments">
-                                                    <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="96.75" y1="71.30475" x2="96.75" y2="95.57556" gradientUnits="userSpaceOnUse" id="color-1_6AytYvfD4mxm_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="68.53125" y1="69.47456" x2="68.53125" y2="93.72119" gradientUnits="userSpaceOnUse" id="color-2_6AytYvfD4mxm_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="32.25" y1="16.06856" x2="32.25" y2="137.557" gradientUnits="userSpaceOnUse" id="color-3_6AytYvfD4mxm_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="32.25" y1="16.06856" x2="32.25" y2="137.557" gradientUnits="userSpaceOnUse" id="color-4_6AytYvfD4mxm_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-5_6AytYvfD4mxm_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-6_6AytYvfD4mxm_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-7_6AytYvfD4mxm_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-8_6AytYvfD4mxm_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="72.5625" y1="16.06856" x2="72.5625" y2="137.557" gradientUnits="userSpaceOnUse" id="color-9_6AytYvfD4mxm_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="61.8125" y1="16.06856" x2="61.8125" y2="137.557" gradientUnits="userSpaceOnUse" id="color-10_6AytYvfD4mxm_gr10"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="153.1875" y1="16.06856" x2="153.1875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-11_6AytYvfD4mxm_gr11"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="79.28125" y1="16.06856" x2="79.28125" y2="137.557" gradientUnits="userSpaceOnUse" id="color-12_6AytYvfD4mxm_gr12"><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><path d="M86,86c0,5.93669 4.81331,10.75 10.75,10.75c5.93669,0 10.75,-4.81331 10.75,-10.75c0,-5.93669 -4.81331,-10.75 -10.75,-10.75c-5.93669,0 -10.75,4.81331 -10.75,10.75z" fill="url(#color-1_6AytYvfD4mxm_gr1)"></path><path d="M61.8125,94.67794v-17.35587c0,-1.14487 0.92719,-2.07206 2.07206,-2.07206h9.29337c1.14487,0 2.07206,0.92719 2.07206,2.07206v17.35587c0,1.14487 -0.92719,2.07206 -2.07206,2.07206h-9.29337c-1.14488,0 -2.07206,-0.92719 -2.07206,-2.07206z" fill="url(#color-2_6AytYvfD4mxm_gr2)"></path><rect x="11" y="28" transform="scale(2.6875,2.6875)" width="2" height="11" fill="url(#color-3_6AytYvfD4mxm_gr3)"></rect><rect x="11" y="42" transform="scale(2.6875,2.6875)" width="2" height="12" fill="url(#color-4_6AytYvfD4mxm_gr4)"></rect><rect x="16" y="28" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-5_6AytYvfD4mxm_gr5)"></rect><rect x="16" y="35" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-6_6AytYvfD4mxm_gr6)"></rect><rect x="16" y="42" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-7_6AytYvfD4mxm_gr7)"></rect><rect x="16" y="49" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-8_6AytYvfD4mxm_gr8)"></rect><rect x="26" y="46" transform="scale(2.6875,2.6875)" width="2" height="8" fill="url(#color-9_6AytYvfD4mxm_gr9)"></rect><rect x="22" y="46" transform="scale(2.6875,2.6875)" width="2" height="8" fill="url(#color-10_6AytYvfD4mxm_gr10)"></rect><rect x="56" y="8" transform="scale(2.6875,2.6875)" width="2" height="48" fill="url(#color-11_6AytYvfD4mxm_gr11)"></rect><path d="M134.375,13.4375h-75.25c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v40.3125h-26.95294c-4.40212,0 -7.98456,3.58244 -7.98456,7.98456v80.78087c0,4.40213 3.58244,7.98456 7.98456,7.98456h110.26544c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-129c0,-4.44513 -3.61737,-8.0625 -8.0625,-8.0625zM80.70294,153.1875h-56.59338c-1.43781,0 -2.60956,-1.17175 -2.60956,-2.60956v-80.78088c0,-1.43781 1.17175,-2.60956 2.60956,-2.60956h56.59338c1.43781,0 2.60956,1.17175 2.60956,2.60956v80.78087c0,1.43781 -1.17175,2.60956 -2.60956,2.60956zM88.6875,72.09219c2.37575,-1.38944 5.117,-2.21719 8.0625,-2.21719c8.89294,0 16.125,7.23206 16.125,16.125c0,8.89294 -7.23206,16.125 -16.125,16.125c-2.9455,0 -5.68675,-0.82775 -8.0625,-2.21719zM88.6875,105.89825c2.49131,1.02125 5.20569,1.60175 8.0625,1.60175c11.85456,0 21.5,-9.64544 21.5,-21.5c0,-11.85456 -9.64544,-21.5 -21.5,-21.5c-3.15244,0 -6.1275,0.72025 -8.82306,1.94844c-1.27119,-2.72781 -4.0205,-4.63594 -7.224,-4.63594h-13.51544v-19.03825c6.74294,-1.13681 12.07762,-6.4715 13.21444,-13.21444h32.69612c1.13681,6.74294 6.4715,12.08031 13.21444,13.21444v86.44881c-6.74294,1.13681 -12.07762,6.4715 -13.21444,13.21444h-24.41056zM137.0625,150.5c0,1.48081 -1.204,2.6875 -2.6875,2.6875h-46.16319c0.28756,-0.82237 0.47569,-1.69044 0.47569,-2.60956v-2.76544h29.5625v-2.6875c0,-5.92863 4.82137,-10.75 10.75,-10.75h2.6875v-96.75h-2.6875c-5.92863,0 -10.75,-4.82138 -10.75,-10.75v-2.6875h-43v2.6875c0,5.92862 -4.82138,10.75 -10.75,10.75h-2.6875v24.1875h-5.375v-40.3125c0,-1.48081 1.204,-2.6875 2.6875,-2.6875h75.25c1.4835,0 2.6875,1.20669 2.6875,2.6875z" fill="url(#color-12_6AytYvfD4mxm_gr12)"></path></g></g></svg>
-                                                        </div>
-                                                    </div>
-                                                    <div class="row">
-                                                        <div class="col">
-                                                            <div class="fs-12 m-t-5">Pending Payments</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="col">
-                                            <div class="row fs-12 text-center">
-                                                <div class="col p-t-20 p-b-20 bg-master-lighter tabButton"
-                                                     tab-name="PO">
-                                                    <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="86" y1="15.84013" x2="86"
-                                                                                    y2="42.59956"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-1_1GEnKV6fhh62_gr1">
-                                                                        <stop offset="0"
-                                                                              stop-color="#4ec9ff"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#2bffe6"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-2_1GEnKV6fhh62_gr2">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-3_1GEnKV6fhh62_gr3">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-4_1GEnKV6fhh62_gr4">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-5_1GEnKV6fhh62_gr5">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-6_1GEnKV6fhh62_gr6">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-7_1GEnKV6fhh62_gr7">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-8_1GEnKV6fhh62_gr8">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-9_1GEnKV6fhh62_gr9">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-10_1GEnKV6fhh62_gr10">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="86" y1="14.46681" x2="86"
-                                                                                    y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-11_1GEnKV6fhh62_gr11">
-                                                                        <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 id="original-icon">
-                                                                        <path
-                                                                            d="M95.40625,45.6875h-18.8125v-17.46875c0,-5.19494 4.21131,-9.40625 9.40625,-9.40625v0c5.19494,0 9.40625,4.21131 9.40625,9.40625z"
-                                                                            fill="url(#color-1_1GEnKV6fhh62_gr1)"></path>
-                                                                        <rect x="19.043" y="33"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-2_1GEnKV6fhh62_gr2)"></rect>
-                                                                        <rect x="19.043" y="37"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-3_1GEnKV6fhh62_gr3)"></rect>
-                                                                        <rect x="19.043" y="42"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-4_1GEnKV6fhh62_gr4)"></rect>
-                                                                        <rect x="19.043" y="46"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-5_1GEnKV6fhh62_gr5)"></rect>
-                                                                        <rect x="19.043" y="24"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-6_1GEnKV6fhh62_gr6)"></rect>
-                                                                        <rect x="42" y="33"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-7_1GEnKV6fhh62_gr7)"></rect>
-                                                                        <rect x="42" y="42"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-8_1GEnKV6fhh62_gr8)"></rect>
-                                                                        <rect x="42" y="24"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-9_1GEnKV6fhh62_gr9)"></rect>
-                                                                        <rect x="19.043" y="28"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-10_1GEnKV6fhh62_gr10)"></rect>
-                                                                        <path
-                                                                            d="M131.6875,32.7445v-0.4945c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625h-18.8125h-7.4605c-1.67163,-4.68163 -6.10331,-8.0625 -11.352,-8.0625c-5.24869,0 -9.68037,3.38087 -11.352,8.0625h-26.273c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v0.4945c-3.12288,1.11531 -5.375,4.06887 -5.375,7.568v107.5c0,4.44512 3.61738,8.0625 8.0625,8.0625h86c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-107.5c0,-3.49912 -2.25213,-6.45269 -5.375,-7.568zM123.625,29.5625c1.4835,0 2.6875,1.204 2.6875,2.6875h-21.5h-6.71875v-2.6875h6.71875zM79.28125,28.21875c0,-3.70606 3.01269,-6.71875 6.71875,-6.71875c3.70606,0 6.71875,3.01269 6.71875,6.71875v14.78125h-13.4375zM48.375,29.5625h25.53125v2.6875h-28.21875c0,-1.4835 1.204,-2.6875 2.6875,-2.6875zM131.6875,147.8125c0,1.4835 -1.204,2.6875 -2.6875,2.6875h-10.75v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h10.75zM131.6875,131.6875h-10.75c-4.44512,0 -8.0625,3.61738 -8.0625,8.0625v10.75h-69.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-107.5c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h30.90625v10.75h24.1875v-10.75h6.71875h24.1875c1.4835,0 2.6875,1.204 2.6875,2.6875z"
-                                                                            fill="url(#color-11_1GEnKV6fhh62_gr11)"></path>
-                                                                    </g>
-                                                                </g>
-                                                            </svg>
-                                                        </div>
-                                                    </div>
-                                                    <div class="row">
-                                                        <div class="col">
-                                                            <div class="fs-12 m-t-5">Purchase Orders</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="col-4">
-                                    <div class="row justify-content-end">
-                                        <div class="col-8">
-                                            <div class="row fs-12 text-center">
-                                                <div class="col p-t-20 p-b-20 bg-master-lighter tabButton"
-                                                     tab-name="complete">
-                                                    <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="86" y1="15.84013" x2="86"
-                                                                                    y2="42.59956"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-1_1GEnKV6fhh62_gr1">
-                                                                        <stop offset="0"
-                                                                              stop-color="#4ec9ff"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#2bffe6"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-2_1GEnKV6fhh62_gr2">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-3_1GEnKV6fhh62_gr3">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-4_1GEnKV6fhh62_gr4">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-5_1GEnKV6fhh62_gr5">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="75.30644" y1="14.46681"
-                                                                                    x2="75.30644" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-6_1GEnKV6fhh62_gr6">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-7_1GEnKV6fhh62_gr7">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-8_1GEnKV6fhh62_gr8">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="116.90625" y1="14.46681"
-                                                                                    x2="116.90625" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-9_1GEnKV6fhh62_gr9">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="65.84106" y1="14.46681"
-                                                                                    x2="65.84106" y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-10_1GEnKV6fhh62_gr10">
-                                                                        <stop offset="0"
-                                                                              stop-color="#009add"></stop>
-                                                                        <stop offset="1"
-                                                                              stop-color="#00baa4"></stop>
-                                                                    </linearGradient>
-                                                                    <linearGradient x1="86" y1="14.46681" x2="86"
-                                                                                    y2="157.82344"
-                                                                                    gradientUnits="userSpaceOnUse"
-                                                                                    id="color-11_1GEnKV6fhh62_gr11">
-                                                                        <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 id="original-icon">
-                                                                        <path
-                                                                            d="M95.40625,45.6875h-18.8125v-17.46875c0,-5.19494 4.21131,-9.40625 9.40625,-9.40625v0c5.19494,0 9.40625,4.21131 9.40625,9.40625z"
-                                                                            fill="url(#color-1_1GEnKV6fhh62_gr1)"></path>
-                                                                        <rect x="19.043" y="33"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-2_1GEnKV6fhh62_gr2)"></rect>
-                                                                        <rect x="19.043" y="37"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-3_1GEnKV6fhh62_gr3)"></rect>
-                                                                        <rect x="19.043" y="42"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-4_1GEnKV6fhh62_gr4)"></rect>
-                                                                        <rect x="19.043" y="46"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-5_1GEnKV6fhh62_gr5)"></rect>
-                                                                        <rect x="19.043" y="24"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="17.957" height="2"
-                                                                              fill="url(#color-6_1GEnKV6fhh62_gr6)"></rect>
-                                                                        <rect x="42" y="33"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-7_1GEnKV6fhh62_gr7)"></rect>
-                                                                        <rect x="42" y="42"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-8_1GEnKV6fhh62_gr8)"></rect>
-                                                                        <rect x="42" y="24"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="3" height="2"
-                                                                              fill="url(#color-9_1GEnKV6fhh62_gr9)"></rect>
-                                                                        <rect x="19.043" y="28"
-                                                                              transform="scale(2.6875,2.6875)"
-                                                                              width="10.912" height="2"
-                                                                              fill="url(#color-10_1GEnKV6fhh62_gr10)"></rect>
-                                                                        <path
-                                                                            d="M131.6875,32.7445v-0.4945c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625h-18.8125h-7.4605c-1.67163,-4.68163 -6.10331,-8.0625 -11.352,-8.0625c-5.24869,0 -9.68037,3.38087 -11.352,8.0625h-26.273c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v0.4945c-3.12288,1.11531 -5.375,4.06887 -5.375,7.568v107.5c0,4.44512 3.61738,8.0625 8.0625,8.0625h86c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-107.5c0,-3.49912 -2.25213,-6.45269 -5.375,-7.568zM123.625,29.5625c1.4835,0 2.6875,1.204 2.6875,2.6875h-21.5h-6.71875v-2.6875h6.71875zM79.28125,28.21875c0,-3.70606 3.01269,-6.71875 6.71875,-6.71875c3.70606,0 6.71875,3.01269 6.71875,6.71875v14.78125h-13.4375zM48.375,29.5625h25.53125v2.6875h-28.21875c0,-1.4835 1.204,-2.6875 2.6875,-2.6875zM131.6875,147.8125c0,1.4835 -1.204,2.6875 -2.6875,2.6875h-10.75v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h10.75zM131.6875,131.6875h-10.75c-4.44512,0 -8.0625,3.61738 -8.0625,8.0625v10.75h-69.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-107.5c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h30.90625v10.75h24.1875v-10.75h6.71875h24.1875c1.4835,0 2.6875,1.204 2.6875,2.6875z"
-                                                                            fill="url(#color-11_1GEnKV6fhh62_gr11)"></path>
-                                                                    </g>
-                                                                </g>
-                                                            </svg>
-                                                        </div>
-                                                    </div>
-                                                    <div class="row">
-                                                        <div class="col">
-                                                            <div class="fs-12 m-t-5">Complete Orders</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
+                                    <booking-form-component :data="company" section="customerProfileSection" v-if="company"
+                                                            v-on:click.native="attention = false"></booking-form-component>
                                 </div>
                             </div>
-                            <div class="row no-margin">
-                                <div class="col bg-white padding-25">
-                                    <div class="row tabsContainer tabContent active" tab-name="transfers">
+                        </div>
+                    </div>
+
+                </div>
+                <div class="order-first col-md-12 order-md-first col-lg order-lg-last col-xl order-xl-last">
+                    <loading-component style="height: 200px; top: 0;" key="1" color="success"
+                                       v-show="isLoading"></loading-component>
+                    <div class="row" v-if="!isLoading">
+                        <div class="col">
+                            <div class="row m-l-0 m-r-0" v-show="!company.status || !company.bookings.length">
+                                <div class="col">
+                                    <onboarding-section-component :data="company"
+                                                                  v-on:attention="attention = true"></onboarding-section-component>
+                                </div>
+                            </div>
+                            <div class="row tabsContainer"
+                                 v-show="(company.status === 2 || company.status === 1) && company.bookings.length">
+                                <div class="col">
+                                    <div class="row m-l-0 m-r-0 d-none d-md-flex">
                                         <div class="col">
                                             <div class="row">
+                                                <div class="col m-r-5">
+                                                    <div class="row fs-12 text-center">
+                                                        <div class="col p-t-20 p-b-20 bg-master-lighter active tabButton"
+                                                             tab-name="transfers">
+                                                            <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="86" y1="104.14063" x2="86" y2="140.57775" gradientUnits="userSpaceOnUse" id="color-1_44825_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.125" x2="86" y2="159.93044" gradientUnits="userSpaceOnUse" id="color-2_44825_gr2"><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><path d="M121.41588,139.75h-70.83175c-2.53431,0 -3.66575,-3.18469 -1.6985,-4.78106l33.72544,-27.40175c1.97531,-1.60444 4.80256,-1.60444 6.77787,0l33.72544,27.40175c1.96725,1.59638 0.83581,4.78106 -1.6985,4.78106z" fill="url(#color-1_44825_gr1)"></path><path d="M148.135,71.77238l-8.385,-8.385v-28.42031c0,-4.46125 -3.63081,-8.09206 -8.09206,-8.09206h-2.65794v-2.65794c0,-4.46125 -3.63081,-8.09206 -8.09206,-8.09206h-69.81587c-4.46125,0 -8.09206,3.63081 -8.09206,8.09206v2.65794h-2.65794c-4.46125,0 -8.09206,3.63081 -8.09206,8.09206v28.42031l-8.385,8.385c-1.5265,1.52381 -2.365,3.55019 -2.365,5.70825v64.95688c0,7.40944 6.02806,13.4375 13.4375,13.4375h102.125c7.40944,0 13.4375,-6.02806 13.4375,-13.4375v-64.95688c0,-2.15806 -0.84119,-4.18444 -2.365,-5.70825zM77.60156,91.96356l-0.30906,0.24725c-1.28731,-1.79525 -2.0425,-3.92375 -2.0425,-6.21081c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,2.26287 -0.70413,4.41019 -2.01294,6.235l-0.34131,-0.27412c-4.93962,-3.95063 -11.84919,-3.95063 -16.79419,0.00269zM86,69.875c-8.89294,0 -16.125,7.23206 -16.125,16.125c0,3.53406 1.14487,6.85581 3.18738,9.59438l-10.578,8.46025l-3.35937,-2.6875v-55.88388c6.95256,-1.06963 12.16094,-6.28069 13.23325,-13.23325h27.2835c1.06963,6.95256 6.28069,12.16094 13.23325,13.23325v55.88656l-3.35937,2.6875l-10.56994,-8.45488c2.07744,-2.79231 3.17931,-6.10869 3.17931,-9.60244c0,-8.89294 -7.23206,-16.125 -16.125,-16.125zM58.179,107.5l-31.304,25.04481v-50.08694zM145.125,82.45519v50.08963l-31.30669,-25.04481zM144.33488,75.5725c0.11825,0.11825 0.18006,0.27412 0.27412,0.4085l-4.859,3.88612v-8.8795zM131.65794,32.25c1.49962,0 2.71706,1.21744 2.71706,2.71706v49.20275l-5.375,4.3v-56.21981zM51.09206,21.5h69.81856c1.49694,0 2.71438,1.21744 2.71438,2.71706v68.55275l-5.375,4.3v-56.75731h-2.6875c-6.22694,0 -10.75,-4.52306 -10.75,-10.75v-2.6875h-37.625v2.6875c0,6.22694 -4.52306,10.75 -10.75,10.75h-2.6875v56.75731l-5.375,-4.3v-68.55275c0,-1.49962 1.21744,-2.71706 2.71706,-2.71706zM40.34206,32.25h2.65794v56.21981l-5.375,-4.3v-49.20275c0,-1.49963 1.21744,-2.71706 2.71706,-2.71706zM32.25,70.98763v8.88219l-4.859,-3.88881c0.09406,-0.13438 0.15587,-0.29025 0.27412,-0.4085zM137.0625,150.5h-102.125c-4.44513,0 -8.0625,-3.61738 -8.0625,-8.0625v-3.00463l54.08325,-43.27144c2.96969,-2.37306 7.11381,-2.37306 10.08081,0l54.08594,43.26875v3.00731c0,4.44513 -3.61737,8.0625 -8.0625,8.0625z" fill="url(#color-2_44825_gr2)"></path></g></g></svg>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <div class="fs-12 m-t-5">My Transfers</div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div class="col m-r-5">
+                                                    <div class="row fs-12 text-center">
+                                                        <div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="payments">
+                                                            <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="96.75" y1="71.30475" x2="96.75" y2="95.57556" gradientUnits="userSpaceOnUse" id="color-1_6AytYvfD4mxm_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="68.53125" y1="69.47456" x2="68.53125" y2="93.72119" gradientUnits="userSpaceOnUse" id="color-2_6AytYvfD4mxm_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="32.25" y1="16.06856" x2="32.25" y2="137.557" gradientUnits="userSpaceOnUse" id="color-3_6AytYvfD4mxm_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="32.25" y1="16.06856" x2="32.25" y2="137.557" gradientUnits="userSpaceOnUse" id="color-4_6AytYvfD4mxm_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-5_6AytYvfD4mxm_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-6_6AytYvfD4mxm_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-7_6AytYvfD4mxm_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="16.06856" x2="45.6875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-8_6AytYvfD4mxm_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="72.5625" y1="16.06856" x2="72.5625" y2="137.557" gradientUnits="userSpaceOnUse" id="color-9_6AytYvfD4mxm_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="61.8125" y1="16.06856" x2="61.8125" y2="137.557" gradientUnits="userSpaceOnUse" id="color-10_6AytYvfD4mxm_gr10"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="153.1875" y1="16.06856" x2="153.1875" y2="137.557" gradientUnits="userSpaceOnUse" id="color-11_6AytYvfD4mxm_gr11"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="79.28125" y1="16.06856" x2="79.28125" y2="137.557" gradientUnits="userSpaceOnUse" id="color-12_6AytYvfD4mxm_gr12"><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><path d="M86,86c0,5.93669 4.81331,10.75 10.75,10.75c5.93669,0 10.75,-4.81331 10.75,-10.75c0,-5.93669 -4.81331,-10.75 -10.75,-10.75c-5.93669,0 -10.75,4.81331 -10.75,10.75z" fill="url(#color-1_6AytYvfD4mxm_gr1)"></path><path d="M61.8125,94.67794v-17.35587c0,-1.14487 0.92719,-2.07206 2.07206,-2.07206h9.29337c1.14487,0 2.07206,0.92719 2.07206,2.07206v17.35587c0,1.14487 -0.92719,2.07206 -2.07206,2.07206h-9.29337c-1.14488,0 -2.07206,-0.92719 -2.07206,-2.07206z" fill="url(#color-2_6AytYvfD4mxm_gr2)"></path><rect x="11" y="28" transform="scale(2.6875,2.6875)" width="2" height="11" fill="url(#color-3_6AytYvfD4mxm_gr3)"></rect><rect x="11" y="42" transform="scale(2.6875,2.6875)" width="2" height="12" fill="url(#color-4_6AytYvfD4mxm_gr4)"></rect><rect x="16" y="28" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-5_6AytYvfD4mxm_gr5)"></rect><rect x="16" y="35" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-6_6AytYvfD4mxm_gr6)"></rect><rect x="16" y="42" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-7_6AytYvfD4mxm_gr7)"></rect><rect x="16" y="49" transform="scale(2.6875,2.6875)" width="2" height="5" fill="url(#color-8_6AytYvfD4mxm_gr8)"></rect><rect x="26" y="46" transform="scale(2.6875,2.6875)" width="2" height="8" fill="url(#color-9_6AytYvfD4mxm_gr9)"></rect><rect x="22" y="46" transform="scale(2.6875,2.6875)" width="2" height="8" fill="url(#color-10_6AytYvfD4mxm_gr10)"></rect><rect x="56" y="8" transform="scale(2.6875,2.6875)" width="2" height="48" fill="url(#color-11_6AytYvfD4mxm_gr11)"></rect><path d="M134.375,13.4375h-75.25c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v40.3125h-26.95294c-4.40212,0 -7.98456,3.58244 -7.98456,7.98456v80.78087c0,4.40213 3.58244,7.98456 7.98456,7.98456h110.26544c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-129c0,-4.44513 -3.61737,-8.0625 -8.0625,-8.0625zM80.70294,153.1875h-56.59338c-1.43781,0 -2.60956,-1.17175 -2.60956,-2.60956v-80.78088c0,-1.43781 1.17175,-2.60956 2.60956,-2.60956h56.59338c1.43781,0 2.60956,1.17175 2.60956,2.60956v80.78087c0,1.43781 -1.17175,2.60956 -2.60956,2.60956zM88.6875,72.09219c2.37575,-1.38944 5.117,-2.21719 8.0625,-2.21719c8.89294,0 16.125,7.23206 16.125,16.125c0,8.89294 -7.23206,16.125 -16.125,16.125c-2.9455,0 -5.68675,-0.82775 -8.0625,-2.21719zM88.6875,105.89825c2.49131,1.02125 5.20569,1.60175 8.0625,1.60175c11.85456,0 21.5,-9.64544 21.5,-21.5c0,-11.85456 -9.64544,-21.5 -21.5,-21.5c-3.15244,0 -6.1275,0.72025 -8.82306,1.94844c-1.27119,-2.72781 -4.0205,-4.63594 -7.224,-4.63594h-13.51544v-19.03825c6.74294,-1.13681 12.07762,-6.4715 13.21444,-13.21444h32.69612c1.13681,6.74294 6.4715,12.08031 13.21444,13.21444v86.44881c-6.74294,1.13681 -12.07762,6.4715 -13.21444,13.21444h-24.41056zM137.0625,150.5c0,1.48081 -1.204,2.6875 -2.6875,2.6875h-46.16319c0.28756,-0.82237 0.47569,-1.69044 0.47569,-2.60956v-2.76544h29.5625v-2.6875c0,-5.92863 4.82137,-10.75 10.75,-10.75h2.6875v-96.75h-2.6875c-5.92863,0 -10.75,-4.82138 -10.75,-10.75v-2.6875h-43v2.6875c0,5.92862 -4.82138,10.75 -10.75,10.75h-2.6875v24.1875h-5.375v-40.3125c0,-1.48081 1.204,-2.6875 2.6875,-2.6875h75.25c1.4835,0 2.6875,1.20669 2.6875,2.6875z" fill="url(#color-12_6AytYvfD4mxm_gr12)"></path></g></g></svg>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <div class="fs-12 m-t-5">Pending Payments</div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
                                                 <div class="col">
-                                                    <div class="row">
-                                                        <div class="col">
-                                                            <list-component key="2" section="transferSection"
-                                                                            :endpoint="route('api.booking.list')"
-                                                                            :options="{per_page: 10, status: 2}">
-                                                                <template slot="list" slot-scope="{data}">
-                                                                    <booking-component
-                                                                        :data="data"></booking-component>
-                                                                </template>
-                                                            </list-component>
+                                                    <div class="row fs-12 text-center">
+                                                        <div class="col p-t-20 p-b-20 bg-master-lighter tabButton"
+                                                             tab-name="PO">
+                                                            <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="86" y1="15.84013" x2="86"
+                                                                                            y2="42.59956"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-1_1GEnKV6fhh62_gr1">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#4ec9ff"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#2bffe6"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-2_1GEnKV6fhh62_gr2">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-3_1GEnKV6fhh62_gr3">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-4_1GEnKV6fhh62_gr4">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-5_1GEnKV6fhh62_gr5">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-6_1GEnKV6fhh62_gr6">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-7_1GEnKV6fhh62_gr7">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-8_1GEnKV6fhh62_gr8">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-9_1GEnKV6fhh62_gr9">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-10_1GEnKV6fhh62_gr10">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="86" y1="14.46681" x2="86"
+                                                                                            y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-11_1GEnKV6fhh62_gr11">
+                                                                                <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 id="original-icon">
+                                                                                <path
+                                                                                        d="M95.40625,45.6875h-18.8125v-17.46875c0,-5.19494 4.21131,-9.40625 9.40625,-9.40625v0c5.19494,0 9.40625,4.21131 9.40625,9.40625z"
+                                                                                        fill="url(#color-1_1GEnKV6fhh62_gr1)"></path>
+                                                                                <rect x="19.043" y="33"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-2_1GEnKV6fhh62_gr2)"></rect>
+                                                                                <rect x="19.043" y="37"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-3_1GEnKV6fhh62_gr3)"></rect>
+                                                                                <rect x="19.043" y="42"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-4_1GEnKV6fhh62_gr4)"></rect>
+                                                                                <rect x="19.043" y="46"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-5_1GEnKV6fhh62_gr5)"></rect>
+                                                                                <rect x="19.043" y="24"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-6_1GEnKV6fhh62_gr6)"></rect>
+                                                                                <rect x="42" y="33"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-7_1GEnKV6fhh62_gr7)"></rect>
+                                                                                <rect x="42" y="42"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-8_1GEnKV6fhh62_gr8)"></rect>
+                                                                                <rect x="42" y="24"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-9_1GEnKV6fhh62_gr9)"></rect>
+                                                                                <rect x="19.043" y="28"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-10_1GEnKV6fhh62_gr10)"></rect>
+                                                                                <path
+                                                                                        d="M131.6875,32.7445v-0.4945c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625h-18.8125h-7.4605c-1.67163,-4.68163 -6.10331,-8.0625 -11.352,-8.0625c-5.24869,0 -9.68037,3.38087 -11.352,8.0625h-26.273c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v0.4945c-3.12288,1.11531 -5.375,4.06887 -5.375,7.568v107.5c0,4.44512 3.61738,8.0625 8.0625,8.0625h86c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-107.5c0,-3.49912 -2.25213,-6.45269 -5.375,-7.568zM123.625,29.5625c1.4835,0 2.6875,1.204 2.6875,2.6875h-21.5h-6.71875v-2.6875h6.71875zM79.28125,28.21875c0,-3.70606 3.01269,-6.71875 6.71875,-6.71875c3.70606,0 6.71875,3.01269 6.71875,6.71875v14.78125h-13.4375zM48.375,29.5625h25.53125v2.6875h-28.21875c0,-1.4835 1.204,-2.6875 2.6875,-2.6875zM131.6875,147.8125c0,1.4835 -1.204,2.6875 -2.6875,2.6875h-10.75v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h10.75zM131.6875,131.6875h-10.75c-4.44512,0 -8.0625,3.61738 -8.0625,8.0625v10.75h-69.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-107.5c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h30.90625v10.75h24.1875v-10.75h6.71875h24.1875c1.4835,0 2.6875,1.204 2.6875,2.6875z"
+                                                                                        fill="url(#color-11_1GEnKV6fhh62_gr11)"></path>
+                                                                            </g>
+                                                                        </g>
+                                                                    </svg>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <div class="fs-12 m-t-5">Purchase Orders</div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div class="col-4">
+                                            <div class="row justify-content-end">
+                                                <div class="col-8">
+                                                    <div class="row fs-12 text-center">
+                                                        <div class="col p-t-20 p-b-20 bg-master-lighter tabButton"
+                                                             tab-name="complete">
+                                                            <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="86" y1="15.84013" x2="86"
+                                                                                            y2="42.59956"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-1_1GEnKV6fhh62_gr1">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#4ec9ff"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#2bffe6"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-2_1GEnKV6fhh62_gr2">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-3_1GEnKV6fhh62_gr3">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-4_1GEnKV6fhh62_gr4">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-5_1GEnKV6fhh62_gr5">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="75.30644" y1="14.46681"
+                                                                                            x2="75.30644" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-6_1GEnKV6fhh62_gr6">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-7_1GEnKV6fhh62_gr7">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-8_1GEnKV6fhh62_gr8">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="116.90625" y1="14.46681"
+                                                                                            x2="116.90625" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-9_1GEnKV6fhh62_gr9">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="65.84106" y1="14.46681"
+                                                                                            x2="65.84106" y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-10_1GEnKV6fhh62_gr10">
+                                                                                <stop offset="0"
+                                                                                      stop-color="#009add"></stop>
+                                                                                <stop offset="1"
+                                                                                      stop-color="#00baa4"></stop>
+                                                                            </linearGradient>
+                                                                            <linearGradient x1="86" y1="14.46681" x2="86"
+                                                                                            y2="157.82344"
+                                                                                            gradientUnits="userSpaceOnUse"
+                                                                                            id="color-11_1GEnKV6fhh62_gr11">
+                                                                                <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 id="original-icon">
+                                                                                <path
+                                                                                        d="M95.40625,45.6875h-18.8125v-17.46875c0,-5.19494 4.21131,-9.40625 9.40625,-9.40625v0c5.19494,0 9.40625,4.21131 9.40625,9.40625z"
+                                                                                        fill="url(#color-1_1GEnKV6fhh62_gr1)"></path>
+                                                                                <rect x="19.043" y="33"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-2_1GEnKV6fhh62_gr2)"></rect>
+                                                                                <rect x="19.043" y="37"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-3_1GEnKV6fhh62_gr3)"></rect>
+                                                                                <rect x="19.043" y="42"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-4_1GEnKV6fhh62_gr4)"></rect>
+                                                                                <rect x="19.043" y="46"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-5_1GEnKV6fhh62_gr5)"></rect>
+                                                                                <rect x="19.043" y="24"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="17.957" height="2"
+                                                                                      fill="url(#color-6_1GEnKV6fhh62_gr6)"></rect>
+                                                                                <rect x="42" y="33"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-7_1GEnKV6fhh62_gr7)"></rect>
+                                                                                <rect x="42" y="42"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-8_1GEnKV6fhh62_gr8)"></rect>
+                                                                                <rect x="42" y="24"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="3" height="2"
+                                                                                      fill="url(#color-9_1GEnKV6fhh62_gr9)"></rect>
+                                                                                <rect x="19.043" y="28"
+                                                                                      transform="scale(2.6875,2.6875)"
+                                                                                      width="10.912" height="2"
+                                                                                      fill="url(#color-10_1GEnKV6fhh62_gr10)"></rect>
+                                                                                <path
+                                                                                        d="M131.6875,32.7445v-0.4945c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625h-18.8125h-7.4605c-1.67163,-4.68163 -6.10331,-8.0625 -11.352,-8.0625c-5.24869,0 -9.68037,3.38087 -11.352,8.0625h-26.273c-4.44512,0 -8.0625,3.61737 -8.0625,8.0625v0.4945c-3.12288,1.11531 -5.375,4.06887 -5.375,7.568v107.5c0,4.44512 3.61738,8.0625 8.0625,8.0625h86c4.44512,0 8.0625,-3.61738 8.0625,-8.0625v-107.5c0,-3.49912 -2.25213,-6.45269 -5.375,-7.568zM123.625,29.5625c1.4835,0 2.6875,1.204 2.6875,2.6875h-21.5h-6.71875v-2.6875h6.71875zM79.28125,28.21875c0,-3.70606 3.01269,-6.71875 6.71875,-6.71875c3.70606,0 6.71875,3.01269 6.71875,6.71875v14.78125h-13.4375zM48.375,29.5625h25.53125v2.6875h-28.21875c0,-1.4835 1.204,-2.6875 2.6875,-2.6875zM131.6875,147.8125c0,1.4835 -1.204,2.6875 -2.6875,2.6875h-10.75v-10.75c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h10.75zM131.6875,131.6875h-10.75c-4.44512,0 -8.0625,3.61738 -8.0625,8.0625v10.75h-69.875c-1.4835,0 -2.6875,-1.204 -2.6875,-2.6875v-107.5c0,-1.4835 1.204,-2.6875 2.6875,-2.6875h30.90625v10.75h24.1875v-10.75h6.71875h24.1875c1.4835,0 2.6875,1.204 2.6875,2.6875z"
+                                                                                        fill="url(#color-11_1GEnKV6fhh62_gr11)"></path>
+                                                                            </g>
+                                                                        </g>
+                                                                    </svg>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <div class="fs-12 m-t-5">Complete Orders</div>
+                                                                </div>
+                                                            </div>
                                                         </div>
                                                     </div>
                                                 </div>
                                             </div>
                                         </div>
                                     </div>
-                                    <div class="row tabsContainer tabContent hide" tab-name="payments">
-                                        <div class="col">
-                                            <div class="row">
+                                    <div class="row no-margin">
+                                        <div class="col bg-white padding-25">
+                                            <div class="row tabsContainer tabContent active" tab-name="transfers">
                                                 <div class="col">
                                                     <div class="row">
                                                         <div class="col">
-                                                            <list-component key="2" section="pendingPaymentsSection"
-                                                                            :endpoint="route('api.booking.list')"
-                                                                            :options="{per_page: 10, status: 2, pending_payment: true}">
-                                                                <template slot="list" slot-scope="{data}">
-                                                                    <booking-component
-                                                                        :data="data"></booking-component>
-                                                                </template>
-                                                            </list-component>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <list-component key="2" section="transferSection"
+                                                                                    :endpoint="route('api.booking.list')"
+                                                                                    :options="{per_page: 10, status: 2}">
+                                                                        <template slot="list" slot-scope="{data}">
+                                                                            <booking-component
+                                                                                    :data="data"></booking-component>
+                                                                        </template>
+                                                                    </list-component>
+                                                                </div>
+                                                            </div>
                                                         </div>
                                                     </div>
                                                 </div>
                                             </div>
-                                        </div>
-                                    </div>
-                                    <div class="row tabsContainer hide tabContent" tab-name="PO">
-                                        <div class="col">
-                                            <div class="row">
+                                            <div class="row tabsContainer tabContent hide" tab-name="payments">
                                                 <div class="col">
                                                     <div class="row">
                                                         <div class="col">
-                                                            <list-component key="2"
-                                                                            section="PendingPurchaseOrdersSection"
-                                                                            :endpoint="route('api.booking.list')"
-                                                                            :options="{per_page: 10, status: 2, pending_purchase_order: true}">
-                                                                <template slot="list" slot-scope="{data}">
-                                                                    <booking-component
-                                                                        :data="data"></booking-component>
-                                                                </template>
-                                                            </list-component>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <list-component key="2" section="pendingPaymentsSection"
+                                                                                    :endpoint="route('api.booking.list')"
+                                                                                    :options="{per_page: 10, status: 2, pending_payment: true}">
+                                                                        <template slot="list" slot-scope="{data}">
+                                                                            <booking-component
+                                                                                    :data="data"></booking-component>
+                                                                        </template>
+                                                                    </list-component>
+                                                                </div>
+                                                            </div>
                                                         </div>
                                                     </div>
                                                 </div>
                                             </div>
-                                        </div>
-                                    </div>
-                                    <div class="row tabsContainer tabContent hide" tab-name="complete">
-                                        <div class="col">
-                                            <div class="row">
+                                            <div class="row tabsContainer hide tabContent" tab-name="PO">
                                                 <div class="col">
                                                     <div class="row">
                                                         <div class="col">
-                                                            <list-component key="2"
-                                                                            section="completeTransferSection"
-                                                                            :endpoint="route('api.booking.list')"
-                                                                            :options="{per_page: 10, status: 3}">
-                                                                <template slot="list" slot-scope="{data}">
-                                                                    <booking-component
-                                                                        :data="data"></booking-component>
-                                                                </template>
-                                                            </list-component>
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <list-component key="2"
+                                                                                    section="PendingPurchaseOrdersSection"
+                                                                                    :endpoint="route('api.booking.list')"
+                                                                                    :options="{per_page: 10, status: 2, pending_purchase_order: true}">
+                                                                        <template slot="list" slot-scope="{data}">
+                                                                            <booking-component
+                                                                                    :data="data"></booking-component>
+                                                                        </template>
+                                                                    </list-component>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div class="row tabsContainer tabContent hide" tab-name="complete">
+                                                <div class="col">
+                                                    <div class="row">
+                                                        <div class="col">
+                                                            <div class="row">
+                                                                <div class="col">
+                                                                    <list-component key="2"
+                                                                                    section="completeTransferSection"
+                                                                                    :endpoint="route('api.booking.list')"
+                                                                                    :options="{per_page: 10, status: 3}">
+                                                                        <template slot="list" slot-scope="{data}">
+                                                                            <booking-component
+                                                                                    :data="data"></booking-component>
+                                                                        </template>
+                                                                    </list-component>
+                                                                </div>
+                                                            </div>
                                                         </div>
                                                     </div>
                                                 </div>
@@ -523,12 +535,12 @@
                         </div>
                     </div>
                 </div>
+                <div class="col-2 p-l-0 p-r-0 order-last">
+                    <verification-warning-component v-if="!isLoading && company.bookings.length"
+                                                    :data="company"></verification-warning-component>
+                </div>
             </div>
         </div>
-        <div class="col-2 p-l-0 p-r-0 order-last">
-            <verification-warning-component v-if="!isLoading && company.bookings.length"
-                                            :data="company"></verification-warning-component>
-        </div>
     </div>
 </template>
 <script>
diff --git a/resources/assets/vue/components/general/elements/ListComponent.vue b/resources/assets/vue/components/general/elements/ListComponent.vue
index c11278c5..50d2fa19 100644
--- a/resources/assets/vue/components/general/elements/ListComponent.vue
+++ b/resources/assets/vue/components/general/elements/ListComponent.vue
@@ -5,7 +5,7 @@
             <div class="col">
                 <div class="row">
                     <div class="col">
-                        <div class="row align-items-center justify-content-center p-t-50 p-b-50"  v-show="!$store.getters.getListData(section).length && !$store.getters.isLoading(section)">
+                        <div class="row align-items-center justify-content-center p-t-50 p-b-50"  v-show="!$store.getters.getListData(section).length && !$store.getters.isLoading(section) && emptyListSection">
                             <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>
@@ -64,6 +64,10 @@
                 default () {
                     return {}
                 }
+            },
+            emptyListSection: {
+                type: Boolean,
+                default: true
             }
         },
         data(){
diff --git a/resources/views/pages/settings.blade.php b/resources/views/pages/settings.blade.php
index ca07e88a..8fb76ae2 100644
--- a/resources/views/pages/settings.blade.php
+++ b/resources/views/pages/settings.blade.php
@@ -596,11 +596,4 @@
         </div>
     </div>
 </div>
-@endsection
-<script>
-    import CompanyQuickViewSectionComponent
-        from "../../assets/vue/components/companies/sections/CompanyQuickViewSectionComponent";
-    export default {
-        components: {CompanyQuickViewSectionComponent}
-    }
-</script>
\ No newline at end of file
+@endsection
\ No newline at end of file