konrad
724275e653
All checks were successful
continuous-integration/drone/push Build is passing
Save sort order to local storage Save selected columns to localStorage Loading spinner More sorting Add sorting Styling and hiding of column filter Add checkbox to show/hide columns Use fancycheckbox everywhere Fix is done badge Change sort order in table view Add is done column to table Better text handling Refactor is done into seperate component Add pagination to table view Add assignees to table view Fix redirecting to table view Add date tooltip to date field Add date tooltip to date field labels for table view Styling Add basic table view Extend priority label Split list view in mixins Co-authored-by: kolaente <k@knt.li> Reviewed-on: #76
128 lines
3.0 KiB
JavaScript
128 lines
3.0 KiB
JavaScript
import TaskCollectionService from '../../../services/taskCollection'
|
|
|
|
/**
|
|
* This mixin provides a base set of methods and properties to get tasks on a list.
|
|
*/
|
|
export default {
|
|
data() {
|
|
return {
|
|
taskCollectionService: TaskCollectionService,
|
|
tasks: [],
|
|
|
|
pages: [],
|
|
currentPage: 0,
|
|
|
|
showTaskSearch: false,
|
|
searchTerm: '',
|
|
}
|
|
},
|
|
watch: {
|
|
'$route.query': 'loadTasksForPage', // Only listen for query path changes
|
|
},
|
|
created() {
|
|
this.taskCollectionService = new TaskCollectionService()
|
|
},
|
|
methods: {
|
|
loadTasks(page, search = '', params = {sort_by: ['done', 'id'], order_by: ['asc', 'desc']}) {
|
|
if (search !== '') {
|
|
params.s = search
|
|
}
|
|
this.taskCollectionService.getAll({listID: this.$route.params.id}, params, page)
|
|
.then(r => {
|
|
this.$set(this, 'tasks', r)
|
|
this.$set(this, 'pages', [])
|
|
this.currentPage = page
|
|
|
|
for (let i = 0; i < this.taskCollectionService.totalPages; i++) {
|
|
|
|
// Show ellipsis instead of all pages
|
|
if(
|
|
i > 0 && // Always at least the first page
|
|
(i + 1) < this.taskCollectionService.totalPages && // And the last page
|
|
(
|
|
// And the current with current + 1 and current - 1
|
|
(i + 1) > this.currentPage + 1 ||
|
|
(i + 1) < this.currentPage - 1
|
|
)
|
|
) {
|
|
// Only add an ellipsis if the last page isn't already one
|
|
if(this.pages[i - 1] && !this.pages[i - 1].isEllipsis) {
|
|
this.pages.push({
|
|
number: 0,
|
|
isEllipsis: true,
|
|
})
|
|
}
|
|
continue
|
|
}
|
|
|
|
this.pages.push({
|
|
number: i + 1,
|
|
isEllipsis: false,
|
|
})
|
|
}
|
|
})
|
|
.catch(e => {
|
|
this.error(e, this)
|
|
})
|
|
},
|
|
loadTasksForPage(e) {
|
|
// The page parameter can be undefined, in the case where the user loads a new list from the side bar menu
|
|
let page = e.page
|
|
if (typeof e.page === 'undefined') {
|
|
page = 1
|
|
}
|
|
let search = e.search
|
|
if (typeof e.search === 'undefined') {
|
|
search = ''
|
|
}
|
|
this.initTasks(page, search)
|
|
},
|
|
sortTasks() {
|
|
if (this.tasks === null || this.tasks === []) {
|
|
return
|
|
}
|
|
return this.tasks.sort(function(a,b) {
|
|
if (a.done < b.done)
|
|
return -1
|
|
if (a.done > b.done)
|
|
return 1
|
|
|
|
if (a.id > b.id)
|
|
return -1
|
|
if (a.id < b.id)
|
|
return 1
|
|
return 0
|
|
})
|
|
},
|
|
searchTasks() {
|
|
if (this.searchTerm === '') {
|
|
return
|
|
}
|
|
this.$router.push({
|
|
name: 'showList',
|
|
query: {search: this.searchTerm}
|
|
})
|
|
},
|
|
hideSearchBar() {
|
|
// This is a workaround.
|
|
// When clicking on the search button, @blur from the input is fired. If we
|
|
// would then directly hide the whole search bar directly, no click event
|
|
// from the button gets fired. To prevent this, we wait 200ms until we hide
|
|
// everything so the button has a chance of firering the search event.
|
|
setTimeout(() => {
|
|
this.showTaskSearch = false
|
|
}, 200)
|
|
},
|
|
getRouteForPagination(page = 1, type = 'list') {
|
|
return {
|
|
name: 'showListWithType',
|
|
params: {
|
|
type: type
|
|
},
|
|
query: {
|
|
page: page,
|
|
},
|
|
}
|
|
}
|
|
}
|
|
} |