perf: rename prop

src/components/ui/VnFilterPanel.vue

@@ -61,9 +61,12 @@ const $props = defineProps({
         type: Object,
         default: null,
     },
-    useSearchbar: {
-        type: [Boolean, Function],
-        default: false,
+    searchbarOptions: {
+        type: Object,
+        default: () => ({
+            use: false,
+            validateFn: null,
+        }),
     },
 });
 
@@ -99,17 +102,17 @@ defineExpose({ search, params: userParams, remove });
 
 async function search(evt) {
     try {
-        if ($props.useSearchbar) {
+        if ($props.searchbarOptions.use) {
             if (!searchbar.value) {
                 return;
             }
-            if (typeof $props.useSearchbar === 'function') {
-                $props.useSearchbar(userParams.value);
+            if (typeof $props.searchbarOptions.validateFn === 'function') {
+                $props.searchbarOptions.validateFn(userParams.value);
+            }
 
-                if (!Object.keys(userParams.value).length) {
-                    searchbar.value();
-                    return;
-                }
+            if (!Object.keys(userParams.value).length) {
+                searchbar.value();
+                return;
             }
         }
         if (evt && $props.disableSubmitEvent) return;

src/pages/Ticket/TicketFilter.vue

@@ -76,7 +76,7 @@ function validateDateRange(params) {
     <VnFilterPanel
         :data-key="props.dataKey"
         :search-button="true"
-        :use-searchbar="validateDateRange"
+        :searchbar-options="{ use: true, validateFn: validateDateRange }"
     >
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">

test/cypress/integration/ticket/tickeFilter.spec.js

@@ -19,16 +19,16 @@ describe('TicketFilter', () => {
         cy.on('uncaught:exception', () => {
             return false;
         });
-        cy.get('.q-field__control-container > [data-cy="From_date"]').type(
-            '14-02-2025{enter}',
-        );
+        cy.get('.q-field__control-container > [data-cy="From_date"]')
+            .type(`${today()} `)
+            .type('{enter}');
         cy.get('.q-notification').should(
             'contain',
             `The date range must have both 'from' and 'to'`,
         );
 
         cy.get('.q-field__control-container > [data-cy="To_date"]').type(
-            '16/02/2025{enter}',
+            `${today()}{enter}`,
         );
         cy.intercept('GET', /\/api\/Tickets\/filter/).as('ticketFilter');
         cy.searchBtnFilterPanel();
@@ -40,3 +40,12 @@ describe('TicketFilter', () => {
         cy.location('href').should('contain', '#/ticket/999999');
     });
 });
+function today() {
+    // return new Date().toISOString().split('T')[0];
+
+    return new Intl.DateTimeFormat('es-ES', {
+        day: '2-digit',
+        month: '2-digit',
+        year: 'numeric',
+    }).format(new Date());
+}