From fe27a432c76e3fb1262819c39e0df28f936bd18c Mon Sep 17 00:00:00 2001 From: Dominik Pschenitschni Date: Tue, 7 Sep 2021 17:04:46 +0200 Subject: [PATCH] feat: move unique functions from taskList to List --- src/components/tasks/mixins/taskList.js | 64 ++----------------------- src/views/list/views/List.vue | 62 +++++++++++++++++++++++- 2 files changed, 65 insertions(+), 61 deletions(-) diff --git a/src/components/tasks/mixins/taskList.js b/src/components/tasks/mixins/taskList.js index 4c490d2ee..5f9752da6 100644 --- a/src/components/tasks/mixins/taskList.js +++ b/src/components/tasks/mixins/taskList.js @@ -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, }, } \ No newline at end of file diff --git a/src/views/list/views/List.vue b/src/views/list/views/List.vue index 7fc31ba7c..1092eea97 100644 --- a/src/views/list/views/List.vue +++ b/src/views/list/views/List.vue @@ -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) + }) }, }, }