verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 87 Releases Wiki Activity

warmFix_hasMoreData #308

Merged
jorgep merged 10 commits from warmFix_hasMoreData into dev 2024-04-23 07:12:55 +00:00
Conversation 2 Commits 10 Files Changed 5 +13 -11
2 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit c638209f0e - Show all commits

21
src/components/ui/VnPaginate.vue
View File

@ -1,5 +1,5 @@
<script setup>
import { onMounted, ref, watch } from 'vue';
import { onMounted, ref, watch, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useArrayData } from 'composables/useArrayData';
@ -77,7 +77,7 @@ const arrayData = useArrayData(props.dataKey, {
userParams: props.userParams,
exprBuilder: props.exprBuilder,
});
const hasMoreData = ref();
const hasMoreData = computed(() => arrayData.hasMoreData);
const store = arrayData.store;
jorgep commented 2024-04-22 10:59:39 +00:00
Outdated
Review
Copy Link

copia de la propiedad computed

copia de la propiedad computed
onMounted(() => {
@ -97,7 +97,7 @@ const addFilter = async (filter, params) => {
async function fetch() {
await arrayData.fetch({ append: false });
if (!arrayData.hasMoreData.value) {
if (!hasMoreData.value) {
isLoading.value = false;
}
emit('onFetch', store.data);
@ -110,8 +110,8 @@ async function paginate() {
isLoading.value = true;
await arrayData.loadMore();
if (!arrayData.hasMoreData.value) {
if (store.userParamsChanged) arrayData.hasMoreData.value = true;
if (!hasMoreData.value) {
if (store.userParamsChanged) hasMoreData.value = true;
store.userParamsChanged = false;
endPagination();
return;
@ -142,7 +142,7 @@ async function onLoad(index, done) {
await paginate();
let isDone = false;
if (store.userParamsChanged) isDone = !arrayData.hasMoreData.value;
if (store.userParamsChanged) isDone = !hasMoreData.value;
done(isDone);
}
@ -182,12 +182,12 @@ defineExpose({ fetch, addFilter });
</QCard>
</div>
</div>
<QInfiniteScroll
v-if="store.data"
@load="onLoad"
jorgep commented 2024-04-22 11:01:27 +00:00
Outdated
Review
Copy Link

Al hacer una copia de la propiedad computed dentro del componente, se puede usar con normalidad la propiedad. Si se quiere hacer arrayData.hasMoreData , hay que añadir .value Si no, no funciona y es muy lioso porque de normal no se hace .value dentro del template.

Al hacer una copia de la propiedad computed dentro del componente, se puede usar con normalidad la propiedad. Si se quiere hacer arrayData.hasMoreData , hay que añadir *.value* Si no, no funciona y es muy lioso porque de normal no se hace .value dentro del template.
:offset="offset"
:disable="disableInfiniteScroll || !arrayData.hasMoreData"
:disable="disableInfiniteScroll || !hasMoreData.value"
class="full-width"
v-bind="$attrs"
>
@ -196,7 +196,10 @@ defineExpose({ fetch, addFilter });
<QSpinner color="orange" size="md" />
</div>
</QInfiniteScroll>
<div v-if="!isLoading && hasMoreData" class="w-full flex justify-center q-mt-md">
<div
v-if="!isLoading && hasMoreData.value"
class="w-full flex justify-center q-mt-md"
>
<QBtn color="primary" :label="t('Load more data')" @click="paginate()" />
</div>
</template>

3
src/composables/useArrayData.js
View File

@ -97,7 +97,6 @@ export function useArrayData(key, userOptions) {
const { limit } = filter;
hasMoreData.value = limit && response.data.length >= limit;
jorgep commented 2024-04-22 11:01:59 +00:00
Outdated
Review
Copy Link

Actualiza la prop.

Actualiza la prop.
store.hasMoreData = hasMoreData.value;
if (append) {
if (!store.data) store.data = [];
@ -169,7 +168,7 @@ export function useArrayData(key, userOptions) {
}
async function loadMore() {
if (!hasMoreData.value && !store.hasMoreData) return;
if (!hasMoreData.value) return;
store.skip = store.limit * page.value;
page.value += 1;