refactor: Mixin for Creation Labels

admin/src/components/UserTable.vue

@@ -195,6 +195,7 @@ export default {
     creation: {
       type: Array,
       required: false,
+      default: () => [null, null, null],
     },
   },
   components: {

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(' | ')
+    },
   },
 }

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() {

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') },