diff --git a/resources/assets/vue/components/general/elements/OpenLinkInNewTabComponent.vue b/resources/assets/vue/components/general/elements/OpenLinkInNewTabComponent.vue
index abd31071..5e729360 100644
--- a/resources/assets/vue/components/general/elements/OpenLinkInNewTabComponent.vue
+++ b/resources/assets/vue/components/general/elements/OpenLinkInNewTabComponent.vue
@@ -1,9 +1,7 @@
 <template>
     <span>
-        <a class="m-b-15" @click.prevent="handleClick">
-            <button class="btn btn-success btn-xs">
-                {{ displayText }}
-            </button>
+        <a :class="customClass" @click.prevent="handleClick">
+            <slot></slot>
         </a>
     </span>
 </template>
@@ -11,28 +9,73 @@
   <script>
   export default {
     props: {
-      url: {
-        type: String,
-        required: true,
-      },
-      displayText: {
-        type: String,
-        default: "Export Data", // Default text, can be overridden via prop
-      },
+        url: {
+            type: String,
+            required: true,
+        },
+        isUrlProtected: {
+            type: Boolean,
+            default: false
+        },
+        customClass:{
+            type: String,
+            default: ''
+        }
     },
     methods: {
+        async download() {
+            fetch(this.url, {
+                method: 'GET',
+                headers: {
+                    'Authorization': 'Bearer ' + this.$store.getters.getAccessToken,
+                },
+            })
+            .then((response) => {
+                if (response.status === 200) {
+                    const contentDisposition = response.headers.get('Content-Disposition');
+                    const filename = contentDisposition ? contentDisposition.split('filename=')[1] : 'downloaded_file';
+
+                    return response.blob()
+                    .then((blob) => {
+                        const blobUrl = window.URL.createObjectURL(blob);
+                        const a = document.createElement('a');
+                        a.href = blobUrl;
+                        a.download = filename;
+                        a.style.display = 'none';
+                        document.body.appendChild(a);
+                        a.click();
+                        document.body.removeChild(a);
+                        window.URL.revokeObjectURL(blobUrl);
+                    });
+                } else {
+                    console.error('Request failed with status:', response.status);
+                }
+            })
+            .catch((error) => {
+                console.error('Network error:', error);
+            });
+        },
         handleClick(){
             if(window.LARAVEL_VAPOR_ENABLED){
                 this.submit(this.url, 'get', this.section, false, false);
             }
+            else if(this.isUrlProtected)
+            {
+                this.download();
+            }
             else{
                 window.open(this.url, '_blank');
             }
         },
         successHandler(response) {
+
             if(window.LARAVEL_VAPOR_ENABLED){
-                if (response.src) {
-                    window.location.href = response.src;
+                if (response.payload !== undefined && response.payload.src) {
+                    window.open(response.payload.src, '_blank');
+                }
+                else if (response.src) {
+                    // window.location.href = response.src;
+                    window.open(response.src, '_blank');
                 }
             }
         },
diff --git a/resources/views/pages/customers/index.blade.php b/resources/views/pages/customers/index.blade.php
index fcb83198..ba892e7e 100644
--- a/resources/views/pages/customers/index.blade.php
+++ b/resources/views/pages/customers/index.blade.php
@@ -267,7 +267,11 @@
                                         <!-- <a :href="route('leads.export')" class="m-b-15" target="_blank">
                                             <button class="btn btn-success btn-xs">Export Leads Data</button>
                                         </a> -->
-                                        <open-link-in-new-tab-component :url="route('leads.export')" :displayText="'Export Leads Data'"></open-link-in-new-tab-component>
+                                        <open-link-in-new-tab-component custom-class="btn btn-default no-border" :url="route('leads.export')">
+                                            <button class="btn btn-success btn-xs">
+                                                Export Leads Data
+                                            </button>
+                                        </open-link-in-new-tab-component>
                                         <list-component  key="2" section="leadCustomerListSection" :endpoint="route('api.company.list')" :options="{'business_type': 2, with_bookings:true, without_confirmed_payments: true, does_not_have_segments: [5]}">
                                             <template slot="list" slot-scope="{data}">
                                                 <company-component :data="data"></company-component>