From 7fd8a13c8508c5f5b0e023c393e3d88376da63eb Mon Sep 17 00:00:00 2001
From: Kekskurse <git@kekskurse.de>
Date: Fri, 26 Jul 2019 11:13:36 +0200
Subject: [PATCH] Startpage

---
 src/views/Startpage.vue | 138 +++++++---------------------------------
 1 file changed, 24 insertions(+), 114 deletions(-)

diff --git a/src/views/Startpage.vue b/src/views/Startpage.vue
index 509375c8..2de1db6b 100644
--- a/src/views/Startpage.vue
+++ b/src/views/Startpage.vue
@@ -10,12 +10,15 @@
           <h1>Services</h1>
           <p>Mit deinem KeksAccount Username kannst du dich u.a. bei folgenden Servicen einloggen und diese nutzten. </p>
         </v-flex>
-        <v-flex md4 text-xs-center>
+
+      </v-layout>
+      <v-layout row wrap>
+        <v-flex md4 xs12 text-xs-center v-for="(item, index) in apps">
           <v-card>
             <v-layout>
               <v-flex xs5>
                 <v-img
-                        src="https://api.account.keks.cloud/gui/apps/1/icon"
+                        :src="getImageUrl(item.id)"
                         height="125px"
                         contain
                 ></v-img>
@@ -23,8 +26,8 @@
               <v-flex xs7>
                 <v-card-title primary-title>
                   <div>
-                    <div class="headline">Git</div>
-                    <div>Git-Server von keks.cloud</div>
+                    <div class="headline">{{ item.name }}</div>
+                    <div>{{ item.description }}</div>
                   </div>
                 </v-card-title>
               </v-flex>
@@ -33,115 +36,9 @@
             <v-card-actions class="pa-3">
 
               <v-spacer></v-spacer>
-              <v-icon>exit_to_app</v-icon>
-            </v-card-actions>
-          </v-card>
-        </v-flex>
-        <v-flex md4 text-xs-center>
-          <v-card>
-            <v-layout>
-              <v-flex xs5>
-                <v-img
-                        src="https://api.account.keks.cloud/gui/apps/3/icon"
-                        height="125px"
-                        contain
-                ></v-img>
-              </v-flex>
-              <v-flex xs7>
-                <v-card-title primary-title>
-                  <div>
-                    <div class="headline">Chat</div>
-                    <div>Mattermost Chat Server</div>
-                  </div>
-                </v-card-title>
-              </v-flex>
-            </v-layout>
-            <v-divider light></v-divider>
-            <v-card-actions class="pa-3">
-
-              <v-spacer></v-spacer>
-              <v-icon>exit_to_app</v-icon>
-            </v-card-actions>
-          </v-card>
-        </v-flex>
-        <v-flex md4 text-xs-center>
-          <v-card>
-            <v-layout>
-              <v-flex xs5>
-                <v-img
-                        src="https://api.account.keks.cloud/gui/apps/4/icon"
-                        height="125px"
-                        contain
-                ></v-img>
-              </v-flex>
-              <v-flex xs7>
-                <v-card-title primary-title>
-                  <div>
-                    <div class="headline">Nextcloud</div>
-                    <div>Share Files with other Users</div>
-                  </div>
-                </v-card-title>
-              </v-flex>
-            </v-layout>
-            <v-divider light></v-divider>
-            <v-card-actions class="pa-3">
-
-              <v-spacer></v-spacer>
-              <v-icon>exit_to_app</v-icon>
-            </v-card-actions>
-          </v-card>
-        </v-flex>
-        <v-flex md4 text-xs-center>
-          <v-card>
-            <v-layout>
-              <v-flex xs5>
-                <v-img
-                        src="https://api.account.keks.cloud/gui/apps/5/icon"
-                        height="125px"
-                        contain
-                ></v-img>
-              </v-flex>
-              <v-flex xs7>
-                <v-card-title primary-title>
-                  <div>
-                    <div class="headline">Jenkins</div>
-                    <div>Build pipelines for Developer</div>
-                  </div>
-                </v-card-title>
-              </v-flex>
-            </v-layout>
-            <v-divider light></v-divider>
-            <v-card-actions class="pa-3">
-
-              <v-spacer></v-spacer>
-              <v-icon>exit_to_app</v-icon>
-            </v-card-actions>
-          </v-card>
-        </v-flex>
-        <v-flex md4 text-xs-center>
-          <v-card>
-            <v-layout>
-              <v-flex xs5>
-                <v-img
-                        src="https://api.account.keks.cloud/gui/apps/7/icon"
-                        height="125px"
-                        contain
-                ></v-img>
-              </v-flex>
-              <v-flex xs7>
-                <v-card-title primary-title>
-                  <div>
-                    <div class="headline">Wiki</div>
-                    <div>Dokumentation von Servicen und Projekten</div>
-                  </div>
-                </v-card-title>
-              </v-flex>
-            </v-layout>
-            <v-divider light></v-divider>
-            <v-card-actions class="pa-3">
-
-              <v-spacer></v-spacer>
-              <v-icon>exit_to_app</v-icon>
+              <v-btn icon>
+                <v-icon @click="navigateToApp(item)">input</v-icon>
+              </v-btn>
             </v-card-actions>
           </v-card>
         </v-flex>
@@ -154,6 +51,7 @@
 </template>
 
 <script>
+  import AppService from '../services/Apps'
   export default {
     data () {
       return {
@@ -164,13 +62,25 @@
           { icon: 'home', title: 'Login' },
           { icon: 'info', title: 'Invited' },
           { icon: 'warning', title: 'Register' }
-        ]
+        ],
+        apps: []
       }
     },
+    methods: {
+      'getStartpageApps': function () {
+        AppService.getStartPageApps().then((res) => {
+          this.apps = res.data.data;
+        });
+      },
+      'getImageUrl' : function (id) {
+        return AppService.getAppImage(id);
+      },
+    },
     mounted: function() {
       this.nameBig = this.$store.getters.getSettingValue("name_big");
       this.nameSmall = this.$store.getters.getSettingValue("name_small");
       this.slogen = this.$store.getters.getSettingValue("name_slogen");
+      this.getStartpageApps();
     }
       }
 </script>