This commit is contained in:
Javier Segarra 2024-05-25 11:38:27 +02:00
parent 1ca6bce7fe
commit 2361042fac
1 changed files with 28 additions and 33 deletions

View File

@ -92,18 +92,18 @@ const value = computed({
}); });
function setOptions(data, append = false) { function setOptions(data, append = false) {
if (isLoading.value) { // if (isLoading.value) {
data.unshift(...myOptions.value); // data.unshift(...myOptions.value);
} // }
if (arrayData.store) { // if (arrayData.store) {
// arrayData.store.data = data; // // arrayData.store.data = data;
arrayData.store.hasMoreData = data.length === +$props.limit; // arrayData.store.hasMoreData = data.length === +$props.limit;
append && myOptions.value.concat(data); // append && myOptions.value.concat(data);
// myOptionsOriginal.value = JSON.parse(JSON.stringify(data)); // // myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
} else { // } else {
myOptions.value = JSON.parse(JSON.stringify(data)); myOptions.value = JSON.parse(JSON.stringify(data));
myOptionsOriginal.value = JSON.parse(JSON.stringify(data)); myOptionsOriginal.value = JSON.parse(JSON.stringify(data));
} // }
} }
const useURL = computed(() => $props.url?.length > 0); const useURL = computed(() => $props.url?.length > 0);
const arrayData = useURL.value const arrayData = useURL.value
@ -115,11 +115,22 @@ const arrayData = useURL.value
limit: $props.limit, limit: $props.limit,
}) })
: ref(null); : ref(null);
onMounted(() => { onMounted(async () => {
setOptions(options.value); setOptions(options.value);
if ($props.url && $props.modelValue) fetchFilter($props.modelValue); if ($props.url && $props.modelValue) fetchFilter($props.modelValue);
else {
const { data } = await arrayData.fetch({ append: true });
setOptions(data);
}
}); });
watch(modelValue, (newValue) => {
if (useURL.value) return;
if (!myOptions.value.some((option) => option[optionValue.value] == newValue))
fetchFilter(newValue);
});
const isLoading = ref(false);
function filter(val, options) { function filter(val, options) {
const search = val.toString().toLowerCase(); const search = val.toString().toLowerCase();
@ -156,9 +167,7 @@ async function filterHandler(val, update) {
if (!$props.defaultFilter) return update(); if (!$props.defaultFilter) return update();
let newOptions; let newOptions;
if ($props.url && !isLoading.value) { if ($props.url && !isLoading.value) {
isLoading.value = true; return;
newOptions = await fetchFilter(val);
isLoading.value = false;
} else newOptions = filter(val, myOptionsOriginal.value); } else newOptions = filter(val, myOptionsOriginal.value);
update( update(
() => { () => {
@ -173,16 +182,6 @@ async function filterHandler(val, update) {
); );
} }
watch(options, (newValue) => {
setOptions(newValue);
});
watch(modelValue, (newValue) => {
if (!myOptions.value.some((option) => option[optionValue.value] == newValue))
fetchFilter(newValue);
});
const isLoading = ref(false);
async function onScroll(scrollEv) { async function onScroll(scrollEv) {
const { to, direction, from, index } = scrollEv; const { to, direction, from, index } = scrollEv;
const lastIndex = myOptions.value.length - 1; const lastIndex = myOptions.value.length - 1;
@ -194,13 +193,9 @@ async function onScroll(scrollEv) {
isLoading.value = true; isLoading.value = true;
!$props.url && (await $props.fetchRef.paginate()); !$props.url && (await $props.fetchRef.paginate());
$props.url && (await arrayData.loadMore()); $props.url && (await arrayData.loadMore());
setOptions( setOptions(arrayData.store.data);
arrayData.store.data.slice( vnSelectRef.value.scrollTo(lastIndex);
myOptions.value.length,
myOptions.value.length + 5
),
true
);
isLoading.value = false; isLoading.value = false;
} }
} }