finished team component

frontend/quasar.conf.js

@@ -109,8 +109,8 @@ module.exports = function (ctx) {
       },
       env: ctx.dev
         ? { // Base URL for API-Calls: DEV
-          //API: JSON.stringify('http://localhost:8080'),
+          API: JSON.stringify('http://localhost:8080'),
-          API: JSON.stringify('https://seserver.se.hs-heilbronn.de:9443/buga19geocaching'),
+          //API: JSON.stringify('https://seserver.se.hs-heilbronn.de:9443/buga19geocaching'),
           USER_API: JSON.stringify('https://seserver.se.hs-heilbronn.de:9443/buga19usermanagement')
         }
         : { // Base URL for API-Calls: PRODUCTION (build)

frontend/src/pages/Profile.vue

@@ -58,7 +58,9 @@
                   </q-item-section>
                   <q-item-section>
                     <q-item-label v-show="!boolAlreadyInTeam">Neues Team erstellen</q-item-label>
-                    <q-item-label v-show="boolAlreadyInTeam">Neues Team erstellen<br/>(Team verlassen um Option zu nutzen)</q-item-label>
+                    <q-item-label v-show="boolAlreadyInTeam">Neues Team erstellen<br/>(Team verlassen um Option zu
+                      nutzen)
+                    </q-item-label>
                   </q-item-section>
                 </q-item>
               </q-list>
@@ -76,7 +78,7 @@
             />
             <br/>
             <p class="text-h5"> Einladungen </p>
-            <q-input outlined filled stack-label v-model="inviteMail"
+            <q-input lazy-rules outlined filled stack-label v-model="inviteMail"
                      type="text" label="Email des Nutzers"
                      :rules="[val=>validateEmail(val)||'Bitte Email verwenden']"/>
             <div align="center">
@@ -89,7 +91,7 @@
             <br/>
             <p class="text-h5"> Teamstatus </p>
             <p>{{currentTeamStatus}}</p>
-            <q-input outlined filled stack-label v-model="teamStatus"
+            <q-input lazy-rules outlined filled stack-label v-model="teamStatus"
                      type="text" label="Neuer Teamstatus"
                      :rules="[val=>val.length<=160||'Status zu lang!']"/>
             <div align="center">
@@ -99,6 +101,17 @@
                      color="primary"
                      type="submit"/>
             </div>
+            <br/>
+            <q-input lazy-rules outlined filled stack-label v-model="leaveTeamCheck"
+                     type="text" label="BESTÄTIGEN eingeben um das Team zu verlassen"
+                     :rules="[val=>val==='BESTÄTIGEN'||'Schreibweise beachten']"/>
+            <div align="center">
+              <q-btn label="Team verlassen"
+                     :disabled="!leaveConfirmed"
+                     @click="leaveTeam()"
+                     color="negative"
+                     type="submit"/>
+            </div>
           </div>
           <div v-show="boolInvites">
             <q-list>
@@ -122,7 +135,7 @@
             </q-list>
           </div>
           <div v-show="boolCreateTeam">
-            <q-input outlined filled stack-label v-model="newTeamName" type="text"
+            <q-input lazy-rules outlined filled stack-label v-model="newTeamName" type="text"
                      label="Teamname eingeben"
                      :rules="[val=>val.length>=2||'Name muss mindestens 5 Zeichen lang sein!']"/>
             <q-btn
@@ -176,6 +189,7 @@
         boolInvites: false,
         boolCreateTeam: false,
         newTeamName: "",
+        leaveTeamCheck: "",
         teamMembers: [],
         teamInvites: [],
         columns: [
@@ -240,18 +254,7 @@
             sortable: true,
           }
         ],
-        teamData: [
+        teamData: [],
-          {
-            name: 'BuGaCacher2018',
-            email: 'buga@buga.com',
-            ranking: 10,
-          },
-          {
-            name: 'BuGaCacher2019',
-            email: 'buga@buga.de',
-            ranking: 9,
-          },
-        ],
         pagination: {
           sortBy: 'ranking',
           descending: false,
@@ -285,6 +288,12 @@
         }
         return false;
       },
+      leaveConfirmed() {
+        if (this.leaveTeamCheck === 'BESTÄTIGEN'){
+          return true;
+        }
+        return false;
+      }
     },
     created: function () {
       this.$store.commit('auth/SET_AUTHENTICATED');
@@ -381,16 +390,53 @@
           this.handleError(error);
         })
       },
+      leaveTeam() {
+        let params = {};
+        if (localStorage.getItem('userToken')) {
+          params.token = JSON.parse(localStorage.getItem('userToken')).token;
+        } else {
+          return;
+        }
+        this.$axios.put('/api/leaveTeam', null, {params})
+          .then((response) => {
+            console.log("createTeam: " + response);
+            this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {
+              message: "Dus hast das Team " + this.teamName + " verlassen!",
+              title: "Team verlassen",
+              color: "blue"
+            });
+            this.getTeamData();
+          }).catch((error) => {
+          this.handleError(error);
+        })
+      },
       fetchTeamMembers() {
         let name = this.teamName;
         this.$axios.get('/api/getTeamMembers', {params: {name}})
           .then((response) => {
             console.log(response.data);
             this.teamMembers = response.data;
+            for (var i = 0; i < this.teamMembers.length; i++) {
+              let member = {};
+              member.name = this.teamMembers[i].username;
+              member.email = this.teamMembers[i].email;
+              this.getMemberRanking(member, member.email);
+              this.teamData.push(member);
+            }
           }).catch((error) => {
           this.handleError(error);
         })
       },
+      getMemberRanking(member, email) {
+        let ranking;
+        this.$axios.get('/api/getRankingPlace', {params: {email}})
+          .then((response) => {
+            ranking = response.data;
+            member.ranking = ranking;
+          }).catch((error) => {
+          this.handleError(error);
+        });
+      },
       fetchTeamInvites() {
         let token;
         if (localStorage.getItem('userToken')) {
@@ -422,6 +468,7 @@
               title: "Teambeitrittsanfrage",
               color: "blue"
             });
+            this.getTeamData();
           }).catch((error) => {
           this.handleError(error);
         })