-
Notifications
You must be signed in to change notification settings - Fork 38
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add task management deletion scenarios (#5086)
* feat: update action menu and refactor category/package management logic Signed-off-by: Wanjin Noh <[email protected]> * feat: add set default package modal and update related components Signed-off-by: Wanjin Noh <[email protected]> * feat: add delete package modal and associated categories/workspaces components Signed-off-by: Wanjin Noh <[email protected]> * refactor: rename package components for consistency and clarity Signed-off-by: Wanjin Noh <[email protected]> * feat: add task category delete modal and rename category form component Signed-off-by: Wanjin Noh <[email protected]> * fix: ensure modal closes after package deletion attempt Signed-off-by: Wanjin Noh <[email protected]> * feat: add refresh functionality to PackagePanel and TaskCategoryPanel Signed-off-by: Wanjin Noh <[email protected]> * feat(assignee-pool): implement user selection and initialization logic Signed-off-by: Wanjin Noh <[email protected]> * feat: add task fields configuration component and related generators Signed-off-by: Wanjin Noh <[email protected]> --------- Signed-off-by: Wanjin Noh <[email protected]>
- Loading branch information
Showing
23 changed files
with
580 additions
and
77 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
35 changes: 35 additions & 0 deletions
35
apps/web/src/services/ops-flow/components/AssociatedCategories.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| <script setup lang="ts"> | ||
| import { computed } from 'vue'; | ||
| import { PFieldTitle, PDataTable } from '@cloudforet/mirinae'; | ||
| import type { DataTableField } from '@cloudforet/mirinae/types/data-display/tables/data-table/type'; | ||
| import { useTaskManagementPageStore } from '@/services/ops-flow/stores/admin/task-management-page-store'; | ||
| const taskManagementPageStore = useTaskManagementPageStore(); | ||
| const fields = computed<DataTableField[]>(() => [ | ||
| { | ||
| name: 'name', | ||
| label: 'Name', | ||
| width: '30%', | ||
| }, | ||
| { | ||
| name: 'description', | ||
| label: 'Description', | ||
| width: '70%', | ||
| }, | ||
| ]); | ||
| </script> | ||
|
|
||
| <template> | ||
| <div> | ||
| <p-field-title class="mb-2"> | ||
| Category | ||
| </p-field-title> | ||
| <p-data-table :fields="fields" | ||
| :items="taskManagementPageStore.getters.associatedCategoriesToPackage" | ||
| /> | ||
| </div> | ||
| </template> | ||
|
|
35 changes: 35 additions & 0 deletions
35
apps/web/src/services/ops-flow/components/AssociatedWorkspaces.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| <script setup lang="ts"> | ||
| import { computed } from 'vue'; | ||
| import { PFieldTitle, PDataTable } from '@cloudforet/mirinae'; | ||
| import type { DataTableField } from '@cloudforet/mirinae/types/data-display/tables/data-table/type'; | ||
| import { useTaskManagementPageStore } from '@/services/ops-flow/stores/admin/task-management-page-store'; | ||
| const taskManagementPageStore = useTaskManagementPageStore(); | ||
| const fields = computed<DataTableField[]>(() => [ | ||
| { | ||
| name: 'name', | ||
| label: 'Name', | ||
| width: '30%', | ||
| }, | ||
| { | ||
| name: 'description', | ||
| label: 'Description', | ||
| width: '70%', | ||
| }, | ||
| ]); | ||
| </script> | ||
|
|
||
| <template> | ||
| <div> | ||
| <p-field-title class="mb-2"> | ||
| Associated Workspaces | ||
| </p-field-title> | ||
| <p-data-table :fields="fields" | ||
| :items="taskManagementPageStore.getters.associatedWorkspacesToPackage" | ||
| /> | ||
| </div> | ||
| </template> | ||
|
|
58 changes: 58 additions & 0 deletions
58
apps/web/src/services/ops-flow/components/PackageDeleteModal.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| <script setup lang="ts"> | ||
| import { ref, computed } from 'vue'; | ||
| import { PButtonModal } from '@cloudforet/mirinae'; | ||
| import ErrorHandler from '@/common/composables/error/errorHandler'; | ||
| import AssociatedCategories from '@/services/ops-flow/components/AssociatedCategories.vue'; | ||
| import AssociatedWorkspaces from '@/services/ops-flow/components/AssociatedWorkspaces.vue'; | ||
| import { useTaskManagementPageStore } from '@/services/ops-flow/stores/admin/task-management-page-store'; | ||
| const taskManagementPageStore = useTaskManagementPageStore(); | ||
| const packageStore = taskManagementPageStore.packageStore; | ||
| const deletable = computed(() => !taskManagementPageStore.getters.associatedCategoriesToPackage.length | ||
| && !taskManagementPageStore.getters.associatedWorkspacesToPackage.length); | ||
| const loading = ref<boolean>(false); | ||
| const handleConfirm = async () => { | ||
| loading.value = true; | ||
| try { | ||
| if (!taskManagementPageStore.state.targetPackageId) { | ||
| throw new Error('[Console Error] Cannot delete package without a target package'); | ||
| } | ||
| await packageStore.delete(taskManagementPageStore.state.targetPackageId); | ||
| } catch (e) { | ||
| ErrorHandler.handleRequestError(e, 'Failed to delete package'); | ||
| } finally { | ||
| taskManagementPageStore.closeDeletePackageModal(); | ||
| loading.value = false; | ||
| } | ||
| }; | ||
| const handleCloseOrCancel = () => { | ||
| taskManagementPageStore.closeDeletePackageModal(); | ||
| }; | ||
| </script> | ||
|
|
||
| <template> | ||
| <p-button-modal :visible="taskManagementPageStore.state.visibleDeletePackageModal" | ||
| theme-color="alert" | ||
| :header-title="deletable ? 'Are you sure you want to delete this package?' : 'Delete Package'" | ||
| :size="deletable ? 'sm' : 'md'" | ||
| :loading="loading" | ||
| :disabled="!deletable" | ||
| @confirm="handleConfirm" | ||
| @close="handleCloseOrCancel" | ||
| @cancel="handleCloseOrCancel" | ||
| > | ||
| <template #body> | ||
| <p v-if="!deletable" | ||
| class="text-paragraph-lg font-bold mb-4" | ||
| > | ||
| To reassign them to a different package, update the associations before deleting. | ||
| </p> | ||
| <associated-categories v-if="!!taskManagementPageStore.getters.associatedCategoriesToPackage.length" /> | ||
| <associated-workspaces v-if="!!taskManagementPageStore.getters.associatedWorkspacesToPackage.length" /> | ||
| </template> | ||
| </p-button-modal> | ||
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
48 changes: 48 additions & 0 deletions
48
apps/web/src/services/ops-flow/components/PackageSetDefaultModal.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,48 @@ | ||
| <script setup lang="ts"> | ||
| import { ref, computed } from 'vue'; | ||
| import { PButtonModal } from '@cloudforet/mirinae'; | ||
| import ErrorHandler from '@/common/composables/error/errorHandler'; | ||
| import { useTaskManagementPageStore } from '@/services/ops-flow/stores/admin/task-management-page-store'; | ||
| const taskManagementPageStore = useTaskManagementPageStore(); | ||
| const packageStore = taskManagementPageStore.packageStore; | ||
| const loading = ref<boolean>(false); | ||
| const name = computed(() => taskManagementPageStore.getters.targetPackage?.name ?? ''); | ||
| const handleConfirm = async () => { | ||
| loading.value = true; | ||
| try { | ||
| if (!taskManagementPageStore.state.targetPackageId) { | ||
| throw new Error('[Console Error] Cannot set default package without a target package'); | ||
| } | ||
| await packageStore.setDefaultPackage(taskManagementPageStore.state.targetPackageId); | ||
| taskManagementPageStore.closeSetDefaultPackageModal(); | ||
| } catch (e) { | ||
| ErrorHandler.handleRequestError(e, 'Failed to set default package'); | ||
| } finally { | ||
| loading.value = false; | ||
| } | ||
| }; | ||
| const handleCloseOrCancel = () => { | ||
| taskManagementPageStore.closeSetDefaultPackageModal(); | ||
| }; | ||
| </script> | ||
|
|
||
| <template> | ||
| <p-button-modal :visible="taskManagementPageStore.state.visibleSetDefaultPackageModal" | ||
| size="sm" | ||
| :loading="loading" | ||
| @confirm="handleConfirm" | ||
| @close="handleCloseOrCancel" | ||
| @cancel="handleCloseOrCancel" | ||
| > | ||
| <template #header-title> | ||
| Set <strong>{{ name }}</strong> as the default package. | ||
| </template> | ||
| <template #body> | ||
| This will make it the primary package for related operations. | ||
| </template> | ||
| </p-button-modal> | ||
| </template> |
41 changes: 41 additions & 0 deletions
41
apps/web/src/services/ops-flow/components/TaskCategoryDeleteModal.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| <script setup lang="ts"> | ||
| import { ref } from 'vue'; | ||
| import DeleteModal from '@/common/components/modals/DeleteModal.vue'; | ||
| import ErrorHandler from '@/common/composables/error/errorHandler'; | ||
| import { useTaskManagementPageStore } from '@/services/ops-flow/stores/admin/task-management-page-store'; | ||
| const taskManagementPageStore = useTaskManagementPageStore(); | ||
| const taskCategoryStore = taskManagementPageStore.taskCategoryStore; | ||
| const loading = ref<boolean>(false); | ||
| const handleConfirm = async () => { | ||
| try { | ||
| loading.value = true; | ||
| if (!taskManagementPageStore.state.targetCategoryId) { | ||
| throw new Error('[Console Error] Cannot delete category without a target category'); | ||
| } | ||
| await taskCategoryStore.delete(taskManagementPageStore.state.targetCategoryId); | ||
| } catch (e) { | ||
| ErrorHandler.handleRequestError(e, 'Failed to delete category'); | ||
| } finally { | ||
| taskManagementPageStore.closeDeleteCategoryModal(); | ||
| loading.value = false; | ||
| } | ||
| }; | ||
| const handleCloseOrCancel = () => { | ||
| taskManagementPageStore.closeDeleteCategoryModal(); | ||
| }; | ||
| </script> | ||
|
|
||
| <template> | ||
| <delete-modal :visible="taskManagementPageStore.state.visibleDeleteCategoryModal" | ||
| header-title="Are you sure you want to delete this category?" | ||
| size="sm" | ||
| :loading="loading" | ||
| @confirm="handleConfirm" | ||
| @close="handleCloseOrCancel" | ||
| @cancel="handleCloseOrCancel" | ||
| /> | ||
| </template> |
Oops, something went wrong.