prepared the deletion of a user in the admin area.

admin/src/components/DeletedUserFormular.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>
+    {{ item }}
+    <div class="mt-5">
+      <b-form-checkbox switch size="lg" v-model="checked">deleted User</b-form-checkbox>
+    </div>
+    <div class="mt-3">GDD Stand: 20 GDD</div>
+    <div class="mt-3 mb-5">
+      <b-button v-if="checked" variant="success" @click="deleteAdd">User now deleted</b-button>
+    </div>
+  </div>
+</template>
+<script>
+// import { sendActivationEmail } from '../graphql/sendActivationEmail'
+
+export default {
+  name: 'DeletedUser',
+  props: {
+    item: {
+      type: Array,
+    },
+  },
+  data() {
+    return {
+      checked: false,
+    }
+  },
+  methods: {
+    deleteAdd() {
+      alert('TODO: Apollo query deleteAdd')
+    },
+  },
+}
+</script>
+<style>
+.input-group-text {
+  background-color: rgb(255, 252, 205);
+}
+</style>

admin/src/components/Tables/SearchUserTable.vue

@@ -4,6 +4,20 @@
       <template #cell(creation)="data">
         <div v-html="data.value"></div>
       </template>
+      <template #cell(enabled)="row">
+        <b-icon
+          @click="rowToogleDetails(row, 3)"
+          :variant="row.item.enabled ? 'success' : 'danger'"
+          :icon="row.item.enabled ? 'check-circle' : 'x-circle'"
+          :title="row.item.enabled ? $t('enabled') : $t('disabled')"
+        ></b-icon>
+        <b-icon
+          @click="rowToogleDetails(row, 3)"
+          :variant="row.item.enabled ? 'dark' : 'dark'"
+          :icon="row.item.enabled ? 'gear' : 'gear'"
+          :title="row.item.enabled ? $t('enabled') : $t('disabled')"
+        ></b-icon>
+      </template>
       <template #cell(show_details)="row">
         <b-button
           variant="info"
@@ -73,6 +87,9 @@
           <template #show-transaction-list>
             <creation-transaction-list-formular :userId="row.item.userId" />
           </template>
+          <template #show-deleted-user>
+            <deleted-user-formular :item="row.item" />
+          </template>
         </row-details>
       </template>
     </b-table-lite>
@@ -83,9 +100,15 @@ import CreationFormular from '../CreationFormular.vue'
 import ConfirmRegisterMailFormular from '../ConfirmRegisterMailFormular.vue'
 import RowDetails from '../RowDetails.vue'
 import CreationTransactionListFormular from '../CreationTransactionListFormular.vue'
+import DeletedUserFormular from '../DeletedUserFormular.vue'
 import { toggleRowDetails } from '../../mixins/toggleRowDetails'
 
-const slotNames = ['show-creation', 'show-register-mail', 'show-transaction-list']
+const slotNames = [
+  'show-creation',
+  'show-register-mail',
+  'show-transaction-list',
+  'show-deleted-user',
+]
 
 export default {
   name: 'SearchUserTable',
@@ -94,6 +117,7 @@ export default {
     CreationFormular,
     ConfirmRegisterMailFormular,
     CreationTransactionListFormular,
+    DeletedUserFormular,
     RowDetails,
   },
   props: {

admin/src/locales/de.json

@@ -24,6 +24,10 @@
   "delete": "Löschen",
   "details": "Details",
   "edit": "Bearbeiten",
+  "enabled":"aktiviert",
+  "disabled":"deaktiviert",
+  "disabled_user":"deaktivierte Nutzer anzeigen",
+  "enabled_user":"aktivierte Nutzer anzeigen",
   "e_mail": "E-Mail",
   "firstname": "Vorname",
   "gradido_admin_footer": "Gradido Akademie Adminkonsole",

admin/src/locales/en.json

@@ -24,6 +24,10 @@
   "delete": "Delete",
   "details": "Details",
   "edit": "Edit",
+  "enabled":"enabled",
+  "disabled":"disabled",
+  "enabled_user":"show enabled user",
+  "disabled_user":"show disabled user",
   "e_mail": "E-mail",
   "firstname": "Firstname",
   "gradido_admin_footer": "Gradido Academy Admin Console",

admin/src/pages/UserSearch.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="user-search">
     <div style="text-align: right">
-      <b-button block variant="danger" @click="unconfirmedRegisterMails">
-        <b-icon icon="envelope" variant="light"></b-icon>
+      <b-button variant="light" @click="unconfirmedRegisterMails">
+        <b-icon icon="envelope" variant="danger"></b-icon>
         {{ filterCheckedEmails ? $t('all_emails') : $t('unregistered_emails') }}
       </b-button>
+      <b-button variant="light" @click="disabledUserSearch">
+        <b-icon icon="x-circle" variant="danger"></b-icon>
+        {{ filterDisabledUser ? $t('enabled_user') : $t('disabled_user') }}
+      </b-button>
     </div>
     <label>{{ $t('user_search') }}</label>
     <div>
@@ -52,6 +56,7 @@ export default {
       massCreation: [],
       criteria: '',
       filterCheckedEmails: false,
+      filterDisabledUser: false,
       rows: 0,
       currentPage: 1,
       perPage: 25,
@@ -63,6 +68,11 @@ export default {
       this.filterCheckedEmails = !this.filterCheckedEmails
       this.getUsers()
     },
+    disabledUserSearch() {
+      this.filterDisabledUser = !this.filterDisabledUser
+      this.getUsers()
+      alert('TODO: disabled user filter in search und im backend prüfen')
+    },
     getUsers() {
       this.$apollo
         .query({
@@ -72,6 +82,7 @@ export default {
             currentPage: this.currentPage,
             pageSize: this.perPage,
             notActivated: this.filterCheckedEmails,
+            disabledUser: this.filterDisabledUser,
           },
         })
         .then((result) => {
@@ -108,6 +119,7 @@ export default {
         { key: 'confirm_mail', label: this.$t('confirmed') },
         { key: 'has_elopage', label: 'elopage' },
         { key: 'transactions_list', label: this.$t('transaction') },
+        { key: 'enabled', label: this.$t('enabled') },
       ]
     },
   },