frontend/src/composables/useTaskList.ts

115 lines
2.6 KiB
TypeScript
Raw Normal View History

import {ref, shallowReactive, watch, computed} from 'vue'
2021-12-10 14:29:28 +00:00
import {useRoute} from 'vue-router'
2021-10-25 20:17:23 +00:00
import TaskCollectionService from '@/services/taskCollection'
import type {ITask} from '@/modelTypes/ITask'
import {error} from '@/message'
2021-10-25 20:17:23 +00:00
export type Order = 'asc' | 'desc' | 'none'
export interface SortBy {
id?: Order
index?: Order
done?: Order
title?: Order
priority?: Order
due_date?: Order
start_date?: Order
end_date?: Order
percent_done?: Order
created?: Order
updated?: Order
}
2021-10-25 20:17:23 +00:00
// FIXME: merge with DEFAULT_PARAMS in filters.vue
export const getDefaultParams = () => ({
sort_by: ['position', 'id'],
order_by: ['asc', 'desc'],
filter_by: ['done'],
filter_value: ['false'],
filter_comparator: ['equals'],
filter_concat: 'and',
})
const SORT_BY_DEFAULT: SortBy = {
2021-12-10 14:29:28 +00:00
id: 'desc',
}
// This makes sure an id sort order is always sorted last.
// When tasks would be sorted first by id and then by whatever else was specified, the id sort takes
// precedence over everything else, making any other sort columns pretty useless.
function formatSortOrder(sortBy, params) {
2021-12-10 14:29:28 +00:00
let hasIdFilter = false
const sortKeys = Object.keys(sortBy)
2021-12-10 14:29:28 +00:00
for (const s of sortKeys) {
if (s === 'id') {
sortKeys.splice(s, 1)
hasIdFilter = true
break
}
}
if (hasIdFilter) {
sortKeys.push('id')
2021-10-25 20:17:23 +00:00
}
2021-12-10 14:29:28 +00:00
params.sort_by = sortKeys
params.order_by = sortKeys.map(s => sortBy[s])
2021-10-25 20:17:23 +00:00
2021-12-10 14:29:28 +00:00
return params
}
2021-10-25 20:17:23 +00:00
/**
* This mixin provides a base set of methods and properties to get tasks.
*/
2023-03-22 16:19:59 +00:00
export function useTaskList(projectId) {
const page = ref(1)
2021-12-10 14:29:28 +00:00
const getAllTasksParams = computed(() => {
return [
{projectId: projectId.value},
2023-03-22 16:19:59 +00:00
// TODO_OFFLINE still need sorting by position.
{},
2021-12-10 14:29:28 +00:00
page.value || 1,
]
})
const taskCollectionService = shallowReactive(new TaskCollectionService())
const loading = computed(() => taskCollectionService.loading)
const totalPages = computed(() => taskCollectionService.totalPages)
2021-11-01 17:19:59 +00:00
const tasks = ref<ITask[]>([])
2021-12-10 14:29:28 +00:00
async function loadTasks() {
tasks.value = []
try {
tasks.value = await taskCollectionService.getAll(...getAllTasksParams.value)
} catch (e) {
error(e)
}
2021-11-01 17:19:59 +00:00
return tasks.value
2021-10-25 20:17:23 +00:00
}
2021-12-10 14:29:28 +00:00
const route = useRoute()
watch(() => route.query, (query) => {
2023-03-22 16:19:59 +00:00
const { page: pageQueryValue } = query
if (pageQueryValue !== undefined) {
page.value = Number(pageQueryValue)
}
2021-12-10 14:29:28 +00:00
}, { immediate: true })
// Only listen for query path changes
watch(() => JSON.stringify(getAllTasksParams.value), (newParams, oldParams) => {
if (oldParams === newParams) {
return
2021-10-25 20:17:23 +00:00
}
2021-12-10 14:29:28 +00:00
loadTasks()
}, { immediate: true })
2021-10-25 20:17:23 +00:00
return {
tasks,
loading,
totalPages,
2021-12-10 14:29:28 +00:00
currentPage: page,
2021-10-25 20:17:23 +00:00
loadTasks,
}
}