feat(router, sidebar, modal): add 'Tasks Concepts' route and update sidebar/menu items; enhance task modal save functionality

app/src/plugins/tm@dashboard/tasks-concepts/tasks-concepts.vue

@@ -0,0 +1,164 @@
+<template>
+  <div>
+    <Z-tasks-search
+      @search="onSearch"
+      @employee-selected="onEmployeeSelected"
+      @update-sort-order="onUpdateSortOrder"
+    />
+
+    <W-loadable
+      :content="filteredConceptTasks"
+      :emptyMessage="
+        searchQuery.length
+          ? 'Neboli nájdené žiadne úlohy'
+          : 'Nenašli sa žiadne záznamy'
+      "
+    >
+      <A-concepts-table :subtasks="filteredConceptTasks" />
+    </W-loadable>
+  </div>
+</template>
+
+<script>
+import ZTasksSearch from '@/plugins/tm@overview/_components/z-tasks-search.vue';
+import { mapGetters } from 'vuex';
+import AConceptsTable from './_components/a-concepts-table.vue';
+
+export default {
+  components: {
+    ZTasksSearch,
+    AConceptsTable,
+  },
+
+  data() {
+    return {
+      searchQuery: '',
+      sortOrder: null,
+      conceptSubtasks: null,
+    };
+  },
+
+  async ionViewWillEnter() {
+    await this.loadConceptTasks();
+  },
+
+  async mounted() {
+    await this.loadConceptTasks();
+
+    this.$events.on('on-subtask-edited', async () => {
+      await this.loadConceptTasks();
+    });
+
+    this.$events.on('on-subtask-deleted', async () => {
+      await this.loadConceptTasks();
+    });
+  },
+
+  unmounted() {
+    this.$events.off('on-subtask-edited');
+    this.$events.off('on-subtask-deleted');
+  },
+
+  computed: {
+    ...mapGetters('tm', ['mastertasks']),
+
+    filteredConceptTasks() {
+      if (!this.conceptSubtasks) return null;
+
+      let filteredSubtasks = this.conceptSubtasks.filter((subtask) => {
+        return (
+          this.filterParams(
+            this.searchQuery,
+            subtask.master_task?.name || subtask.title,
+          ) || this.filterParams(this.searchQuery, subtask.project_code)
+        );
+      });
+
+      //Sorting by name A-Z
+      if (this.sortOrder === 'nameAsc') {
+        filteredSubtasks.sort((a, b) => {
+          const nameA = (a.title || a.master_task || '').toLowerCase();
+          const nameB = (b.title || b.master_task || '').toLowerCase();
+          return nameA.localeCompare(nameB);
+        });
+        //Sorting by name Z-A
+      } else if (this.sortOrder === 'nameDesc') {
+        filteredSubtasks.sort((a, b) => {
+          const nameA = (a.title || a.master_task || '').toLowerCase();
+          const nameB = (b.title || b.master_task || '').toLowerCase();
+          return nameB.localeCompare(nameA);
+        });
+        //Sorting by date Newest-Oldest
+      } else if (this.sortOrder === 'deadlineDesc') {
+        filteredSubtasks.sort((a, b) => {
+          const deadlineA = a.deadline
+            ? new Date(a.deadline)
+            : new Date(this.getMasterTaskDeadline(a));
+          const deadlineB = b.deadline
+            ? new Date(b.deadline)
+            : new Date(this.getMasterTaskDeadline(b));
+          return deadlineB - deadlineA;
+        });
+        //Sorting by date Oldest-Newest
+      } else if (this.sortOrder === 'deadlineAsc') {
+        filteredSubtasks.sort((a, b) => {
+          const deadlineA = a.deadline
+            ? new Date(a.deadline)
+            : new Date(this.getMasterTaskDeadline(a));
+          const deadlineB = b.deadline
+            ? new Date(b.deadline)
+            : new Date(this.getMasterTaskDeadline(b));
+          return deadlineA - deadlineB;
+        });
+      }
+
+      return filteredSubtasks;
+    },
+  },
+
+  methods: {
+    async loadConceptTasks(employeeId = null) {
+      try {
+        const params = { type: 'concept' };
+        if (employeeId) {
+          params.employee_id = employeeId;
+        } else {
+          params.employee_id = this.$store.getters['auth/user'].id;
+        }
+
+        const queryParameters = new URLSearchParams(params).toString();
+        const { subtasks } = await this.$axios.get_auth(
+          `v1/subtasks?${queryParameters}`,
+        );
+        this.conceptSubtasks = subtasks;
+      } catch (error) {
+        this.$toast.error('Nepodarilo sa načítať koncepty!');
+
+        if (process.env.NODE_ENV === 'development')
+          console.log('[tasks-concepts.vue] Error: ', error);
+      }
+    },
+
+    onSearch(searchQuery) {
+      this.searchQuery = searchQuery;
+    },
+
+    async onEmployeeSelected(id) {
+      await this.loadConceptTasks(id);
+    },
+
+    onUpdateSortOrder(newSortOrder) {
+      this.sortOrder = newSortOrder;
+    },
+
+    filterParams(searchQuery, row) {
+      if (!row) return false;
+      return row.toLowerCase().includes(searchQuery.toLowerCase());
+    },
+
+    getMasterTaskDeadline(subtask) {
+      return subtask.master_task_deadline;
+    },
+  },
+};
+</script>