perf: remove onMounted and reload

src/pages/Customer/Card/CustomerContacts.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -11,10 +11,6 @@ const route = useRoute();
 const { t } = useI18n();
 
 const customerContactsRef = ref(null);
-
-onMounted(() => {
-    if (customerContactsRef.value) customerContactsRef.value.reload();
-});
 </script>
 <template>
     <div class="full-width flex justify-center">
@@ -30,6 +26,7 @@ onMounted(() => {
                 model="CustomerContacts"
                 ref="customerContactsRef"
                 url="ClientContacts"
+                auto-load
             >
                 <template #body="{ rows }">
                     <QCard class="q-pl-lg q-py-md">

src/pages/Entry/Card/EntryNotes.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -21,10 +21,6 @@ const sortEntryObservationOptions = (data) => {
     );
 };
 
-onMounted(() => {
-    if (entryObservationsRef.value) entryObservationsRef.value.reload();
-});
-
 const columns = computed(() => [
     {
         name: 'observationType',
@@ -65,6 +61,7 @@ const columns = computed(() => [
         ref="entryObservationsRef"
         :data-required="{ entryFk: params.id }"
         v-model:selected="selected"
+        auto-load
     >
         <template #body="{ rows, validate }">
             <QTable

src/pages/Item/Card/ItemBarcode.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, nextTick } from 'vue';
+import { ref, nextTick } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -23,10 +23,6 @@ const focusLastInput = () => {
         if (lastInput) lastInput.focus();
     });
 };
-
-onMounted(async () => {
-    if (itemBarcodeRef.value) itemBarcodeRef.value.reload();
-});
 </script>
 <template>
     <div class="full-width flex justify-center">
@@ -42,6 +38,7 @@ onMounted(async () => {
                 model="ItemBarcodes"
                 ref="itemBarcodeRef"
                 url="ItemBarcodes"
+                auto-load
             >
                 <template #body="{ rows }">
                     <QCard class="q-px-lg q-py-md">

src/pages/Item/Card/ItemTax.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -44,10 +44,6 @@ const submitTaxes = async (data) => {
         console.error('Error saving taxes', err);
     }
 };
-
-onMounted(async () => {
-    if (ItemTaxRef.value) ItemTaxRef.value.reload();
-});
 </script>
 <template>
     <FetchData
@@ -66,6 +62,7 @@ onMounted(async () => {
         data-key="ItemTax"
         model="ItemTax"
         ref="ItemTaxRef"
+        auto-load
     >
         <template #body="{ rows }">
             <QCard class="q-px-lg q-py-md">

src/pages/Route/Roadmap/RoadmapStops.vue

@@ -3,9 +3,9 @@ import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import FetchData from 'components/FetchData.vue';
-import { onMounted, ref } from 'vue';
+import { ref } from 'vue';
 import CrudModel from 'components/CrudModel.vue';
-import RoadmapAddStopForm from "pages/Route/Roadmap/RoadmapAddStopForm.vue";
+import RoadmapAddStopForm from 'pages/Route/Roadmap/RoadmapAddStopForm.vue';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -21,10 +21,6 @@ const updateDefaultStop = (data) => {
     eta.setDate(eta.getDate() + 1);
     defaultStop.value.eta = eta.toISOString();
 };
-
-onMounted(() => {
-    if (roadmapStopsCrudRef.value) roadmapStopsCrudRef.value.reload();
-});
 </script>
 <template>
     <VnSubToolbar />
@@ -43,6 +39,7 @@ onMounted(() => {
             :filter="{ where: { roadmapFk: route.params?.id } }"
             :default-remove="false"
             :data-required="defaultStop"
+            auto-load
         >
             <template #body="{ rows }">
                 <QCard class="q-pa-md">
@@ -51,7 +48,10 @@ onMounted(() => {
                         :key="index"
                         class="row no-wrap"
                     >
-                        <RoadmapAddStopForm :roadmap-fk="route.params?.id" :form-data="row" />
+                        <RoadmapAddStopForm
+                            :roadmap-fk="route.params?.id"
+                            :form-data="row"
+                        />
                         <div class="col-1 row justify-center items-center">
                             <QIcon
                                 name="delete"

src/pages/Supplier/Card/SupplierAccounts.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -59,10 +59,6 @@ const setWireTransfer = async () => {
         console.error('Error setting wire transfer', err);
     }
 };
-
-onMounted(() => {
-    if (supplierAccountRef.value) supplierAccountRef.value.reload();
-});
 </script>
 <template>
     <FetchData
@@ -94,6 +90,7 @@ onMounted(() => {
         :default-remove="false"
         :data-required="{ supplierFk: route.params.id }"
         @save-changes="onChangesSaved()"
+        auto-load
     >
         <template #body="{ rows }">
             <QCard class="q-pa-md">

src/pages/Supplier/Card/SupplierAgencyTerm.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -26,10 +26,6 @@ const supplierAgencyFilter = {
 const redirectToCreateView = () => {
     router.push({ name: 'SupplierAgencyTermCreate' });
 };
-
-onMounted(() => {
-    if (supplierAgencyTermRef.value) supplierAgencyTermRef.value.reload();
-});
 </script>
 <template>
     <FetchData
@@ -49,6 +45,7 @@ onMounted(() => {
         :data-required="{
             supplierFk: route.params.id,
         }"
+        auto-load
     >
         <template #body="{ rows }">
             <QCard class="q-pa-md">

src/pages/Supplier/Card/SupplierContacts.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, nextTick } from 'vue';
+import { ref, nextTick } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
@@ -19,10 +19,6 @@ const insertRow = () => {
         if (lastInput) lastInput.focus();
     });
 };
-
-onMounted(() => {
-    if (supplierContactRef.value) supplierContactRef.value.reload();
-});
 </script>
 
 <template>
@@ -36,6 +32,7 @@ onMounted(() => {
         ref="supplierContactRef"
         :default-remove="false"
         :data-required="{ supplierFk: route.params.id }"
+        auto-load
     >
         <template #body="{ rows }">
             <QCard class="q-pa-md">