src/components/FetchData.vue

@@ -43,7 +43,6 @@ onMounted(async () => {
 });
 
 async function fetch(fetchFilter = {}) {
-    try {
     const filter = { ...fetchFilter, ...$props.filter }; // eslint-disable-line vue/no-dupe-keys
     if ($props.where && !fetchFilter.where) filter.where = $props.where;
     if ($props.sortBy) filter.order = $props.sortBy;
@@ -55,9 +54,6 @@ async function fetch(fetchFilter = {}) {
 
     emit('onFetch', data);
     return data;
-    } catch (e) {
-        //
-    }
 }
 </script>
 <template>

src/components/ui/VnPaginate.vue

@@ -125,7 +125,10 @@ watch(
 watch(
     () => store.data,
     (data) => {
-        if (!mounted.value) return;
+        if (!mounted.value) {
+            emit('onFetch', data);
+            return;
+        }
         emit('onChange', data);
     },
     { immediate: true }

src/composables/useArrayData.js

@@ -243,6 +243,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
 
     function updateStateParams(data) {
         if (!route?.path) return;
+        const usesModuleName = `/${store.data[0].id}` + userOptions.moduleName;
         const newUrl = { path: route.path, query: { ...(route.query ?? {}) } };
         if (store?.searchUrl)
             newUrl.query[store.searchUrl] = JSON.stringify(store.currentFilter);

src/pages/Ticket/Card/TicketBoxing.vue

@@ -28,7 +28,6 @@ const time = reactive({
     max: 24,
 });
 async function fetch() {
-    try {
     const filter = {
         where: {
             ticketFk: entityId.value,
@@ -39,9 +38,6 @@ async function fetch() {
     });
 
     if (data) expeditions.value = data;
-    } catch (e) {
-        //
-    }
 }
 
 async function getVideoList(expeditionId, timed) {

src/pages/Wagon/Type/WagonTypeEdit.vue

@@ -9,6 +9,7 @@ import { useI18n } from 'vue-i18n';
 import axios from 'axios';
 import VnPaginate from 'components/ui/VnPaginate.vue';
 import WagonCreateTray from './WagonCreateTray.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 
 const { t } = useI18n();
 const { notify } = useQuasar();
@@ -72,9 +73,24 @@ watch(
     },
     { deep: true }
 );
+
+const exprBuilder = (param, value) => {
+    switch (param) {
+        case 'search':
+            return /^\d+$/.test(value) ? { id: value } : { name: { like: `%${value}%` } };
+    }
+};
 </script>
 
 <template>
+    <VnSearchbar
+        url="WagonTypes"
+        data-key="WagonTypeList"
+        :label="t('searchWagonType')"
+        :info="t('searchInfo')"
+        :expr-builder="exprBuilder"
+        search-url="table"
+    />
     <VnSubToolbar />
     <QPage class="q-pa-sm q-mx-xl">
         <FormModel

src/pages/Wagon/Type/WagonTypeList.vue

@@ -9,6 +9,7 @@ import FormModelPopup from 'src/components/FormModelPopup.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnRow from 'src/components/ui/VnRow.vue';
 import VnTable from 'src/components/VnTable/VnTable.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 
 const quasar = useQuasar();
 const arrayData = useArrayData('WagonTypeList');
@@ -78,21 +79,36 @@ async function remove(row) {
     store.data.splice(store.data.indexOf(row), 1);
     window.location.reload();
 }
+
+const exprBuilder = (param, value) => {
+    switch (param) {
+        case 'search':
+            return /^\d+$/.test(value) ? { id: value } : { name: { like: `%${value}%` } };
+    }
+};
 </script>
 
 <template>
+    <VnSearchbar
+        url="WagonTypes"
+        data-key="WagonTypeList"
+        :label="t('searchWagonType')"
+        :info="t('searchInfo')"
+        :expr-builder="exprBuilder"
+        module-name="/edit"
+    />
     <QPage class="column items-center q-pa-md">
         <VnTable
             ref="tableRef"
             data-key="WagonTypeList"
             url="WagonTypes"
             :columns="columns"
-            auto-load
             order="id DESC"
             :right-search="false"
             :column-search="false"
             :default-mode="'card'"
             :disable-option="{ table: true }"
+            :expr-builder="exprBuilder"
         >
         </VnTable>
         <QPageSticky :offset="[18, 18]">
@@ -129,8 +145,12 @@ async function remove(row) {
 <i18n>
 en:
     nameNotEmpty: The name cannot be empty
+    searchWagonType: Search wagon type
+    searchInfo: You can search by name or id
 es:
     Create new Wagon type: Crear nuevo tipo de vagón
     Name: Nombre
     nameNotEmpty: El nombre no puede estar vacío
+    searchWagonType: Buscar tipo de vagón
+    searchInfo: Puedes buscar por nombre o id
 </i18n>

src/pages/Wagon/WagonCreate.vue

@@ -7,6 +7,7 @@ import VnInput from 'src/components/common/VnInput.vue';
 
 import { useRoute, useRouter } from 'vue-router';
 import axios from 'axios';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 
 onMounted(() => fetch());
 onUpdated(() => fetch());
@@ -54,7 +55,6 @@ async function onReset() {
 }
 
 async function fetch() {
-    try {
     await axios.get('WagonTypes').then(async (res) => {
         if (res.data) {
             filteredWagonTypes.value = wagonTypes = res.data;
@@ -72,9 +72,6 @@ async function fetch() {
             }
         });
     }
-    } catch (e) {
-        //
-    }
 }
 
 function filterType(val, update) {
@@ -85,9 +82,25 @@ function filterType(val, update) {
         );
     });
 }
+
+const exprBuilder = (param, value) => {
+    switch (param) {
+        case 'search':
+            return /^\d+$/.test(value)
+                ? { label: value }
+                : { plate: { like: `%${value}%` } };
+    }
+};
 </script>
 
 <template>
+    <VnSearchbar
+        url="Wagons"
+        data-key="WagonList"
+        :label="t('searchWagon')"
+        :info="t('searchInfo')"
+        :expr-builder="exprBuilder"
+    />
     <QPage class="q-pa-sm q-mx-xl">
         <QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
             <QCard class="q-pa-md">
@@ -174,3 +187,12 @@ function filterType(val, update) {
     width: 70%;
 }
 </style>
+
+<i18n>
+    en:
+        searchWagon: Search wagon
+        searchInfo: You can search by name or plate
+    es:
+        searchWagon: Buscar vagón
+        searchInfo: Puedes buscar por nombre o mátricula
+</i18n>

src/pages/Wagon/WagonList.vue

@@ -8,6 +8,7 @@ import VnTable from 'src/components/VnTable/VnTable.vue';
 import { computed, ref } from 'vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 
 const quasar = useQuasar();
 const arrayData = useArrayData('WagonList');
@@ -88,9 +89,25 @@ async function remove(row) {
         //
     }
 }
+
+const exprBuilder = (param, value) => {
+    switch (param) {
+        case 'search':
+            return /^\d+$/.test(value)
+                ? { label: value }
+                : { plate: { like: `%${value}%` } };
+    }
+};
 </script>
 
 <template>
+    <VnSearchbar
+        data-key="WagonList"
+        :label="t('searchWagon')"
+        :info="t('searchInfo')"
+        :expr-builder="exprBuilder"
+        module-name="/edit"
+    />
     <QPage class="column items-center q-pa-md">
         <VnTable
             ref="tableRef"
@@ -170,6 +187,11 @@ async function remove(row) {
 </template>
 
 <i18n>
-es:
+    en:
+        searchWagon: Search wagon
+        searchInfo: You can search by name or plate
+    es:
         Create new wagon: Crear nuevo vagón
+        searchWagon: Buscar vagón
+        searchInfo: Puedes buscar por nombre o mátricula
 </i18n>

src/pages/Zone/Delivery/ZoneDeliveryCreate.vue

@@ -34,7 +34,6 @@ let zoneDeliveryColors;
 let currentTrayColorPicked;
 
 async function fetch() {
-    try {
     await axios.get('ZoneConfigs').then(async (res) => {
         if (res.data) {
             zoneConfig = res.data[0];
@@ -88,9 +87,6 @@ async function fetch() {
             }
         });
     }
-    } catch (e) {
-        //
-    }
 }
 
 function addTray() {

src/pages/Zone/Upcoming/ZoneUpcomingCreate.vue

@@ -34,7 +34,6 @@ let zoneUpcomingColors;
 let currentTrayColorPicked;
 
 async function fetch() {
-    try {
     await axios.get('ZoneConfigs').then(async (res) => {
         if (res.data) {
             zoneConfig = res.data[0];
@@ -88,9 +87,6 @@ async function fetch() {
             }
         });
     }
-    } catch (e) {
-        //
-    }
 }
 
 function addTray() {