diff --git a/src/components/PaginateData.vue b/src/components/PaginateData.vue
index e561af6b1..8f07e44a9 100644
--- a/src/components/PaginateData.vue
+++ b/src/components/PaginateData.vue
@@ -14,14 +14,14 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
-    url: {
-        type: String,
-        default: '',
-    },
     data: {
         type: Array,
         default: null,
     },
+    url: {
+        type: String,
+        default: '',
+    },
     filter: {
         type: Object,
         default: null,
@@ -62,7 +62,7 @@ const arrayData = useArrayData(props.dataKey, {
     where: props.where,
     limit: props.limit,
     order: props.order,
-    userParams: props.userParams
+    userParams: props.userParams,
 });
 const store = arrayData.store;
 
diff --git a/src/components/ui/VnSearchbar.vue b/src/components/ui/VnSearchbar.vue
index 5df2bc900..7585f09b3 100644
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@@ -23,11 +23,42 @@ const props = defineProps({
         required: false,
         default: true,
     },
+    url: {
+        type: String,
+        default: '',
+    },
+    filter: {
+        type: Object,
+        default: null,
+    },
+    where: {
+        type: Object,
+        default: null,
+    },
+    order: {
+        type: String,
+        default: '',
+    },
+    limit: {
+        type: Number,
+        default: 10,
+    },
+    userParams: {
+        type: Object,
+        default: null,
+    },
 });
 
 const router = useRouter();
 const route = useRoute();
-const arrayData = useArrayData(props.dataKey);
+const arrayData = useArrayData(props.dataKey, {
+    url: props.url,
+    filter: props.filter,
+    where: props.where,
+    limit: props.limit,
+    order: props.order,
+    userParams: props.userParams,
+});
 const store = arrayData.store;
 const searchText = ref('');
 
diff --git a/src/pages/Claim/Card/ClaimCard.vue b/src/pages/Claim/Card/ClaimCard.vue
index c03e5be85..fd827ca65 100644
--- a/src/pages/Claim/Card/ClaimCard.vue
+++ b/src/pages/Claim/Card/ClaimCard.vue
@@ -12,6 +12,7 @@ const { t } = useI18n();
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             data-key="ClaimList"
+            url="Claims/filter"
             :label="t('Search claim')"
             :info="t('You can search by claim id or customer name')"
         />
diff --git a/src/pages/Customer/Card/CustomerCard.vue b/src/pages/Customer/Card/CustomerCard.vue
index d3fb133cf..e3c349a4a 100644
--- a/src/pages/Customer/Card/CustomerCard.vue
+++ b/src/pages/Customer/Card/CustomerCard.vue
@@ -12,6 +12,7 @@ const { t } = useI18n();
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             data-key="CustomerList"
+            url="Clients/filter"
             :label="t('Search customer')"
             :info="t('You can search by customer id or name')"
         />
diff --git a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
index de3862835..031e8bbfe 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutCard.vue
@@ -12,6 +12,7 @@ const { t } = useI18n();
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             data-key="InvoiceOutList"
+            url="InvoiceOuts/filter"
             :label="t('Search invoice')"
             :info="t('You can search by invoice reference')"
         />
diff --git a/src/pages/Ticket/Card/TicketCard.vue b/src/pages/Ticket/Card/TicketCard.vue
index f644d47b2..c680441ff 100644
--- a/src/pages/Ticket/Card/TicketCard.vue
+++ b/src/pages/Ticket/Card/TicketCard.vue
@@ -12,6 +12,7 @@ const { t } = useI18n();
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             data-key="TicketList"
+            url="Tickets/filter"
             :label="t('Search ticket')"
             :info="t('You can search by ticket id or alias')"
         />
diff --git a/src/pages/Worker/Card/WorkerCard.vue b/src/pages/Worker/Card/WorkerCard.vue
index 02c472d19..65d863143 100644
--- a/src/pages/Worker/Card/WorkerCard.vue
+++ b/src/pages/Worker/Card/WorkerCard.vue
@@ -12,6 +12,7 @@ const { t } = useI18n();
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             data-key="WorkerList"
+            url="Workers/filter"
             :label="t('Search worker')"
             :info="t('You can search by worker id or name')"
         />