@@ -307,76 +20,39 @@
import auth from '../../auth'
import router from '../../router'
import message from '../../message'
- import flatPickr from 'vue-flatpickr-component'
- import 'flatpickr/dist/flatpickr.css'
- import multiselect from 'vue-multiselect'
- import {differenceWith} from 'lodash'
- import ListService from '../../services/list'
- import TaskService from '../../services/task'
- import TaskModel from '../../models/task'
+ import ShowListTask from '../tasks/ShowListTasks'
+ import Gantt from '../tasks/Gantt'
+
import ListModel from '../../models/list'
- import UserModel from '../../models/user'
- import UserService from '../../services/user'
- import priorities from '../../models/priorities'
- import LabelTaskService from '../../services/labelTask'
- import LabelService from '../../services/label'
- import LabelTaskModel from '../../models/labelTask'
- import LabelModel from '../../models/label'
+ import ListService from '../../services/list'
export default {
data() {
return {
listID: this.$route.params.id,
listService: ListService,
- taskService: TaskService,
-
- priorities: priorities,
- list: {},
- newTask: TaskModel,
- isTaskEdit: false,
- taskEditTask: {
- subtasks: [],
- },
- lastReminder: 0,
- nowUnix: new Date(),
- flatPickerConfig:{
- altFormat: 'j M Y H:i',
- altInput: true,
- dateFormat: 'Y-m-d H:i',
- enableTime: true,
- onOpen: this.updateLastReminderDate,
- onClose: this.addReminderDate,
- },
-
- newAssignee: UserModel,
- userService: UserService,
- foundUsers: [],
-
- labelService: LabelService,
- labelTaskService: LabelTaskService,
- foundLabels: [],
- labelTimeout: null,
+ list: ListModel,
}
},
components: {
- flatPickr,
- multiselect,
+ Gantt,
+ ShowListTask,
},
beforeMount() {
// Check if the user is already logged in, if so, redirect him to the homepage
if (!auth.user.authenticated) {
router.push({name: 'home'})
}
+
+ // If the type is invalid, redirect the user
+ if (this.$route.params.type !== 'gantt' && this.$route.params.type !== '') {
+ router.push({name: 'showList', params: { id: this.$route.params.id }})
+ }
},
created() {
this.listService = new ListService()
- this.taskService = new TaskService()
- this.newTask = new TaskModel()
- this.userService = new UserService()
- this.newAssignee = new UserModel()
- this.labelService = new LabelService()
- this.labelTaskService = new LabelTaskService()
+ this.list = new ListModel()
this.loadList()
},
watch: {
@@ -385,7 +61,6 @@
},
methods: {
loadList() {
- this.isTaskEdit = false
// We create an extra list object instead of creating it in this.list because that would trigger a ui update which would result in bad ux.
let list = new ListModel({id: this.$route.params.id})
this.listService.get(list)
@@ -396,195 +71,6 @@
message.error(e, this)
})
},
- addTask() {
- this.newTask.listID = this.$route.params.id
- this.taskService.create(this.newTask)
- .then(r => {
- this.list.addTaskToList(r)
- message.success({message: 'The task was successfully created.'}, this)
- })
- .catch(e => {
- message.error(e, this)
- })
-
- this.newTask = {}
- },
- markAsDone(e) {
- let updateFunc = () => {
- // We get the task, update the 'done' property and then push it to the api.
- let task = this.list.getTaskByID(e.target.id)
- task.done = e.target.checked
- this.taskService.update(task)
- .then(r => {
- this.updateTaskInList(r)
- message.success({message: 'The task was successfully ' + (task.done ? '' : 'un-') + 'marked as done.'}, this)
- })
- .catch(e => {
- message.error(e, this)
- })
- }
-
- if (e.target.checked) {
- setTimeout(updateFunc(), 300); // Delay it to show the animation when marking a task as done
- } else {
- updateFunc() // Don't delay it when un-marking it as it doesn't have an animation the other way around
- }
- },
- editTask(id) {
- // Find the selected task and set it to the current object
- let theTask = this.list.getTaskByID(id) // Somehow this does not work if we directly assign this to this.taskEditTask
- this.taskEditTask = theTask
- this.isTaskEdit = true
- },
- editTaskSubmit() {
- this.taskService.update(this.taskEditTask)
- .then(r => {
- this.updateTaskInList(r)
- this.$set(this, 'taskEditTask', r)
- message.success({message: 'The task was successfully updated.'}, this)
- })
- .catch(e => {
- message.error(e, this)
- })
- },
- addSubtask() {
- this.newTask.parentTaskID = this.taskEditTask.id
- this.addTask()
- },
- updateTaskInList(task) {
- // We need to do the update here in the component, because there is no way of notifiying vue of the change otherwise.
- for (const t in this.list.tasks) {
- if (this.list.tasks[t].id === task.id) {
- this.$set(this.list.tasks, t, task)
- break
- }
-
- if (this.list.tasks[t].id === task.parentTaskID) {
- for (const s in this.list.tasks[t].subtasks) {
- if (this.list.tasks[t].subtasks[s].id === task.id) {
- this.$set(this.list.tasks[t].subtasks, s, task)
- break
- }
- }
- }
- }
- this.list.sortTasks()
- },
- updateLastReminderDate(selectedDates) {
- this.lastReminder = +new Date(selectedDates[0])
- },
- addReminderDate(selectedDates, dateStr, instance) {
- let newDate = +new Date(selectedDates[0])
-
- // Don't update if nothing changed
- if (newDate === this.lastReminder) {
- return
- }
-
- let index = parseInt(instance.input.dataset.index)
- this.taskEditTask.reminderDates[index] = newDate
-
- let lastIndex = this.taskEditTask.reminderDates.length - 1
- // put a new null at the end if we changed something
- if (lastIndex === index && !isNaN(newDate)) {
- this.taskEditTask.reminderDates.push(null)
- }
- },
- removeReminderByIndex(index) {
- this.taskEditTask.reminderDates.splice(index, 1)
- // Reset the last to 0 to have the "add reminder" button
- this.taskEditTask.reminderDates[this.taskEditTask.reminderDates.length - 1] = null
- },
- addAssignee() {
- this.taskEditTask.assignees.push(this.newAssignee)
- },
- deleteAssigneeByIndex(index) {
- this.taskEditTask.assignees.splice(index, 1)
- },
- findUser(query) {
- if(query === '') {
- this.clearAllFoundUsers()
- return
- }
-
- this.userService.getAll({}, {s: query})
- .then(response => {
- // Filter the results to not include users who are already assigned
- this.$set(this, 'foundUsers', differenceWith(response, this.taskEditTask.assignees, (first, second) => {
- return first.id === second.id
- }))
- })
- .catch(e => {
- message.error(e, this)
- })
- },
- clearAllFoundUsers () {
- this.$set(this, 'foundUsers', [])
- },
- findLabel(query) {
- if(query === '') {
- this.clearAllLabels()
- return
- }
-
- if(this.labelTimeout !== null) {
- clearTimeout(this.labelTimeout)
- }
-
- // Delay the search 300ms to not send a request on every keystroke
- this.labelTimeout = setTimeout(() => {
- this.labelService.getAll({}, {s: query})
- .then(response => {
- this.$set(this, 'foundLabels', differenceWith(response, this.taskEditTask.labels, (first, second) => {
- return first.id === second.id
- }))
- this.labelTimeout = null
- })
- .catch(e => {
- message.error(e, this)
- })
- }, 300)
- },
- clearAllLabels () {
- this.$set(this, 'foundLabels', [])
- },
- addLabel(label) {
- let labelTask = new LabelTaskModel({taskID: this.taskEditTask.id, label_id: label.id})
- this.labelTaskService.create(labelTask)
- .then(() => {
- message.success({message: 'The label was successfully added.'}, this)
- })
- .catch(e => {
- message.error(e, this)
- })
- },
- removeLabel(label) {
- let labelTask = new LabelTaskModel({taskID: this.taskEditTask.id, label_id: label.id})
- this.labelTaskService.delete(labelTask)
- .then(() => {
- // Remove the label from the list
- for (const l in this.taskEditTask.labels) {
- if (this.taskEditTask.labels[l].id === label.id) {
- this.taskEditTask.labels.splice(l, 1)
- }
- }
- message.success({message: 'The label was successfully removed.'}, this)
- })
- .catch(e => {
- message.error(e, this)
- })
- },
- createAndAddLabel(title) {
- let newLabel = new LabelModel({title: title})
- this.labelService.create(newLabel)
- .then(r => {
- this.addLabel(r)
- this.taskEditTask.labels.push(r)
- })
- .catch(e => {
- message.error(e, this)
- })
- }
}
}
\ No newline at end of file
diff --git a/src/components/tasks/Gantt.vue b/src/components/tasks/Gantt.vue
new file mode 100644
index 00000000..9aee37d3
--- /dev/null
+++ b/src/components/tasks/Gantt.vue
@@ -0,0 +1,101 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/tasks/ShowListTasks.vue b/src/components/tasks/ShowListTasks.vue
new file mode 100644
index 00000000..dfbc919a
--- /dev/null
+++ b/src/components/tasks/ShowListTasks.vue
@@ -0,0 +1,177 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/lists/ShowTasks.vue b/src/components/tasks/ShowTasks.vue
similarity index 100%
rename from src/components/lists/ShowTasks.vue
rename to src/components/tasks/ShowTasks.vue
diff --git a/src/components/lists/ShowTasksInRange.vue b/src/components/tasks/ShowTasksInRange.vue
similarity index 100%
rename from src/components/lists/ShowTasksInRange.vue
rename to src/components/tasks/ShowTasksInRange.vue
diff --git a/src/components/tasks/edit-task.vue b/src/components/tasks/edit-task.vue
new file mode 100644
index 00000000..617c996b
--- /dev/null
+++ b/src/components/tasks/edit-task.vue
@@ -0,0 +1,446 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/tasks/gantt-component.vue b/src/components/tasks/gantt-component.vue
new file mode 100644
index 00000000..25b62f7e
--- /dev/null
+++ b/src/components/tasks/gantt-component.vue
@@ -0,0 +1,350 @@
+
+