keksAccountGUI/src/views/Dashboard.vue

95 lines
2.2 KiB
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>