fix(customer_sms: fix reload

src/components/ui/VnSms.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onBeforeMount } from 'vue';
+import { watch, computed } from 'vue';
 import { date } from 'quasar';
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 import VnAvatar from '../ui/VnAvatar.vue';
@@ -10,7 +10,8 @@ const $props = defineProps({
     where: { type: Object, default: () => {} },
 });
 
-const filter = {
+const filter = computed(() => {
+    return {
         fields: ['smsFk'],
         include: {
             relation: 'sms',
@@ -32,9 +33,9 @@ const filter = {
                 },
             },
         },
-};
-
-onBeforeMount(() => (filter.where = $props.where));
+        ...{ where: $props.where },
+    };
+});
 
 function formatNumber(number) {
     if (number.length <= 10) return number;

src/pages/Customer/Card/CustomerNotes.vue

@@ -1,15 +1,18 @@
 <script setup>
+import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import VnNotes from 'src/components/ui/VnNotes.vue';
 
 const route = useRoute();
 
-const noteFilter = {
+const noteFilter = computed(() => {
+    return {
         order: 'created DESC',
         where: {
             clientFk: `${route.params.id}`,
         },
-};
+    };
+});
 </script>
 
 <template>

src/pages/Customer/Card/CustomerSms.vue

@@ -1,17 +1,16 @@
 <script setup>
+import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import VnSms from 'src/components/ui/VnSms.vue';
 
 const route = useRoute();
-const id = route.params.id;
-
-const where = {
-    clientFk: id,
+const where = computed(() => {
+    return {
+        clientFk: route.params.id,
         ticketFk: null,
-};
+    };
+});
 </script>
 <template>
-    <div class="column items-center">
     <VnSms url="clientSms" :where="where" />
-    </div>
 </template>