Add pagination to /tasks UI route (#3)
* Initial plan * Add pagination (Pager component) to tasks page for navigating all results Co-authored-by: jbatesy <51190172+jbatesy@users.noreply.github.com> * Simplify Pager navigate handler per code review feedback Co-authored-by: jbatesy <51190172+jbatesy@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: jbatesy <51190172+jbatesy@users.noreply.github.com>
This commit is contained in:
parent
b9c5b0b7ad
commit
cd1d3e9e94
1 changed files with 17 additions and 2 deletions
|
|
@ -534,6 +534,20 @@
|
|||
</template>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="columns is-multiline"
|
||||
v-if="!toggleForm && !isLoading && pagination.total_pages > 1"
|
||||
>
|
||||
<div class="column is-12">
|
||||
<Pager
|
||||
:page="pagination.page"
|
||||
:last_page="pagination.total_pages"
|
||||
:isLoading="isLoading"
|
||||
@navigate="(newPage) => reloadContent(false, newPage)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="columns is-multiline"
|
||||
v-if="!toggleForm && (isLoading || !filteredTasks || filteredTasks.length < 1)"
|
||||
|
|
@ -639,6 +653,7 @@ const isMobile = useMediaQuery({ maxWidth: 1024 });
|
|||
const tasksComposable = useTasks();
|
||||
const {
|
||||
tasks,
|
||||
pagination,
|
||||
isLoading,
|
||||
addInProgress,
|
||||
isTaskInProgress,
|
||||
|
|
@ -758,9 +773,9 @@ const filteredTasks = computed(() => {
|
|||
return tasks.value.filter((task) => deepIncludes(task, q, new WeakSet()));
|
||||
}) as ComputedRef<Array<Task>>;
|
||||
|
||||
const reloadContent = async (fromMounted: boolean = false) => {
|
||||
const reloadContent = async (fromMounted: boolean = false, page?: number) => {
|
||||
try {
|
||||
await tasksComposable.loadTasks();
|
||||
await tasksComposable.loadTasks(page ?? pagination.value.page);
|
||||
|
||||
if (tasks.value.length > 0) {
|
||||
cleanStaleCache(tasks.value);
|
||||
|
|
|
|||
Loading…
Reference in a new issue