From bb86be723b300bd0cb2faade5e5d71eb48a382c5 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Wed, 2 Feb 2022 16:30:31 +0100
Subject: [PATCH] refactor: Mixin for Creation Labels

---
 admin/src/components/UserTable.vue |  1 +
 admin/src/mixins/creationMonths.js |  8 +++++++-
 admin/src/pages/Creation.vue       | 13 ++-----------
 admin/src/pages/UserSearch.vue     | 19 +++----------------
 4 files changed, 13 insertions(+), 28 deletions(-)

diff --git a/admin/src/components/UserTable.vue b/admin/src/components/UserTable.vue
index 4d14a35cb..b37aa5c9d 100644
--- a/admin/src/components/UserTable.vue
+++ b/admin/src/components/UserTable.vue
@@ -195,6 +195,7 @@ export default {
     creation: {
       type: Array,
       required: false,
+      default: () => [null, null, null],
     },
   },
   components: {
diff --git a/admin/src/mixins/creationMonths.js b/admin/src/mixins/creationMonths.js
index a2bbdcd1a..c26dc5b02 100644
--- a/admin/src/mixins/creationMonths.js
+++ b/admin/src/mixins/creationMonths.js
@@ -1,6 +1,9 @@
 export const creationMonths = {
   props: {
-    creation: [1000, 1000, 1000],
+    creation: {
+      type: Array,
+      default: () => [1000, 1000, 1000],
+    },
   },
   computed: {
     creationDates() {
@@ -31,5 +34,8 @@ export const creationMonths = {
         }
       })
     },
+    creationLabel() {
+      return this.creationDates.map((date) => this.$d(date, 'monthShort')).join(' | ')
+    },
   },
 }
diff --git a/admin/src/pages/Creation.vue b/admin/src/pages/Creation.vue
index 0e2cb541e..472bcb446 100644
--- a/admin/src/pages/Creation.vue
+++ b/admin/src/pages/Creation.vue
@@ -55,9 +55,11 @@
 import CreationFormular from '../components/CreationFormular.vue'
 import UserTable from '../components/UserTable.vue'
 import { searchUsers } from '../graphql/searchUsers'
+import { creationMonths } from '../mixins/creationMonths'
 
 export default {
   name: 'Creation',
+  mixins: [creationMonths],
   components: {
     CreationFormular,
     UserTable,
@@ -69,7 +71,6 @@ export default {
       itemsMassCreation: this.$store.state.userSelectedInMassCreation,
       radioSelectedMass: '',
       criteria: '',
-      creation: [null, null, null],
       rows: 0,
       currentPage: 1,
       perPage: 25,
@@ -163,16 +164,6 @@ export default {
         { key: 'bookmark', label: this.$t('remove') },
       ]
     },
-    creationLabel() {
-      const now = new Date(this.now)
-      const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1)
-      const beforeLastMonth = new Date(now.getFullYear(), now.getMonth() - 2, 1)
-      return [
-        this.$d(beforeLastMonth, 'monthShort'),
-        this.$d(lastMonth, 'monthShort'),
-        this.$d(now, 'monthShort'),
-      ].join(' | ')
-    },
   },
   watch: {
     currentPage() {
diff --git a/admin/src/pages/UserSearch.vue b/admin/src/pages/UserSearch.vue
index b7c19d03a..7b07241ec 100644
--- a/admin/src/pages/UserSearch.vue
+++ b/admin/src/pages/UserSearch.vue
@@ -35,9 +35,11 @@
 <script>
 import UserTable from '../components/UserTable.vue'
 import { searchUsers } from '../graphql/searchUsers'
+import { creationMonths } from '../mixins/creationMonths'
 
 export default {
   name: 'UserSearch',
+  mixins: [creationMonths],
   components: {
     UserTable,
   },
@@ -85,14 +87,6 @@ export default {
     },
   },
   computed: {
-    lastMonthDate() {
-      const now = new Date(this.now)
-      return new Date(now.getFullYear(), now.getMonth() - 1, 1)
-    },
-    beforeLastMonthDate() {
-      const now = new Date(this.now)
-      return new Date(now.getFullYear(), now.getMonth() - 2, 1)
-    },
     fields() {
       return [
         { key: 'email', label: this.$t('e_mail') },
@@ -100,14 +94,7 @@ export default {
         { key: 'lastName', label: this.$t('lastname') },
         {
           key: 'creation',
-          label: [
-            this.$d(this.beforeLastMonthDate, 'monthShort'),
-            this.$d(this.lastMonthDate, 'monthShort'),
-            this.$d(this.now, 'monthShort'),
-          ].join(' | '),
-          formatter: (value, key, item) => {
-            return value.join(' | ')
-          },
+          label: this.creationLabel,
         },
         { key: 'show_details', label: this.$t('details') },
         { key: 'confirm_mail', label: this.$t('confirmed') },