HOTFIX: OrderCatalog scroll To Item #1026
|
@ -67,7 +67,7 @@ const dialog = ref(null);
|
|||
<QTooltip>{{ t('globals.add') }}</QTooltip>
|
||||
<QPopupProxy ref="dialog">
|
||||
<OrderCatalogItemDialog
|
||||
:prices="item.prices"
|
||||
:item="item"
|
||||
@added="() => dialog.hide()"
|
||||
/>
|
||||
</QPopupProxy>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { onMounted, onUnmounted, ref, computed, watch } from 'vue';
|
||||
import { onMounted, onUnmounted, ref, computed, watch, provide, nextTick } from 'vue';
|
||||
import axios from 'axios';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||
|
@ -18,6 +18,7 @@ const dataKey = 'OrderCatalogList';
|
|||
const arrayData = useArrayData(dataKey);
|
||||
const store = arrayData.store;
|
||||
const tags = ref([]);
|
||||
const itemRefs = ref({});
|
||||
|
||||
let catalogParams = {
|
||||
orderFk: route.params.id,
|
||||
|
@ -76,6 +77,20 @@ watch(
|
|||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
const onItemSaved = (updatedItem) => {
|
||||
scrollToItem(updatedItem.items[0].itemFk);
|
||||
};
|
||||
|
||||
const scrollToItem = async (id) => {
|
||||
await nextTick();
|
||||
setTimeout(() => {
|
||||
|
||||
const element = itemRefs.value[id]?.$el;
|
||||
if (element) {
|
||||
element.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
}
|
||||
}, 100);
|
||||
};
|
||||
provide('onItemSaved', onItemSaved);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -115,6 +130,7 @@ watch(
|
|||
<CatalogItem
|
||||
v-for="row in rows"
|
||||
:key="row.id"
|
||||
:ref="(el) => (itemRefs[row.id] = el)"
|
||||
:item="row"
|
||||
is-catalog
|
||||
class="fill-icon"
|
||||
|
|
Loading…
Reference in New Issue
Y si lo tuviese que cargar tardase 101ms ya no iria?
Le puse el nextTick para que el DOM terminase de montarse pero no terminaba de funcionar
Con el setTimeout conseguí el efecto deseado
Iría de todas maneras porque el timeout no depende de la petición anterior
https://chatgpt.com/c/675000bd-53e8-8011-8a7a-0481f274180d
Resuelto con requestAnimationFrame
He usado un console.error y solo se muestra 1 vez