feat: remove re-fetch when add element

src/pages/Order/Card/OrderCatalog.vue

@@ -75,19 +75,17 @@ watch(
     },
     { immediate: true }
 );
-const onItemSaved = (updatedItem) => {
-    requestAnimationFrame(() => {
-        scrollToItem(updatedItem.items[0].itemFk);
-    });
-};
+// const onItemSaved = (updatedItem) => {
+//     console.error(stateStore);
+// };
 
-const scrollToItem = async (id) => {
-    const element = itemRefs.value[id]?.$el;
-    if (element) {
-        element.scrollIntoView({ behavior: 'smooth', block: 'center' });
-    }
-};
-provide('onItemSaved', onItemSaved);
+// const scrollToItem = async (id) => {
+//     const element = itemRefs.value[id]?.$el;
+//     if (element) {
+//         element.scrollIntoView({ behavior: 'smooth', block: 'center' });
+//     }
+// };
+// provide('onItemSaved', onItemSaved);
 </script>
 
 <template>

src/pages/Order/Card/OrderCatalogItemDialog.vue

@@ -1,12 +1,12 @@
 <script setup>
 import toCurrency from 'src/filters/toCurrency';
-import { inject, ref } from 'vue';
+import { computed, inject, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import axios from 'axios';
 import { useRoute } from 'vue-router';
 import useNotify from 'composables/useNotify';
-import { useArrayData } from 'composables/useArrayData';
 import VnInputNumber from 'src/components/common/VnInputNumber.vue';
+import { useState } from 'src/composables/useState';
 
 const { t } = useI18n();
 const { notify } = useNotify();
@@ -18,9 +18,12 @@ const props = defineProps({
         required: true,
     },
 });
-const onItemSaved = inject('onItemSaved');
+const state = useState();
+
+const total = computed(() => state.get('orderTotal'));
+
+// const onItemSaved = inject('onItemSaved');
 const prices = ref((props.item.prices || []).map((item) => ({ ...item, quantity: 0 })));
-const descriptorData = useArrayData('orderData');
 const isLoading = ref(false);
 const addToOrder = async () => {
     if (isLoading.value) return;
@@ -30,9 +33,9 @@ const addToOrder = async () => {
         items,
         orderFk: Number(route.params.id),
     });
+    state.set('orderTotal', total.value + 100);
     notify(t('globals.dataSaved'), 'positive');
-    await descriptorData.fetch({});
-    onItemSaved({ ...props, items, saved: true });
+    //  onItemSaved({ ...props, items, saved: true });
     emit('added', items);
     isLoading.value = false;
 };

src/pages/Order/Card/OrderDescriptor.vue

@@ -63,21 +63,26 @@ const setData = (entity) => {
     if (!entity) return;
     getTotalRef.value && getTotalRef.value.fetch();
     data.value = useCardDescription(entity?.client?.name, entity?.id);
-    state.set('orderData', entity);
+    state.set('orderTotal', _total);
 };
 
 const getConfirmationValue = (isConfirmed) => {
     return t(isConfirmed ? 'globals.confirmed' : 'order.summary.notConfirmed');
 };
 
-const total = ref(null);
+const total = computed(() => state.get('orderTotal') ?? 0);
+const _total = ref(0);
 </script>
 
 <template>
     <FetchData
         ref="getTotalRef"
         :url="`Orders/${entityId}/getTotal`"
-        @on-fetch="(response) => (total = response)"
+        @on-fetch="
+            (response) => {
+                _total = response;
+            }
+        "
     />
     <CardDescriptor
         ref="descriptor"