coins for bot view

src/layout/components/Navbar.vue

@@ -80,6 +80,10 @@ export default {
         headers: { 'x-api-key': 'PMl`&xWpZ1vE)M]G;{8qIXx4k!ce|n' }
       }).then((result) => {
         this.coins = result
+        this.$store.dispatch('settings/changeSetting', {
+          key: 'currentCoins',
+          value: result
+        })
       }).catch((err) => {
         console.log('ThaErr', err)
       })

src/store/getters.js

@@ -10,6 +10,7 @@ const getters = {
   introduction: state => state.user.introduction,
   roles: state => state.user.roles,
   permission_routes: state => state.permission.routes,
-  errorLogs: state => state.errorLog.logs
+  errorLogs: state => state.errorLog.logs,
+  currentCoins: state => state.settings.currentCoins
 }
 export default getters

src/store/modules/settings.js

@@ -8,7 +8,8 @@ const state = {
   showSettings: showSettings,
   tagsView: tagsView,
   fixedHeader: fixedHeader,
-  sidebarLogo: sidebarLogo
+  sidebarLogo: sidebarLogo,
+  currentCoins: 0
 }
 
 const mutations = {

src/views/chatbot/index.vue

@@ -1,16 +1,27 @@
 <template>
+  <div>
+    <span class="coinclass">Meine Münzen: {{ currentCoins }}
+    </span>
+    <img src="@/assets/logo/coins.png" class="coinsimg">
     <div class="app-container chatbot-container">
       <img src="@/assets/joe.png" class="joeimage">
     </div>
+  </div>
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 export default {
   name: 'Chatbot',
   components: { },
   data() {
     return {}
   },
+  computed: {
+    ...mapGetters([
+      'currentCoins'
+    ])
+  },
   mounted: () => {
     let host = 'https://joinbot.tk/bot'
     let stylesheetdir = '/bot/assets/modules/channel-web/chat.css'
@@ -46,8 +57,23 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+
+.coinclass {
+  height: 70%;
+  margin-left: 50px;
+padding-bottom:5px;
+  font-weight: bolder;
+}
+
+.coinsimg{
+  height: 28px;
+  margin-bottom: -6px;
+  margin-top: 40px;
+  padding-right: 10px;
+}
+
 .chatbot-container {
-  margin: 50px;
+ /* margin: 50px;*/
   display: flex;
   flex-wrap: wrap;
   .document-btn {