#6704 - ArrayData.Skip filter bug #156
|
@ -64,6 +64,20 @@ onMounted(() => {
|
|||
});
|
||||
|
||||
const isLoading = ref(false);
|
||||
async function search() {
|
||||
isLoading.value = true;
|
||||
const params = { ...userParams.value };
|
||||
store.userParamsChanged = true;
|
||||
store.filter.skip = 0;
|
||||
store.skip = 0;
|
||||
const { params: newParams } = await arrayData.addFilter({ params });
|
||||
userParams.value = newParams;
|
||||
|
||||
if (!props.showAll && !Object.values(params).length) store.data = [];
|
||||
|
||||
isLoading.value = false;
|
||||
emit('search');
|
||||
}
|
||||
|
||||
async function reload() {
|
||||
isLoading.value = true;
|
||||
|
@ -75,35 +89,14 @@ async function reload() {
|
|||
emit('refresh');
|
||||
}
|
||||
|
||||
async function search() {
|
||||
isLoading.value = true;
|
||||
const params = { ...userParams.value };
|
||||
store.pagination = true;
|
||||
store.userParamsChanged = true;
|
||||
store.filter.skip = 0;
|
||||
store.skip = 0;
|
||||
const { params: newParams } = await arrayData.addFilter({ params });
|
||||
userParams.value = newParams;
|
||||
|
||||
if (!props.showAll && !Object.values(params).length) store.data = [];
|
||||
|
||||
isLoading.value = false;
|
||||
// store.pagination = false;
|
||||
|
||||
emit('search');
|
||||
}
|
||||
async function remove(key) {
|
||||
userParams.value[key] = null;
|
||||
await search();
|
||||
emit('remove', key);
|
||||
}
|
||||
async function clearFilters() {
|
||||
isLoading.value = true;
|
||||
store.userParamsChanged = true;
|
||||
|
||||
store.filter.skip = 0;
|
||||
store.skip = 0;
|
||||
// Filtrar los params no removibles
|
||||
const removableFilters = Object.keys(userParams.value).filter((param) =>
|
||||
props.unremovableParams.includes(param)
|
||||
props.unremovableParams.includes(param)
|
||||
);
|
||||
const newParams = {};
|
||||
// Conservar solo los params que no son removibles
|
||||
|
@ -137,7 +130,11 @@ const customTags = computed(() =>
|
|||
tagsList.value.filter((tag) => (props.customTags || []).includes(tag.label))
|
||||
);
|
||||
|
||||
|
||||
async function remove(key) {
|
||||
userParams.value[key] = null;
|
||||
await search();
|
||||
emit('remove', key);
|
||||
}
|
||||
|
||||
function formatValue(value) {
|
||||
if (typeof value === 'boolean') {
|
||||
|
|
|
@ -1,19 +1,10 @@
|
|||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
ref,
|
||||
watch,
|
||||
onUnmounted,
|
||||
onRenderTriggered,
|
||||
onRenderTracked,
|
||||
} from 'vue';
|
||||
import { onMounted, ref, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const route = useRoute();
|
||||
const props = defineProps({
|
||||
dataKey: {
|
||||
type: String,
|
||||
|
@ -64,7 +55,7 @@ const props = defineProps({
|
|||
default: null,
|
||||
},
|
||||
});
|
||||
const infiniteScrollRef = ref();
|
||||
|
||||
const emit = defineEmits(['onFetch', 'onPaginate']);
|
||||
defineExpose({ fetch });
|
||||
const isLoading = ref(false);
|
||||
|
@ -89,32 +80,13 @@ onMounted(() => {
|
|||
if (props.autoLoad) fetch();
|
||||
});
|
||||
|
||||
// onRenderTracked((e)=>{
|
||||
// console.log(e)
|
||||
// });
|
||||
// onRenderTracked((e)=>{
|
||||
// console.log(e)
|
||||
// });
|
||||
|
||||
watch(
|
||||
() => [props.data, store],
|
||||
() => props.data,
|
||||
() => {
|
||||
// store.skip = 0;
|
||||
store.data = props.data;
|
||||
if (store.pagination) paginate();
|
||||
}
|
||||
);
|
||||
|
||||
// watch(
|
||||
// () => route.path,
|
||||
// async (newId, oldId) => {
|
||||
// if (newId!==oldId) {
|
||||
// // arrayData.hasMoreData.value = [];
|
||||
// arrayData.store.clear()
|
||||
// }
|
||||
// }
|
||||
// );
|
||||
|
||||
async function fetch() {
|
||||
await arrayData.fetch({ append: false });
|
||||
if (!arrayData.hasMoreData.value) {
|
||||
|
@ -129,14 +101,11 @@ async function paginate() {
|
|||
if (!props.url) return;
|
||||
|
||||
isLoading.value = true;
|
||||
// infiniteScrollRef.value.resume()
|
||||
await arrayData.loadMore();
|
||||
|
||||
if (!arrayData.hasMoreData.value) {
|
||||
// infiniteScrollRef.value.resume()
|
||||
if (store.userParamsChanged) arrayData.hasMoreData.value = true;
|
||||
store.userParamsChanged = false;
|
||||
|
||||
isLoading.value = false;
|
||||
return;
|
||||
}
|
||||
|
@ -154,7 +123,6 @@ async function paginate() {
|
|||
}
|
||||
|
||||
async function onLoad(...params) {
|
||||
console.log('ENTRA');
|
||||
if (!store.data) return;
|
||||
|
||||
const done = params[1];
|
||||
|
@ -165,13 +133,6 @@ async function onLoad(...params) {
|
|||
await paginate();
|
||||
let isDone = false;
|
||||
if (store.userParamsChanged) isDone = !arrayData.hasMoreData.value;
|
||||
// console.error('isDone', isDone);
|
||||
// if(isDone){
|
||||
// // infiniteScrollRef.value.trigger()
|
||||
// console.error('VnPaginate', isDone, arrayData.store.pagination)
|
||||
|
||||
// }
|
||||
// done(false);
|
||||
done(isDone);
|
||||
}
|
||||
</script>
|
||||
|
@ -210,7 +171,6 @@ async function onLoad(...params) {
|
|||
</div>
|
||||
</div>
|
||||
<QInfiniteScroll
|
||||
ref="infiniteScrollRef"
|
||||
v-if="store.data"
|
||||
@load="onLoad"
|
||||
:offset="offset"
|
||||
|
|
|
@ -98,17 +98,8 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
const { limit } = filter;
|
||||
|
||||
/*if (Object.keys(store.userParams).length > 0) {
|
||||
hasMoreData.value = true;
|
||||
} else if(store.userParamsChanged){
|
||||
hasMoreData.value = false;
|
||||
}
|
||||
else */hasMoreData.value = response.data.length === limit;
|
||||
// if (store.pagination) {
|
||||
// console.error('Before-ArrayData', store.pagination, hasMoreData.value)
|
||||
// hasMoreData.value = true;
|
||||
// console.error('After-ArrayData', store.pagination, hasMoreData.value)
|
||||
// }
|
||||
hasMoreData.value = response.data.length === limit;
|
||||
|
||||
if (append) {
|
||||
if (!store.data) store.data = [];
|
||||
for (const row of response.data) store.data.push(row);
|
||||
|
@ -153,18 +144,7 @@ export function useArrayData(key, userOptions) {
|
|||
store.userParams = userParams;
|
||||
store.skip = 0;
|
||||
store.filter.skip = 0;
|
||||
await fetch({ append: false, loadMore: true });
|
||||
return { filter, params };
|
||||
}
|
||||
async function removeFilter({ filter, params }) {
|
||||
if (filter) store.userFilter = Object.assign(store.userFilter, filter);
|
||||
|
||||
let userParams = Object.assign({}, store.userParams, params);
|
||||
userParams = sanitizerParams(userParams, store?.exprBuilder);
|
||||
|
||||
store.userParams = userParams;
|
||||
store.skip = 0;
|
||||
await loadMore({ append: false });
|
||||
await fetch({ append: false });
|
||||
return { filter, params };
|
||||
}
|
||||
|
||||
|
@ -188,7 +168,6 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
async function loadMore() {
|
||||
if (!hasMoreData.value) return;
|
||||
console.error('loadMore', hasMoreData.value);
|
||||
|
||||
store.skip = store.limit * page.value;
|
||||
page.value += 1;
|
||||
|
@ -207,7 +186,7 @@ export function useArrayData(key, userOptions) {
|
|||
if (store.skip) query.skip = store.skip;
|
||||
if (store.userParams && Object.keys(store.userParams).length !== 0)
|
||||
query.params = JSON.stringify(store.userParams);
|
||||
// hasMoreData.value = true;
|
||||
|
||||
if (router)
|
||||
router.replace({
|
||||
path: route.path,
|
||||
|
@ -222,7 +201,6 @@ export function useArrayData(key, userOptions) {
|
|||
fetch,
|
||||
applyFilter,
|
||||
addFilter,
|
||||
removeFilter,
|
||||
refresh,
|
||||
destroy,
|
||||
loadMore,
|
||||
|
|
|
@ -30,7 +30,7 @@ const body = {
|
|||
</script>
|
||||
<template>
|
||||
<div class="column items-center">
|
||||
<VnNotes
|
||||
<VnNotes style="overflow-y: scroll;"
|
||||
|
||||
:add-note="$props.addNote"
|
||||
:id="id"
|
||||
url="claimObservations"
|
||||
|
|
|
@ -19,8 +19,6 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
|
|||
order: '',
|
||||
data: ref(),
|
||||
isLoading: false,
|
||||
loadMore: false,
|
||||
pagination: false,
|
||||
userParamsChanged: true,
|
||||
alexm
commented
Aqui hay que poner false Aqui hay que poner false
|
||||
exprBuilder: null,
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue
Se añade la propiedad style para que muestre el scrollbar vertical SOLO en este componente