IT4Change/gradido
3
0
Fork 0
mirror of https://github.com/IT4Change/gradido.git synced 2026-02-06 09:56:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

wip on search user

Browse Source
This commit is contained in:
Kamila 2024-07-23 17:15:36 +02:00
parent a35ce52cc9
commit a9c74418e8
1 changed files with 65 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
admin/src/components/Tables/SearchUserTable.vue
View File

@ -13,45 +13,50 @@
@row-clicked="onRowClicked"
>
<template #cell(creation)="data">
<div v-html="data.value"></div>
<div v-html="data.value" />
</template>
<template #cell(status)="row">
<div class="text-right">
<BAvatar v-if="row.item.deletedAt" class="mr-3 test-deleted-icon" variant="light">
<b-iconstack font-scale="2">
<IBi0Circle />
<b-icon stacked icon="slash-circle" variant="danger"></b-icon>
</b-iconstack>
<!-- <b-iconstack font-scale="2"> -->
<div>
<IOcticonPerson24 />
<IOcticonCircleSlash24 style="color: #f5365c" />
</div>
<!-- </b-iconstack> -->
</BAvatar>
<span v-if="!row.item.deletedAt">
<BAvatar
<IPhEnvelope
v-if="!row.item.emailChecked"
icon="envelope"
style="color: #f5365c"
class="align-center mr-3"
variant="danger"
></BAvatar>
<BAvatar
/>
<!-- <b-icon
v-if="!row.item.hasElopage"
variant="danger"
class="mr-3"
src="img/elopage_favicon.png"
></BAvatar>
/> -->
</span>
<b-icon
variant="dark"
:icon="row.detailsShowing ? 'caret-up-fill' : 'caret-down'"
<IPhCaretUpFill
v-if="row.detailsShowing === 'caret-up-fill'"
style="color: #212529"
:title="row.item.enabled ? $t('enabled') : $t('deleted')"
></b-icon>
/>
<IPhCaretDown
style="color: #212529"
v-else
:title="row.item.enabled ? $t('enabled') : $t('deleted')"
/>
</div>
</template>
<template #row-details="row">
<BCard ref="rowDetails" class="shadow-lg pl-3 pr-3 mb-5 bg-white rounded">
<BTabs content-class="mt-3">
<BTabs contentClass="mt-3">
<BTab :title="$t('creation')" active :disabled="row.item.deletedAt !== null">
<CreationFormular
<creation-formular
v-if="!row.item.deletedAt"
pagetype="singleCreation"
:creation="row.item.creation"
@ -61,7 +66,7 @@
/>
</BTab>
<BTab :title="$t('e_mail')" :disabled="row.item.deletedAt !== null">
<ConfirmRegisterMailFormular
<confirm-register-mail-formular
v-if="!row.item.deletedAt"
:checked="row.item.emailChecked"
:email="row.item.email"
@ -72,18 +77,18 @@
"
/>
</BTab>
<BTab :title="$t('creationList')" :disabled="row.item.deletedAt !== null">
<CreationTransactionList v-if="!row.item.deletedAt" :userId="row.item.userId" />
<!-- <BTab :title="$t('creationList')" :disabled="row.item.deletedAt !== null">
<creation-transaction-list v-if="!row.item.deletedAt" :userId="row.item.userId" />
</BTab>
<BTab :title="$t('transactionlink.name')" :disabled="row.item.deletedAt !== null">
<TransactionLinkList v-if="!row.item.deletedAt" :userId="row.item.userId" />
<transaction-link-list v-if="!row.item.deletedAt" :userId="row.item.userId" />
</BTab>
<BTab :title="$t('userRole.tabTitle')">
<ChangeUserRoleFormular :item="row.item" @updateRoles="updateRoles" />
</BTab>
<BTab v-if="$store.state.moderator.roles.includes('ADMIN')" :title="$t('delete_user')">
<DeletedUserFormular :item="row.item" @updateDeletedAt="updateDeletedAt" />
</BTab>
<change-user-role-formular :item="row.item" @updateRoles="updateRoles" />
</BTab> -->
<!-- <BTab v-if="store.state.moderator.roles.includes('ADMIN')" :title="$t('delete_user')">
<deleted-user-formular :item="row.item" @updateDeletedAt="updateDeletedAt" />
</BTab> -->
</BTabs>
</BCard>
</template>
@ -91,8 +96,14 @@
</div>
</template>
<script setup>
import { ref, computed, nextTick } from 'vue'
import { ref, nextTick, onMounted, watch } from 'vue'
import { BTable, BAvatar, BTab, BTabs, BCard } from 'bootstrap-vue-next'
import CreationFormular from '../CreationFormular.vue'
import ConfirmRegisterMailFormular from '../ConfirmRegisterMailFormular.vue'
import CreationTransactionList from '../CreationTransactionList.vue'
import TransactionLinkList from '../TransactionLinkList.vue'
import ChangeUserRoleFormular from '../ChangeUserRoleFormular.vue'
import DeletedUserFormular from '../DeletedUserFormular.vue'
const props = defineProps({
items: {
@ -106,8 +117,19 @@ const props = defineProps({
})
const emit = defineEmits(['updateRoles', 'updateDeletedAt'])
const myItems = ref()
const creationUserData = ref({})
const rowDetails = ref()
onMounted(() => {
setTimeout(() => {
myItems.value = props.items.map((item) => {
return { ...item, _showDetails: false }
})
myItems.value
}, 500)
})
const updateUserData = (rowItem, newCreation) => {
rowItem.creation = newCreation
@ -122,7 +144,10 @@ const updateDeletedAt = ({ userId, deletedAt }) => {
}
const onRowClicked = async (item) => {
const status = myItems.value.find((obj) => obj === item)._showDetails
const status = myItems.value.find((obj) => {
return obj.userId === item.userId
})?._showDetails
myItems.value.forEach((obj) => {
if (obj === item) {
obj._showDetails = !status
@ -130,15 +155,19 @@ const onRowClicked = async (item) => {
obj._showDetails = false
}
})
await nextTick()
if (!status && rowDetails.value) {
rowDetails.value.focus()
// rowDetails.value.focus()
}
}
const myItems = computed(() => {
return props.items.map((item) => {
return { ...item, _showDetails: false }
})
})
watch(
() => props.items,
(items) => {
myItems.value = items.map((item) => {
return { ...item, _showDetails: false }
})
},
)
</script>