mirror of
https://github.com/IT4Change/gradido.git
synced 2026-02-06 09:56:05 +00:00
rework deleted user
This commit is contained in:
Kamila
parent
cafc0f79b5
commit
0ea459737f
@ -1,127 +1,95 @@
|
||||
<template>
|
||||
<div class="deleted-user-formular">
|
||||
<div v-if="item.userId === $store.state.moderator.id" class="mt-5 mb-5">
|
||||
<div v-if="isUserModerator" class="mt-5 mb-5">
|
||||
{{ $t('removeNotSelf') }}
|
||||
</div>
|
||||
<div v-else class="mt-5">
|
||||
<div class="mt-3 mb-5">
|
||||
<b-button
|
||||
<BButton
|
||||
v-if="!item.deletedAt"
|
||||
v-b-modal.delete-user-modal
|
||||
variant="danger"
|
||||
@click="showDeleteModal()"
|
||||
@click="showDeleteModal"
|
||||
>
|
||||
{{ $t('delete_user') }}
|
||||
</b-button>
|
||||
<b-button v-else v-b-modal.delete-user-modal variant="success" @click="showUndeleteModal()">
|
||||
</BButton>
|
||||
<BButton v-else v-b-modal.delete-user-modal variant="success" @click="showUndeleteModal">
|
||||
{{ $t('undelete_user') }}
|
||||
</b-button>
|
||||
</BButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue'
|
||||
import { useStore } from 'vuex'
|
||||
import { useApolloClient } from '@vue/apollo-composable'
|
||||
import { BButton, vBModal } from 'bootstrap-vue-next'
|
||||
import { deleteUser } from '../graphql/deleteUser'
|
||||
import { unDeleteUser } from '../graphql/unDeleteUser'
|
||||
import { useAppToast } from '@/composables/useToast'
|
||||
|
||||
export default {
|
||||
name: 'DeletedUser',
|
||||
props: {
|
||||
item: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
emits: ['update-deleted-at'],
|
||||
methods: {
|
||||
showDeleteModal() {
|
||||
this.$bvModal
|
||||
.msgBoxConfirm(
|
||||
this.$t('overlay.deleteUser.question', {
|
||||
username: `${this.item.firstName} ${this.item.lastName}`,
|
||||
}),
|
||||
{
|
||||
cancelTitle: this.$t('overlay.cancel'),
|
||||
centered: true,
|
||||
hideHeaderClose: true,
|
||||
title: this.$t('overlay.deleteUser.title'),
|
||||
okTitle: this.$t('overlay.deleteUser.yes'),
|
||||
okVariant: 'danger',
|
||||
static: true,
|
||||
},
|
||||
)
|
||||
.then((okClicked) => {
|
||||
if (okClicked) {
|
||||
this.deleteUser()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
this.toastError(error.message)
|
||||
})
|
||||
},
|
||||
showUndeleteModal() {
|
||||
this.$bvModal
|
||||
.msgBoxConfirm(
|
||||
this.$t('overlay.undeleteUser.question', {
|
||||
username: `${this.item.firstName} ${this.item.lastName}`,
|
||||
}),
|
||||
{
|
||||
cancelTitle: this.$t('overlay.cancel'),
|
||||
centered: true,
|
||||
hideHeaderClose: true,
|
||||
title: this.$t('overlay.undeleteUser.title'),
|
||||
okTitle: this.$t('overlay.undeleteUser.yes'),
|
||||
okVariant: 'success',
|
||||
},
|
||||
)
|
||||
.then((okClicked) => {
|
||||
if (okClicked) {
|
||||
this.unDeleteUser()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
this.toastError(error.message)
|
||||
})
|
||||
},
|
||||
deleteUser() {
|
||||
this.$apollo
|
||||
.mutate({
|
||||
mutation: deleteUser,
|
||||
variables: {
|
||||
userId: this.item.userId,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
this.$emit('update-deleted-at', {
|
||||
userId: this.item.userId,
|
||||
deletedAt: result.data.deleteUser,
|
||||
})
|
||||
})
|
||||
.catch((error) => {
|
||||
this.toastError(error.message)
|
||||
})
|
||||
},
|
||||
unDeleteUser() {
|
||||
this.$apollo
|
||||
.mutate({
|
||||
mutation: unDeleteUser,
|
||||
variables: {
|
||||
userId: this.item.userId,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
this.$emit('update-deleted-at', {
|
||||
userId: this.item.userId,
|
||||
deletedAt: result.data.unDeleteUser,
|
||||
})
|
||||
})
|
||||
.catch((error) => {
|
||||
this.toastError(error.message)
|
||||
})
|
||||
},
|
||||
const props = defineProps({
|
||||
item: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update-deleted-at', 'show-delete-modal', 'show-undelete-modal'])
|
||||
|
||||
const { client } = useApolloClient()
|
||||
const store = useStore()
|
||||
const { toastError } = useAppToast()
|
||||
|
||||
const isUserModerator = computed(() => props.item.userId === store.state.moderator.id)
|
||||
|
||||
const showDeleteModal = () => {
|
||||
emit('show-delete-modal')
|
||||
}
|
||||
|
||||
const showUndeleteModal = () => {
|
||||
emit('show-undelete-modal')
|
||||
}
|
||||
|
||||
const deleteUserMutation = async () => {
|
||||
try {
|
||||
const result = await client.mutate({
|
||||
mutation: deleteUser,
|
||||
variables: {
|
||||
userId: props.item.userId,
|
||||
},
|
||||
})
|
||||
emit('update-deleted-at', {
|
||||
userId: props.item.userId,
|
||||
deletedAt: result.data.deleteUser,
|
||||
})
|
||||
} catch (error) {
|
||||
toastError(error.message)
|
||||
}
|
||||
}
|
||||
|
||||
const undeleteUserMutation = async () => {
|
||||
try {
|
||||
const result = await client.mutate({
|
||||
mutation: unDeleteUser,
|
||||
variables: {
|
||||
userId: props.item.userId,
|
||||
},
|
||||
})
|
||||
emit('update-deleted-at', {
|
||||
userId: props.item.userId,
|
||||
deletedAt: result.data.unDeleteUser,
|
||||
})
|
||||
} catch (error) {
|
||||
toastError(error.message)
|
||||
}
|
||||
}
|
||||
|
||||
defineExpose({ deleteUserMutation, undeleteUserMutation })
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.input-group-text {
|
||||
background-color: rgb(255 252 205);
|
||||
|
||||
@ -93,10 +93,18 @@
|
||||
</BTab>
|
||||
<BTab v-if="store.state.moderator.roles.includes('ADMIN')" :title="$t('delete_user')">
|
||||
<deleted-user-formular
|
||||
v-if="!row.item.deletedAt"
|
||||
ref="deletedUserForm"
|
||||
:item="row.item"
|
||||
@update-deleted-at="updateDeletedAt"
|
||||
@show-delete-modal="showDeleteModal"
|
||||
/>
|
||||
<deleted-user-formular
|
||||
v-else
|
||||
ref="undeletedUserForm"
|
||||
:item="row.item"
|
||||
@show-undelete-modal="showUndeleteModal"
|
||||
/>
|
||||
</BTab>
|
||||
</BTabs>
|
||||
</BCard>
|
||||
@ -106,15 +114,7 @@
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, nextTick, onMounted, watch, computed } from 'vue'
|
||||
import {
|
||||
BTable,
|
||||
BAvatar,
|
||||
BTab,
|
||||
BTabs,
|
||||
BCard,
|
||||
useModal,
|
||||
useModalController,
|
||||
} from 'bootstrap-vue-next'
|
||||
import { BTable, BAvatar, BTab, BTabs, BCard, useModalController } from 'bootstrap-vue-next'
|
||||
import { useStore } from 'vuex'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useAppToast } from '@/composables/useToast'
|
||||
@ -124,6 +124,8 @@ import CreationTransactionList from '../CreationTransactionList.vue'
|
||||
import TransactionLinkList from '../TransactionLinkList.vue'
|
||||
import ChangeUserRoleFormular from '../ChangeUserRoleFormular.vue'
|
||||
|
||||
const { t } = useI18n()
|
||||
const { confirm } = useModalController()
|
||||
const store = useStore()
|
||||
const { toastError } = useAppToast()
|
||||
|
||||
@ -138,18 +140,21 @@ const props = defineProps({
|
||||
},
|
||||
})
|
||||
|
||||
const { t } = useI18n()
|
||||
const rolesValues = {
|
||||
ADMIN: 'ADMIN',
|
||||
MODERATOR: 'MODERATOR',
|
||||
USER: 'USER',
|
||||
}
|
||||
const { confirm } = useModalController()
|
||||
const modal = useModal()
|
||||
|
||||
const userChangeForm = ref()
|
||||
const deletedUserForm = ref()
|
||||
const undeletedUserForm = ref()
|
||||
const myItems = ref()
|
||||
const creationUserData = ref({})
|
||||
const rowDetails = ref()
|
||||
|
||||
const showModal = async () => {
|
||||
const value = await confirm?.({
|
||||
await confirm?.({
|
||||
props: {
|
||||
cancelTitle: t('overlay.cancel'),
|
||||
centered: true,
|
||||
@ -179,19 +184,56 @@ const showModal = async () => {
|
||||
.catch((error) => {
|
||||
toastError(error.message)
|
||||
})
|
||||
|
||||
modal.show?.({ props: { title: `Promise resolved to ${value}`, variant: 'info' } })
|
||||
}
|
||||
|
||||
const showDeleteModal = async () => {
|
||||
const value = await confirm?.({ props: { title: 'Hello World! ' } })
|
||||
|
||||
modal.show?.({ props: { title: `Promise resolved to ${value}`, variant: 'info' } })
|
||||
await confirm?.({
|
||||
props: {
|
||||
cancelTitle: t('overlay.cancel'),
|
||||
centered: true,
|
||||
hideHeaderClose: true,
|
||||
title: t('overlay.deleteUser.title'),
|
||||
okTitle: t('overlay.deleteUser.yes'),
|
||||
okVariant: 'danger',
|
||||
static: true,
|
||||
body: t('overlay.deleteUser.question', {
|
||||
username: `${selectedRow.value.firstName} ${selectedRow.value.lastName}`,
|
||||
}),
|
||||
},
|
||||
})
|
||||
.then((ok) => {
|
||||
if (ok) {
|
||||
deletedUserForm.value.deleteUserMutation()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
toastError(error.message)
|
||||
})
|
||||
}
|
||||
|
||||
const myItems = ref()
|
||||
const creationUserData = ref({})
|
||||
const rowDetails = ref()
|
||||
const showUndeleteModal = async () => {
|
||||
await confirm?.({
|
||||
props: {
|
||||
cancelTitle: t('overlay.cancel'),
|
||||
centered: true,
|
||||
hideHeaderClose: true,
|
||||
title: t('overlay.undeleteUser.title'),
|
||||
okTitle: t('overlay.undeleteUser.yes'),
|
||||
okVariant: 'success',
|
||||
body: t('overlay.undeleteUser.question', {
|
||||
username: `${selectedRow.value.firstName} ${selectedRow.value.lastName}`,
|
||||
}),
|
||||
},
|
||||
})
|
||||
.then((ok) => {
|
||||
if (ok) {
|
||||
undeletedUserForm.value.undeleteUserMutation()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
toastError(error.message)
|
||||
})
|
||||
}
|
||||
|
||||
const updateUserData = (rowItem, newCreation) => {
|
||||
rowItem.creation = newCreation
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user