diff --git a/frontend/quasar.conf.js b/frontend/quasar.conf.js
index 13253ee..c3a8c30 100644
--- a/frontend/quasar.conf.js
+++ b/frontend/quasar.conf.js
@@ -69,6 +69,9 @@ module.exports = function (ctx) {
         'QSelect',
         'QField',
         'QBtnDropdown',
+        'QPopupEdit',
+        'QSlideTransition',
+        'QToggle',
       ],
 
       directives: [
diff --git a/frontend/src/pages/Login.vue b/frontend/src/pages/Login.vue
index cde8361..ceedb71 100644
--- a/frontend/src/pages/Login.vue
+++ b/frontend/src/pages/Login.vue
@@ -6,7 +6,7 @@
           <div class="col">
             <div class="">
               <div class="" style="max-width: 440px">
-                <q-input outlined filled stack-label v-model="user.email" type="text" label="Benutzername"
+                <q-input outlined filled stack-label v-model="user.email" type="text" label="Email"
                          autocomplete="username"/>
               </div>
             </div>
@@ -23,9 +23,9 @@
             <div class="">
               <div class="" style="max-width: 440px">
                 <q-btn
-                  :loading="loading"
                   :outline="userAuthenticated"
                   :disabled="userAuthenticated"
+                  :loading="loading"
                   label="Login"
                   color="primary"
                   class="full-width"
@@ -102,6 +102,8 @@
             console.log("TOKEN");
             console.log(response.data.token);
             localStorage.setItem('userToken', JSON.stringify(response.data));
+            localStorage.setItem('userMail', JSON.stringify(data.email));
+            this.evalAuthentication();
             this.$router.push({path: `/overview`})
           })
           .catch((error) => {
diff --git a/frontend/src/pages/Profile.vue b/frontend/src/pages/Profile.vue
index 701a102..c87fa1d 100644
--- a/frontend/src/pages/Profile.vue
+++ b/frontend/src/pages/Profile.vue
@@ -12,7 +12,7 @@
         switch-indicator
       >
         <q-tab name="profile" label="Profil" icon="perm_identity"/>
-        <q-tab name="teams" label="Teams" icon="group"/>
+        <q-tab name="teams" label="Team" icon="group"/>
         <q-tab name="startedCaches" label="Angefangene Caches" icon="playlist_play"/>
         <q-tab name="finishedCaches" label="Beendete Caches" icon="playlist_add_check"/>
       </q-tabs>
@@ -23,74 +23,27 @@
       <q-tab-panels v-model="tab" animated swipeable class="col">
 
         <q-tab-panel name="profile" class=" fit">
-
-          <div class="row">
-            <div class="col" align="center">
-              <b>
-                Mein Nutzername
-              </b>
-            </div>
-            <div class="col" align="center">
-              BuGaCacher2019
-            </div>
-          </div>
-          <hr/>
-          <div class="row text-center">
-            <div class="col">
-              <b>
-                Meine Email
-              </b>
-            </div>
-            <div class="col" align="center">
-              muster.mail@muster.de
-            </div>
-          </div>
-          <hr/>
-          <div class="row">
-            <div class="col" align="center">
-              <b>
-                Meine Ranglistenposition
-              </b>
-            </div>
-            <div class="col" align="center">
-              1234
-            </div>
-          </div>
-          <hr/>
-          <div class="row">
-            <div class="col" align="center">
-              <b>
-                Mein Team
-              </b>
-            </div>
-            <div class="col" align="center">
-              BuGa19Community
-            </div>
-          </div>
-          <hr/>
-          <div class="row">
-            <div class="col" align="center">
-              <b>
-                Teamranglistenposition
-              </b>
-            </div>
-            <div class="col" align="center">
-              2019
-            </div>
-          </div>
-          <hr/>
+          <p class="text-h5"> Persönliche Daten </p>
+          <q-table
+            :data="data"
+            :columns="columns"
+            row-key="name"
+            hide-header
+            hide-bottom
+            table-class="my-custom"
+          />
         </q-tab-panel>
         <q-tab-panel name="teams">
           <div class="q-pa-md" align="center">
-            <q-btn-dropdown color="primary" label="BuGa19Community" size="20px">
+            <q-btn-dropdown color="primary" :label="dropDownSelectedItem" size="20px">
               <q-list>
-                <q-item clickable v-close-popup>
+                <q-item clickable v-close-popup @click="dropDownSelectItem('team')">
                   <q-item-section>
-                    <q-item-label>BuGa19Community</q-item-label>
+                    <q-item-label v-html="teamName"></q-item-label>
                   </q-item-section>
                 </q-item>
 
-                <q-item clickable v-close-popup>
+                <q-item clickable v-close-popup @click="dropDownSelectItem('Offene Teameinladungen')">
                   <q-item-section avatar>
                     <q-avatar icon="group_add" color="primary" text-color="white"/>
                   </q-item-section>
@@ -99,7 +52,7 @@
                   </q-item-section>
                 </q-item>
 
-                <q-item clickable v-close-popup>
+                <q-item clickable v-close-popup @click="dropDownSelectItem('Neues Team erstellen')">
                   <q-item-section avatar>
                     <q-avatar icon="add" color="primary" text-color="white"/>
                   </q-item-section>
@@ -110,58 +63,36 @@
               </q-list>
             </q-btn-dropdown>
           </div>
-          <hr/>
+          <p class="text-h5"> Teammitglieder </p>
+          <q-table
+            :data="teamData"
+            :columns="teamColumns"
+            row-key="name"
+            table-class="my-custom"
+            hide-bottom
+            :pagination.sync="pagination"
+          />
+          <br/>
+          <p class="text-h5"> Einladungen </p>
+          <q-input outlined filled stack-label v-model="inviteMail"
+                   type="text" label="Email des Nutzers"
+                   :rules="[val=>validateEmail(val)||'Bitte Email verwenden']"/>
           <div align="center">
-            <b>
-              Teammitglieder
-            </b>
-          </div>
-          <br/>
-          <div align="center">
-            BuGaCacher2019
-            <br/>
-            Max
-            <br/>
-            Timo
-            <br/>
-            Katharina
-            <br/>
-            Michael
-            <br/>
-            Robin
-          </div>
-          <br/>
-          <div class="row">
-            <div class="col" align="center">
-              <q-input outlined filled stack-label v-model="inviteMail"
-                       type="text" label="Email des Nutzers"
-                       :rules="[val=>validateEmail(val)||'Bitte Email verwenden']"/>
-            </div>
-            <div class="col" align="center">
-              <q-btn label="Einladung versenden"
-                     color="primary"
-                     type="submit"/>
-            </div>
-          </div>
-          <hr/>
-          <div align="center">
-            <b>
-              Aktueller Teamstatus
-            </b>
-          </div>
-          <br/>
-          <div>
-            Dienstag 15:00 Treffen zum Blumencache.
+            <q-btn label="Einladung versenden"
+                   color="primary"
+                   type="submit"/>
           </div>
           <br/>
+          <p class="text-h5"> Teamstatus </p>
+          <p>{{currentTeamStatus}}</p>
           <q-input outlined filled stack-label v-model="teamStatus"
-                   type="text" label="Neuer Teamstatus"/>
+                   type="text" label="Neuer Teamstatus"
+                   :rules="[val=>val.length<=160||'Status zu lang!']"/>
           <div align="center">
             <q-btn label="Teamstatus aktualisieren"
                    color="primary"
                    type="submit"/>
           </div>
-
         </q-tab-panel>
 
         <q-tab-panel name="startedCaches" class=" fit">
@@ -240,10 +171,17 @@
 </template>
 
 <style>
-  /*
-    .my-list-card-item
-      padding-left: 8px
-  */
+  .my-custom th {
+    color: #027BE3 !important;
+  }
+
+  .my-custom tr {
+    color: #027BE3 !important;
+  }
+
+  .my-custom td {
+    color: #027BE3 !important;
+  }
 </style>
 <script>
   //import {dom} from 'quasar'
@@ -254,7 +192,102 @@
         tab: 'profile',
         startedCaches: [],
         inviteMail: "",
+        currentTeamStatus: "Dienstag 15:00 Treffen zum Blumencache",
         teamStatus: "",
+        userName: null,
+        email: null,
+        userRanking: null,
+        teamName: null,
+        teamRanking: null,
+        dropDownSelectedItem: null,
+        columns: [
+          {
+            name: 'desc',
+            required: true,
+            align: 'left',
+            field: row => row.name,
+            format: val => `${val}`,
+          },
+          {
+            name: 'userData',
+            required: true,
+            align: 'left',
+            field: 'userData',
+          }
+        ],
+        data: [
+          {
+            name: 'Mein Nutzername',
+            userData: this.userName,
+          },
+          {
+            name: 'Meine Email',
+            userData: this.email,
+          },
+          {
+            name: 'Meine Ranglistenposition',
+            userData: this.userRanking,
+          },
+          {
+            name: 'Mein Team',
+            userData: this.teamName,
+          },
+          {
+            name: 'Teamranglistenposition',
+            userData: this.teamRanking,
+          },
+        ],
+        teamColumns: [
+          {
+            name: 'desc',
+            label: 'Benutzername',
+            required: true,
+            align: 'left',
+            field: row => row.name,
+            format: val => `${val}`,
+          },
+          {
+            name: 'ranking',
+            label: 'Solo-Ranglistenpunkte',
+            required: true,
+            align: 'left',
+            field: 'ranking',
+            sortable: true,
+          }
+        ],
+        teamData: [
+          {
+            name: 'BuGaCacher2019',
+            ranking: 10,
+          },
+          {
+            name: 'Max',
+            ranking: 5,
+          },
+          {
+            name: 'Timo',
+            ranking: 4,
+          },
+          {
+            name: 'Katharina',
+            ranking: 3,
+          },
+          {
+            name: 'Michael',
+            ranking: 2,
+          },
+          {
+            name: 'Robin',
+            ranking: 1,
+          },
+        ],
+        pagination: {
+          sortBy: 'name',
+          descending: false,
+          page: 1,
+          rowsPerPage: 10
+          // rowsNumber: xx if getting data from a server
+        },
       }
     },
     mounted: function () {
@@ -262,12 +295,23 @@
     computed: {
       hasAdminState() {
         return this.$store.getters['auth/GET_ADMINSTATE'];
-      }
+      },
     },
     created: function () {
       this.fetchUserCaches();
       this.$store.commit('auth/SET_AUTHENTICATED');
       this.$store.commit('auth/SET_USER');
+      this.userName = JSON.parse(localStorage.getItem('userToken')).name;
+      this.data[0].userData = this.userName;
+      this.email = JSON.parse(localStorage.getItem('userMail'));
+      this.data[1].userData = this.email;
+      this.userRanking = "1234";
+      this.data[2].userData = this.userRanking;
+      this.teamName = "BuGa19Community";
+      this.data[3].userData = this.teamName;
+      this.dropDownSelectedItem = this.teamName;
+      this.teamRanking = "2019";
+      this.data[4].userData = this.teamRanking;
     },
     methods: {
       fetchUserCaches: function () {
@@ -309,6 +353,73 @@
         let re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
         return re.test(String(email).toLowerCase());
       },
+      getPersonalRanking() {
+        const name = JSON.parse(localStorage.getItem('userToken')).name;
+        console.log(JSON.parse(localStorage.getItem('userToken')).name);
+        this.$axios.get('/api/hello', {params: {name}})
+          .then((response) => {
+            this.userRanking = response.data;
+            console.log(response.data);
+          }).catch((error) => {
+          // Error
+          let msg;
+          let title;
+          if (error.response) {
+            // The request was made and the server responded with a status code
+            title = "Problem with response!";
+            msg = error.response;
+          } else if (error.request) {
+            // The request was made but no response was received
+            title = "Problem with request!";
+            msg = "Error occured due to wrong server request!"
+            console.log(error.request);
+          } else {
+            // Something happened in setting up the request that triggered an Error
+            title = "Error";
+            msg = error.message;
+            console.log('Error', error.message);
+          }
+          console.log(error.config);
+          this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: msg, title: title,});
+        })
+      },
+      getTeamData() {
+        const userName = {name: JSON.parse(localStorage.getItem('userToken')).name};
+        this.$axios.get('/api/getTeam', {params: userName})
+          .then(response => {
+            console.log("getTeam: " + response);
+          }).catch((error) => {
+          // Error
+          let msg;
+          let title;
+          if (error.response) {
+            // The request was made and the server responded with a status code
+            title = "Problem with response!";
+            msg = error.response;
+          } else if (error.request) {
+            // The request was made but no response was received
+            title = "Problem with request!";
+            msg = "Error occured due to wrong server request!"
+            console.log(error.request);
+          } else {
+            // Something happened in setting up the request that triggered an Error
+            title = "Error";
+            msg = error.message;
+            console.log('Error', error.message);
+          }
+          console.log(error.config);
+          this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: msg, title: title,});
+        })
+
+      },
+
+      dropDownSelectItem(item) {
+        if (item === 'team') {
+          this.dropDownSelectedItem = this.teamName;
+        } else {
+          this.dropDownSelectedItem = item;
+        }
+      },
     }
   }
 </script>
