keksAccountGUI/src/views/ListApps.vue

<template>
    <div style="margin-top: 50px;">
        <v-container grid-list-md pa-10>
            <v-layout row wrap>
                <v-flex md12>
                    <v-btn color="success" style="float:right;" @click="$router.push({name: 'newApp'})">Add App</v-btn>
                    <h1>Apps</h1>
                    <br><br>
                    <p>Here you can Administrate your apps</p>
                </v-flex>
            </v-layout>
            <AppCards :apps="apps" v-on:appClick="navigateToAppSettingPage"></AppCards>
        </v-container>


    </div>

</template>

<script>
    import AppService from '../services/Apps'
    import AppCardsComponente from '../components/AppCards'

    export default {
        data () {
            return {
                apps: [],
            }
        },
        components: {
            "AppCards": AppCardsComponente
        },
        methods: {
            getImageUrl: function(id) {
                return AppService.getAppImage(id); // "https://account.keks.cloud/gui/apps/"+id+"/icon";
            },
            navigateToAppSettingPage: function(app) {
                this.$router.push({name: 'appDetails', params: {id: app.id}});
            }
        },
        mounted: function() {
            AppService.listApps().then((res) => {
               this.apps = res.data.data;
               console.log(this.apps);
            });
        }
    }
</script>