feat: move unique functions from taskList to List
This commit is contained in:
parent
f51371bbe0
commit
fe27a432c7
2 changed files with 65 additions and 61 deletions
|
@ -1,6 +1,5 @@
|
||||||
import TaskCollectionService from '@/services/taskCollection'
|
import TaskCollectionService from '@/services/taskCollection'
|
||||||
import cloneDeep from 'lodash/cloneDeep'
|
import cloneDeep from 'lodash/cloneDeep'
|
||||||
import {calculateItemPosition} from '../../../helpers/calculateItemPosition'
|
|
||||||
|
|
||||||
// FIXME: merge with DEFAULT_PARAMS in filters.vue
|
// FIXME: merge with DEFAULT_PARAMS in filters.vue
|
||||||
const DEFAULT_PARAMS = {
|
const DEFAULT_PARAMS = {
|
||||||
|
@ -25,7 +24,6 @@ export default {
|
||||||
|
|
||||||
loadedList: null,
|
loadedList: null,
|
||||||
|
|
||||||
showTaskSearch: false,
|
|
||||||
searchTerm: '',
|
searchTerm: '',
|
||||||
|
|
||||||
showTaskFilter: false,
|
showTaskFilter: false,
|
||||||
|
@ -70,9 +68,9 @@ export default {
|
||||||
|
|
||||||
const currentList = {
|
const currentList = {
|
||||||
id: list.listId,
|
id: list.listId,
|
||||||
params: params,
|
params,
|
||||||
search: search,
|
search,
|
||||||
page: page,
|
page,
|
||||||
}
|
}
|
||||||
if (JSON.stringify(currentList) === JSON.stringify(this.loadedList) && !forceLoading) {
|
if (JSON.stringify(currentList) === JSON.stringify(this.loadedList) && !forceLoading) {
|
||||||
return
|
return
|
||||||
|
@ -109,60 +107,6 @@ export default {
|
||||||
this.loadTasks(1, '', null, true)
|
this.loadTasks(1, '', null, true)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
sortTasks() {
|
getRouteForPagination,
|
||||||
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)
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
}
|
}
|
|
@ -154,6 +154,24 @@ import {mapState} from 'vuex'
|
||||||
import draggable from 'vuedraggable'
|
import draggable from 'vuedraggable'
|
||||||
import {calculateItemPosition} from '../../../helpers/calculateItemPosition'
|
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 {
|
export default {
|
||||||
name: 'List',
|
name: 'List',
|
||||||
data() {
|
data() {
|
||||||
|
@ -162,6 +180,7 @@ export default {
|
||||||
isTaskEdit: false,
|
isTaskEdit: false,
|
||||||
taskEditTask: TaskModel,
|
taskEditTask: TaskModel,
|
||||||
ctaVisible: false,
|
ctaVisible: false,
|
||||||
|
showTaskSearch: false,
|
||||||
|
|
||||||
drag: false,
|
drag: false,
|
||||||
dragOptions: {
|
dragOptions: {
|
||||||
|
@ -205,6 +224,27 @@ export default {
|
||||||
this.$nextTick(() => (this.ctaVisible = true))
|
this.$nextTick(() => (this.ctaVisible = true))
|
||||||
},
|
},
|
||||||
methods: {
|
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
|
// This function initializes the tasks page and loads the first page of tasks
|
||||||
initTasks(page, search = '') {
|
initTasks(page, search = '') {
|
||||||
this.taskEditTask = null
|
this.taskEditTask = null
|
||||||
|
@ -243,7 +283,27 @@ export default {
|
||||||
break
|
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)
|
||||||
|
})
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue