add methodes to update hide amounts

frontend/src/components/Template/ContentHeader/GddAmount.vue

@@ -39,7 +39,7 @@
           <b-icon
             :icon="hideAmount ? 'eye-slash' : 'eye'"
             class="mr-3 gradido-global-border-color-accent pointer hover-icon"
-            @click="$store.commit('hideAmountGDD', !hideAmount)"
+            @click="updateHideAmountGDD"
           ></b-icon>
         </b-col>
       </b-row>
@@ -47,6 +47,8 @@
   </div>
 </template>
 <script>
+import { updateUserInfos } from '@/graphql/mutations'
+
 export default {
   name: 'GddAmount',
   props: {
@@ -60,5 +62,27 @@ export default {
       return this.$store.state.hideAmountGDD
     },
   },
+  methods: {
+    async updateHideAmountGDD() {
+      this.$apollo
+        .mutate({
+          mutation: updateUserInfos,
+          variables: {
+            hideAmountGDD: !this.hideAmount,
+          },
+        })
+        .then(() => {
+          this.$store.commit('hideAmountGDD', !this.hideAmount)
+          if (!this.hideAmount) {
+            this.toastSuccess(this.$t('settings.showAmountGDD'))
+          } else {
+            this.toastSuccess(this.$t('settings.hideAmountGDD'))
+          }
+        })
+        .catch((error) => {
+          this.toastError(error.message)
+        })
+    },
+  },
 }
 </script>

frontend/src/components/Template/ContentHeader/GdtAmount.vue

@@ -34,7 +34,7 @@
           <b-icon
             :icon="hideAmount ? 'eye-slash' : 'eye'"
             class="mr-3 gradido-global-border-color-accent pointer hover-icon"
-            @click="$store.commit('hideAmountGDT', !hideAmount)"
+            @click="updateHideAmountGDT"
           ></b-icon>
         </b-col>
       </b-row>
@@ -42,6 +42,8 @@
   </div>
 </template>
 <script>
+import { updateUserInfos } from '@/graphql/mutations'
+
 export default {
   name: 'GdtAmount',
   props: {
@@ -54,5 +56,27 @@ export default {
       return this.$store.state.hideAmountGDT
     },
   },
+  methods: {
+    async updateHideAmountGDT() {
+      this.$apollo
+        .mutate({
+          mutation: updateUserInfos,
+          variables: {
+            hideAmountGDT: !this.hideAmount,
+          },
+        })
+        .then(() => {
+          this.$store.commit('hideAmountGDT', !this.hideAmount)
+          if (!this.hideAmount) {
+            this.toastSuccess(this.$t('settings.showAmountGDT'))
+          } else {
+            this.toastSuccess(this.$t('settings.hideAmountGDT'))
+          }
+        })
+        .catch((error) => {
+          this.toastError(error.message)
+        })
+    },
+  },
 }
 </script>

frontend/src/graphql/mutations.js

@@ -31,8 +31,8 @@ export const updateUserInfos = gql`
     $password: String
     $passwordNew: String
     $locale: String
-    $hideAmountGDD: boolean!
-    $hideAmountGDT: boolean!
+    $hideAmountGDD: Boolean
+    $hideAmountGDT: Boolean
   ) {
     updateUserInfos(
       firstName: $firstName

frontend/src/locales/de.json

@@ -269,6 +269,10 @@
     "warningText": "Bist du noch da?"
   },
   "settings": {
+    "showAmountGDD": "Dein GDD Betrag ist sichtbar.",
+    "hideAmountGDD": "Dein GDD Betrag ist versteckt.",
+    "showAmountGDT": "Dein GDT Betrag ist sichtbar.",
+    "hideAmountGDT": "Dein GDT Betrag ist versteckt.",
     "language": {
       "changeLanguage": "Sprache ändern",
       "de": "Deutsch",