Dynamic switching when user is deleted or restored

admin/src/components/DeletedUserFormular.vue

@@ -1,20 +1,20 @@
 <template>
   <div>
     <div v-if="item.userId === $store.state.moderator.id" class="mt-5 mb-5">
-      Als Admin / Moderator kannst du dich nicht selber löschen.
+      {{ $t('removeNotSelf') }}
     </div>
     <div v-else class="mt-5">
       <b-form-checkbox switch size="lg" v-model="checked">
-        <div v-if="item.deletedAt === null">Delete user</div>
-        <div v-if="item.deletedAt !== null">Undelete user</div>
+        <div v-if="item.deletedAt === null">{{ $t('delete_user') }}</div>
+        <div v-if="item.deletedAt !== null">{{ $t('undelete_user') }}</div>
       </b-form-checkbox>
 
       <div class="mt-3 mb-5">
         <b-button v-if="checked && item.deletedAt === null" variant="danger" @click="deleteUser">
-          Delete User
+          {{ $t('delete_user') }}
         </b-button>
         <b-button v-if="checked && item.deletedAt !== null" variant="success" @click="unDeleteUser">
-          Undelete User
+          {{ $t('undelete_user') }}
         </b-button>
       </div>
     </div>
@@ -45,9 +45,12 @@ export default {
             userId: this.item.userId,
           },
         })
-        .then(() => {
+        .then((result) => {
           this.$toasted.success('user is deleted')
-          this.item.deletedAt = Date.now()
+          this.$emit('updateDeletedAt', {
+            userId: this.item.userId,
+            deletedAt: result.data.deleteUser,
+          })
           this.checked = false
         })
         .catch((error) => {
@@ -62,9 +65,13 @@ export default {
             userId: this.item.userId,
           },
         })
-        .then(() => {
+        .then((result) => {
           this.$toasted.success('user is undeleted')
-          this.item.deletedAt = null
+          this.$emit('updateDeletedAt', {
+            userId: this.item.userId,
+            deletedAt: result.data.unDeleteUser,
+          })
+          // this.item.deletedAt = null
           this.checked = false
         })
         .catch((error) => {

admin/src/components/Tables/SearchUserTable.vue

@@ -55,7 +55,7 @@
               :creationUserData="creationUserData"
               @update-user-data="updateUserData"
             />
-            <div v-else>Der Nutzer ist gelöscht. Es können keine GDD mehr geschöpft werden.</div>
+            <div v-else>{{ $t('userIsDeleted') }}</div>
 
             <confirm-register-mail-formular
               v-if="!row.item.deletedAt"
@@ -71,7 +71,7 @@
               v-if="!row.item.deletedAt"
               :userId="row.item.userId"
             />
-            <deleted-user-formular :item="row.item" />
+            <deleted-user-formular :item="row.item" @updateDeletedAt="updateDeletedAt" />
           </template>
         </row-details>
       </template>
@@ -117,6 +117,9 @@ export default {
     updateUserData(rowItem, newCreation) {
       rowItem.creation = newCreation
     },
+    updateDeletedAt({ userId, deletedAt }) {
+      this.$emit('updateDeletedAt', userId, deletedAt)
+    },
   },
   computed: {
     slotName() {

admin/src/locales/de.json

@@ -63,6 +63,10 @@
   },
   "remove": "Entfernen",
   "remove_all": "alle Nutzer entfernen",
+  "removeNotSelf":"Als Admin / Moderator kannst du dich nicht selber löschen.",
+  "delete_user":"Nutzer löschen",
+  "undelete_user":"Nutzer wiederherstellen",
+  "userIsDeleted":"Der Nutzer ist gelöscht. Es können keine GDD mehr geschöpft werden.",
   "save": "Speichern",
   "text": "Text",
   "transaction": "Transaktion",

admin/src/locales/en.json

@@ -63,6 +63,10 @@
   },
   "remove": "Remove",
   "remove_all": "Remove all users",
+  "removeNotSelf":"As an admin / moderator you cannot delete yourself.",
+  "delete_user":"Delete user",
+  "undelete_user":"Undelete User",
+  "userIsDeleted":"The user is deleted. No more GDD can be created.",
   "save": "Speichern",
   "text": "Text",
   "transaction": "Transaction",

admin/src/pages/UserSearch.vue

@@ -26,7 +26,12 @@
         </b-input-group-append>
       </b-input-group>
     </div>
-    <search-user-table type="PageUserSearch" :items="searchResult" :fields="fields" />
+    <search-user-table
+      type="PageUserSearch"
+      :items="searchResult"
+      :fields="fields"
+      @updateDeletedAt="updateDeletedAt"
+    />
     <b-pagination
       pills
       size="lg"
@@ -92,6 +97,9 @@ export default {
           this.$toasted.error(error.message)
         })
     },
+    updateDeletedAt(userId, deletedAt) {
+      this.searchResult.find((obj) => obj.userId === userId).deletedAt = deletedAt
+    },
   },
   watch: {
     currentPage() {