feat: move unique functions from taskList to List

This commit is contained in:
Dominik Pschenitschni 2021-09-07 17:04:46 +02:00 committed by kolaente
parent f51371bbe0
commit fe27a432c7
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
2 changed files with 65 additions and 61 deletions

View file

@ -1,6 +1,5 @@
import TaskCollectionService from '@/services/taskCollection'
import cloneDeep from 'lodash/cloneDeep'
import {calculateItemPosition} from '../../../helpers/calculateItemPosition'
// FIXME: merge with DEFAULT_PARAMS in filters.vue
const DEFAULT_PARAMS = {
@ -25,7 +24,6 @@ export default {
loadedList: null,
showTaskSearch: false,
searchTerm: '',
showTaskFilter: false,
@ -70,9 +68,9 @@ export default {
const currentList = {
id: list.listId,
params: params,
search: search,
page: page,
params,
search,
page,
}
if (JSON.stringify(currentList) === JSON.stringify(this.loadedList) && !forceLoading) {
return
@ -109,60 +107,6 @@ export default {
this.loadTasks(1, '', null, true)
}
},
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.position < b.position)
return -1
if (a.position > b.position)
return 1
return 0
})
},
searchTasks() {
// Only search if the search term changed
if (this.$route.query === this.searchTerm) {
return
}
this.$router.push({
name: 'list.list',
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)
},
saveTaskPosition(e) {
this.drag = false
const task = this.tasks[e.newIndex]
const taskBefore = this.tasks[e.newIndex - 1] ?? null
const taskAfter = this.tasks[e.newIndex + 1] ?? null
task.position = calculateItemPosition(taskBefore !== null ? taskBefore.position : null, taskAfter !== null ? taskAfter.position : null)
this.$store.dispatch('tasks/update', task)
.then(r => {
this.$set(this.tasks, e.newIndex, r)
})
.catch(e => {
this.$message.error(e)
})
},
getRouteForPagination,
},
}

View file

@ -154,6 +154,24 @@ import {mapState} from 'vuex'
import draggable from 'vuedraggable'
import {calculateItemPosition} from '../../../helpers/calculateItemPosition'
function sortTasks(tasks) {
if (tasks === null || tasks === []) {
return
}
return tasks.sort((a, b) => {
if (a.done < b.done)
return -1
if (a.done > b.done)
return 1
if (a.position < b.position)
return -1
if (a.position > b.position)
return 1
return 0
})
}
export default {
name: 'List',
data() {
@ -162,6 +180,7 @@ export default {
isTaskEdit: false,
taskEditTask: TaskModel,
ctaVisible: false,
showTaskSearch: false,
drag: false,
dragOptions: {
@ -205,6 +224,27 @@ export default {
this.$nextTick(() => (this.ctaVisible = true))
},
methods: {
searchTasks() {
// Only search if the search term changed
if (this.$route.query === this.searchTerm) {
return
}
this.$router.push({
name: 'list.list',
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)
},
// This function initializes the tasks page and loads the first page of tasks
initTasks(page, search = '') {
this.taskEditTask = null
@ -243,7 +283,27 @@ export default {
break
}
}
this.sortTasks()
sortTasks(this.tasks)
},
saveTaskPosition(e) {
this.drag = false
const task = this.tasks[e.newIndex]
const taskBefore = this.tasks[e.newIndex - 1] ?? null
const taskAfter = this.tasks[e.newIndex + 1] ?? null
const newTask = {
...task,
position: calculateItemPosition(taskBefore !== null ? taskBefore.position : null, taskAfter !== null ? taskAfter.position : null),
}
this.$store.dispatch('tasks/update', newTask)
.then(r => {
this.$set(this.tasks, e.newIndex, r)
})
.catch(e => {
this.$message.error(e)
})
},
},
}