diff --git a/src/views/dashboards/departmentDashboard/modules/goals/DepartmentGoals.vue b/src/views/dashboards/departmentDashboard/modules/goals/DepartmentGoals.vue index c622c59d..132e7ede 100644 --- a/src/views/dashboards/departmentDashboard/modules/goals/DepartmentGoals.vue +++ b/src/views/dashboards/departmentDashboard/modules/goals/DepartmentGoals.vue @@ -5,6 +5,7 @@ import { SessionUser } from "@/components/session/token/SessionUser.vue"; import DepartmentDashboardPageWrapper from "@/views/dashboards/departmentDashboard/DepartmentDashboardPageWrapper.vue"; import NotFoundFallBackPageWrapper from "@/components/page/wrappers/NotFoundFallBackPageWrapper.vue"; import { Goals } from "@/components/session/token/SessionUser/Objects/Goals.vue"; +import { showGoalCreateModal } from "./functions/showGoalCreateModal"; const departmentId = ref(SessionUser.functions.getDepartmentIdFromUrl()); const goals = ref([]); @@ -99,7 +100,7 @@ const formatDate = (dateString) => { }; const onCreateGoal = () => { - Goals.showCreateObjectForm(fetchGoals, { departments: [parseInt(departmentId.value)] }); + showGoalCreateModal(fetchGoals, { departments: [parseInt(departmentId.value)] }); }; const onEditGoal = (goal) => { diff --git a/src/views/dashboards/departmentDashboard/modules/goals/components/GoalCreateModal.vue b/src/views/dashboards/departmentDashboard/modules/goals/components/GoalCreateModal.vue new file mode 100644 index 00000000..7ad11c3b --- /dev/null +++ b/src/views/dashboards/departmentDashboard/modules/goals/components/GoalCreateModal.vue @@ -0,0 +1,294 @@ + + + + + diff --git a/src/views/dashboards/departmentDashboard/modules/goals/functions/showGoalCreateModal.js b/src/views/dashboards/departmentDashboard/modules/goals/functions/showGoalCreateModal.js new file mode 100644 index 00000000..b8ab09a9 --- /dev/null +++ b/src/views/dashboards/departmentDashboard/modules/goals/functions/showGoalCreateModal.js @@ -0,0 +1,58 @@ +import { h, render } from 'vue'; +import Swal from 'sweetalert2'; +import GoalCreateModal from '../components/GoalCreateModal.vue'; +import { Goals } from "@/components/session/token/SessionUser/Objects/Goals.vue"; + +/** + * Show the custom goal create modal + * @param {Function} onAfterSubmit Callback after successful creation + * @param {Object} lockedValues Initial values (e.g., { departments: [1] }) + */ +export const showGoalCreateModal = (onAfterSubmit = null, lockedValues = {}) => { + const container = document.createElement('div'); + + return new Promise((resolve) => { + const swalInstance = Swal.fire({ + title: 'Opret nyt mål', + html: container, + showConfirmButton: false, + width: '800px', + allowOutsideClick: false, + didOpen: () => { + const vnode = h(GoalCreateModal, { + initialDepartments: lockedValues.departments || [], + onSave: async (formData) => { + try { + Swal.showLoading(); + await Goals.add(formData.departments, formData.criteria); + Swal.fire({ + title: 'Succes!', + text: 'Målet er blevet oprettet.', + icon: 'success', + timer: 2000, + showConfirmButton: false + }); + if (onAfterSubmit) onAfterSubmit(); + resolve(true); + } catch (error) { + console.error("Failed to create goal:", error); + Swal.fire({ + title: 'Fejl!', + text: 'Der opstod en fejl ved oprettelse af målet.', + icon: 'error' + }); + } + }, + onCancel: () => { + Swal.close(); + resolve(false); + } + }); + render(vnode, container); + }, + willClose: () => { + render(null, container); + } + }); + }); +};