From e2bb2122ddf27b3067467fea3b5dc4bda03cdf8f Mon Sep 17 00:00:00 2001 From: Vitaliy Pavlov Date: Sat, 27 Jul 2024 07:58:08 +0700 Subject: [PATCH] completed user and group delete features --- src/App.vue | 4 +- src/api/groups.ts | 8 ++++ src/api/users.ts | 8 ++++ src/components.d.ts | 1 + src/components/ConfirmModal.vue | 42 +++++++++++++++++++++ src/locales/en/actions.json | 1 + src/locales/en/groups.json | 6 +++ src/locales/en/users.json | 6 +++ src/locales/ru/actions.json | 3 +- src/locales/ru/groups.json | 6 +++ src/locales/ru/users.json | 6 +++ src/pages/users/components/AddGroup.vue | 2 +- src/pages/users/components/AddUser.vue | 2 +- src/pages/users/components/GroupsTab.vue | 12 ++++++ src/pages/users/components/UsersTab.vue | 21 +++++++---- src/stores/app.ts | 8 ---- src/stores/confirmation.ts | 48 ++++++++++++++++++++++++ src/stores/groups/actions.ts | 26 +++++++++++++ src/stores/groups/index.ts | 9 +++-- src/stores/users/actions.ts | 26 +++++++++++++ src/stores/users/index.ts | 9 +++-- 21 files changed, 228 insertions(+), 26 deletions(-) create mode 100644 src/components/ConfirmModal.vue delete mode 100644 src/stores/app.ts create mode 100644 src/stores/confirmation.ts create mode 100644 src/stores/groups/actions.ts create mode 100644 src/stores/users/actions.ts diff --git a/src/App.vue b/src/App.vue index 6ceb9da..d297b13 100644 --- a/src/App.vue +++ b/src/App.vue @@ -2,10 +2,12 @@ + + diff --git a/src/api/groups.ts b/src/api/groups.ts index d1d93f4..8ec82d2 100644 --- a/src/api/groups.ts +++ b/src/api/groups.ts @@ -61,4 +61,12 @@ export default { return [undefined, e?.response?.data?.error ?? e.message]; } }, + delete: async (ID: number): Promise<[AxiosResponse?, string?]> => { + try { + const data = await $axios.delete(`v1/groups/${ID}`); + return [data, undefined]; + } catch (e: any) { + return [undefined, e?.response?.data?.error ?? e.message]; + } + }, }; diff --git a/src/api/users.ts b/src/api/users.ts index 09933c4..ca127d8 100644 --- a/src/api/users.ts +++ b/src/api/users.ts @@ -63,4 +63,12 @@ export default { return [undefined, e?.response?.data?.error ?? e.message]; } }, + delete: async (ID: number): Promise<[AxiosResponse?, string?]> => { + try { + const data = await $axios.delete(`v1/users/${ID}`); + return [data, undefined]; + } catch (e: any) { + return [undefined, e?.response?.data?.error ?? e.message]; + } + }, }; diff --git a/src/components.d.ts b/src/components.d.ts index 38c81d0..dd81cd0 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -8,6 +8,7 @@ export {} declare module 'vue' { export interface GlobalComponents { AppFooter: typeof import('./components/AppFooter.vue')['default'] + ConfirmModal: typeof import('./components/ConfirmModal.vue')['default'] ErrorPlate: typeof import('./components/ErrorPlate.vue')['default'] HelloWorld: typeof import('./components/HelloWorld.vue')['default'] LanguageSwitcher: typeof import('./components/LanguageSwitcher.vue')['default'] diff --git a/src/components/ConfirmModal.vue b/src/components/ConfirmModal.vue new file mode 100644 index 0000000..0935692 --- /dev/null +++ b/src/components/ConfirmModal.vue @@ -0,0 +1,42 @@ + + + diff --git a/src/locales/en/actions.json b/src/locales/en/actions.json index 6ced4f0..0288fde 100644 --- a/src/locales/en/actions.json +++ b/src/locales/en/actions.json @@ -7,6 +7,7 @@ "edit": "Edit", "block": "Block", "unblock": "Unblock", + "apply": "Apply", "confirm": "Confirm", "cancel": "Cancel" } diff --git a/src/locales/en/groups.json b/src/locales/en/groups.json index 29e70ef..93d46f5 100644 --- a/src/locales/en/groups.json +++ b/src/locales/en/groups.json @@ -21,6 +21,12 @@ "name": "Name of group", "permissions": "Permissions of users in group" } + }, + "delete": { + "delete-one": { + "title": "Delete group", + "message": "Are you sure you want to delete group with ID {0}? This action cannot be undone" + } } } } \ No newline at end of file diff --git a/src/locales/en/users.json b/src/locales/en/users.json index 2e438c2..4053cdb 100644 --- a/src/locales/en/users.json +++ b/src/locales/en/users.json @@ -35,6 +35,12 @@ "group": "Group", "no-group": "Not in group" } + }, + "delete": { + "delete-one": { + "title": "Delete user", + "message": "Are you sure you want to delete user with ID {0}? This action cannot be undone" + } } } } \ No newline at end of file diff --git a/src/locales/ru/actions.json b/src/locales/ru/actions.json index 92f9492..26df083 100644 --- a/src/locales/ru/actions.json +++ b/src/locales/ru/actions.json @@ -7,7 +7,8 @@ "edit": "Редактировать", "block": "Заблокировать", "unblock": "Разблокировать", - "confirm": "Применить", + "apply": "Применить", + "confirm": "Подтвердить", "cancel": "Отменить" } } \ No newline at end of file diff --git a/src/locales/ru/groups.json b/src/locales/ru/groups.json index 6ffcc0d..4ae0092 100644 --- a/src/locales/ru/groups.json +++ b/src/locales/ru/groups.json @@ -21,6 +21,12 @@ "name": "Название группы", "permissions": "Права пользователей в группе" } + }, + "delete": { + "delete-one": { + "title": "Удаление группы", + "message": "Вы уверены, что хотите удалить группу с ID {0}? Данное действие нельзя будет отменить" + } } } } \ No newline at end of file diff --git a/src/locales/ru/users.json b/src/locales/ru/users.json index cdbd41f..284546f 100644 --- a/src/locales/ru/users.json +++ b/src/locales/ru/users.json @@ -35,6 +35,12 @@ "group": "Группа пользователя", "no-group": "Без группы" } + }, + "delete": { + "delete-one": { + "title": "Удаление пользователя", + "message": "Вы уверены, что хотите удалить пользователя с ID {0}? Данное действие нельзя будет отменить" + } } } } \ No newline at end of file diff --git a/src/pages/users/components/AddGroup.vue b/src/pages/users/components/AddGroup.vue index ea4b7db..174e6f6 100644 --- a/src/pages/users/components/AddGroup.vue +++ b/src/pages/users/components/AddGroup.vue @@ -120,7 +120,7 @@ const onConfirm = () => { variant="flat" color="primary" class="px-4" - :text="t('$vuetify.actions.confirm')" + :text="t('$vuetify.actions.apply')" :loading="$groups.loadingCreate" :disabled="!validForm" :class="{ diff --git a/src/pages/users/components/AddUser.vue b/src/pages/users/components/AddUser.vue index 50e6442..77c388c 100644 --- a/src/pages/users/components/AddUser.vue +++ b/src/pages/users/components/AddUser.vue @@ -125,7 +125,7 @@ const onConfirm = () => { variant="flat" color="primary" class="px-4" - :text="t('$vuetify.actions.confirm')" + :text="t('$vuetify.actions.apply')" :loading="$groups.loadingCreate" :disabled="!validForm" :class="{ diff --git a/src/pages/users/components/GroupsTab.vue b/src/pages/users/components/GroupsTab.vue index 8a081a7..1f3dae7 100644 --- a/src/pages/users/components/GroupsTab.vue +++ b/src/pages/users/components/GroupsTab.vue @@ -6,6 +6,7 @@ import { useGroupsStore } from '@/stores/groups'; import { isDeleted, isModifiedDate } from '@/mixins/item-validation'; import { Group } from '@/types/group'; import Moment from '@/plugins/moment'; +import { useConfirmationStore } from '@/stores/confirmation'; defineProps<{ tableHeight: number; @@ -14,6 +15,7 @@ defineProps<{ const { t } = useLocale(); const $groups = useGroupsStore(); +const $confirmation = useConfirmationStore(); const headers: ComputedRef = computed(() => [ { title: t('$vuetify.groups.heads.id'), key: 'ID' }, @@ -35,6 +37,14 @@ const editGroup = (g: Group) => { $groups.openModal(); $groups.startEditGroup(g); }; +const deleteGroup = (g: Group) => { + $confirmation.openModal(); + $confirmation.setTitle(t('$vuetify.groups.delete.delete-one.title')); + $confirmation.setMessage( + t('$vuetify.groups.delete.delete-one.message', [g.ID]), + ); + $confirmation.setOnConfirm(() => $groups.deleteGroup(g.ID)); +}; // Status const calculateStatus = (group: Group) => { @@ -152,6 +162,8 @@ watch( variant="text" density="comfortable" :disabled="isDeleted(item.deletedAt)" + :loading="$groups.loadingDeleteID === item.ID" + @click="deleteGroup(item)" > close diff --git a/src/pages/users/components/UsersTab.vue b/src/pages/users/components/UsersTab.vue index 12b8391..dadfba6 100644 --- a/src/pages/users/components/UsersTab.vue +++ b/src/pages/users/components/UsersTab.vue @@ -1,12 +1,5 @@