diff --git a/src/main/java/hhn/labsw/bugageocaching/repositories/TeamRepository.java b/src/main/java/hhn/labsw/bugageocaching/repositories/TeamRepository.java
index 77c69d9..9390a7c 100644
--- a/src/main/java/hhn/labsw/bugageocaching/repositories/TeamRepository.java
+++ b/src/main/java/hhn/labsw/bugageocaching/repositories/TeamRepository.java
@@ -1,8 +1,28 @@
 package hhn.labsw.bugageocaching.repositories;
 
 import hhn.labsw.bugageocaching.entities.Team;
+import hhn.labsw.bugageocaching.entities.User;
 import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.data.jpa.repository.Query;
 import org.springframework.data.repository.CrudRepository;
 
+import java.util.List;
+
 public interface TeamRepository extends JpaRepository<Team, Integer> {
+
+  Team findByName(String name);
+
+  @Query(value = "SELECT *\n" +
+      "FROM user\n" +
+      "WHERE id = (\n" +
+      "    SELECT user_id\n" +
+      "    FROM user_info\n" +
+      "    WHERE team_id = (SELECT team_id\n" +
+      "                     FROM team\n" +
+      "                     WHERE name = ?1\n" +
+      "    )\n" +
+      ")", nativeQuery = true)
+  List<Object[]> getTeammembers(String name);
+
+
 }