keksAccountGUI/src/views/Dashboard.vue

<template>
  <div style="margin-top:50px;">
    <v-container grid-list-md pa-10 >
      <v-layout row wrap>
        <v-flex md12>
          <h1>Dashboard</h1>
          <br><br>
          <h3>Hello {{$store.getters.getMe["username"]}}, login to</h3>
          <AppCards :apps="apps" v-on:appClick="navigateToApp"></AppCards>
        </v-flex>
      </v-layout>
    </v-container>
  </div>
</template>

<script>
  import ServerService from '../services/Server'
  import UserService from '../services/User'
  import AppService from '../services/Apps'
  import AppCardsComponente from '../components/AppCards'

  export default {
    data () {
      return {
        nameBig: '',
        nameSmall: '',
        apps: []
      }
    },
    components: {
      "AppCards": AppCardsComponente
    },
    methods: {
      'getImageUrl' : function (id) {
        return AppService.getAppImage(id);
      },
      'navigateToApp': function(item) {
        if(item.directUrl) {
          location.href = item.directUrl;
        } else {
          location.href = item.url;
        }

      },
      'getStartpageApps': function () {
        AppService.getStartPageApps().then((res) => {
          this.apps = res.data.data;
        });
      }
    },
    mounted: function() {
      this.nameBig = this.$store.getters.getSettingValue("name_big");
      this.nameSmall = this.$store.getters.getSettingValue("name_small");
      this.getStartpageApps();
    }
      }
</script>

<style>
  .header {
    background-image: url('~@/assets/manhattan-407703_1920.jpg');
    background-repeat: no-repeat;
    margin-top: -100px;
    height: 30vh;
    text-align: center;
  }
    .header h1{
      padding-top: 200px;
      font-size: 56px !important;
      font-weight: 400;
      line-height: 32px !important;
      letter-spacing: normal !important;
    }
    .header h1 .small{
      font-weight: 300 !important;
    }
  .header h2{
    padding-top: 30px;
    font-size: 34px !important;
    font-weight: 300;
    line-height: 32px !important;
    letter-spacing: normal !important;
  }
  h1{
    font-weight: 300;
    line-height: 32px !important;
    letter-spacing: normal !important;
  }
  h2{
    font-weight: 300;
    line-height: 32px !important;
    letter-spacing: normal !important;
  }
</style>