chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: 02, 08 => screen.xs fetch scroll

Browse source
This commit is contained in:
puriphatt 2025-01-29 14:02:10 +07:00
parent 6c48cb9383
commit 4a088c1aab
3 changed files with 347 additions and 298 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/pages/08_request-list/MainPage.vue
View file

@ -58,7 +58,8 @@ async function fetchList(opts?: { rotateFlowId?: boolean }) {
});
if (ret) {
data.value = ret.result;
$q.screen.xs ? data.value.push(...ret.result) : (data.value = ret.result);
pageState.total = ret.total;
pageMax.value = Math.ceil(ret.total / pageSize.value);
}
@ -332,20 +333,40 @@ watch([() => pageState.inputSearch, () => pageState.statusFilter], () =>
<NoData :not-found="!!pageState.inputSearch" />
</article>
<article v-else class="col surface-2 full-width scroll q-pa-md">
<TableRequestList
:columns="column"
:rows="data"
:grid="pageState.gridView"
:visible-columns="pageState.fieldSelected"
@view="(data) => triggerView({ requestData: data })"
@delete="(data) => triggerCancel(data.id)"
/>
<q-infinite-scroll
@load="
(_, done) => {
if ($q.screen.gt.xs) return;
page = page + 1;
fetchList({ rotateFlowId: true }).then(() =>
done(page >= pageMax),
);
}
"
>
<TableRequestList
:columns="column"
:rows="data"
:grid="pageState.gridView"
:visible-columns="pageState.fieldSelected"
@view="(data) => triggerView({ requestData: data })"
@delete="(data) => triggerCancel(data.id)"
/>
<template v-slot:loading>
<div
v-if="$q.screen.lt.sm && page !== pageMax"
class="row justify-center"
>
<q-spinner-dots color="primary" size="40px" />
</div>
</template>
</q-infinite-scroll>
</article>
<!-- SEC: footer content -->
<footer
class="row justify-between items-center q-px-md q-py-sm surface-2"
v-if="pageMax > 0"
v-if="pageMax > 0 && $q.screen.gt.xs"
>
<div class="col-4">
<div class="row items-center no-wrap">