This commit is contained in:
rchrist 2019-05-14 14:12:10 +02:00
parent 93174fa788
commit adad85d4d0
2 changed files with 126 additions and 96 deletions

View File

@ -12,7 +12,7 @@
switch-indicator
>
<q-tab name="profile" label="Profil" icon="perm_identity"/>
<q-tab name="teams" label="Team" icon="group"/>
<q-tab v-if="boolAlreadyInTeam" name="teams" label="Team" icon="group"/>
</q-tabs>
<q-separator color="grey-4"/>
</div>
@ -23,11 +23,12 @@
<q-tab-panel name="profile" class="fit q-pa-none">
<div class="bg-primary q-pa-md">
<p class="text-h3 text-white"> {{userName}} </p>
<p class="text-white"> {{email}} </p>
<p class="text-white"> Meine Email: {{email}} </p>
<p class="text-white"> Mein Rang: {{userRanking}} </p>
<p class="text-white"> Mein Team: {{teamName}} </p>
</div>
<div class="q-pa-md">
<div>
<q-input v-show="!boolAlreadyInTeam" lazy-rules outlined filled stack-label v-model="newTeamName"
type="text"
label="Teamname eingeben"
@ -41,6 +42,9 @@
@click="createTeam()"
unelevated
/>
</div>
<br/>
<p class="text-h5" v-show="!boolAlreadyInTeam"> Teameinladungen </p>
<q-list>
<q-card class="q-mb-md" v-for="teamInvite in teamInvites" :key="teamInvite.id">
<q-expansion-item
@ -62,19 +66,20 @@
</q-card>
</q-list>
<div align="center">
<q-btn label="Team verlassen"
<q-btn v-show="boolAlreadyInTeam"
label="Team verlassen"
@click="confirmLeave()"
color="negative"
type="submit"/>
</div>
</div>
</q-tab-panel>
<q-tab-panel name="teams" class="q-pa-none">
<div class="bg-primary q-pa-md">
<q-tab-panel v-if="boolAlreadyInTeam" name="teams" class="q-pa-none">
<div class="bg-primary q-pa-md" v-show="boolAlreadyInTeam">
<p class="text-h3 text-white"> {{teamName}} </p>
<p class="text-white"> Unser Rang: {{teamRanking}} </p>
<p v-show="!boolStatus" class="text-white">
{{currentTeamStatus}}
Unser Status: {{currentTeamStatus}}
<q-btn icon="create"
class="on-right"
@click="updateStatus()"
@ -97,9 +102,10 @@
type="submit"/>
</div>
</div>
<div class="bg-white q-pa-md">
<div class="bg-white q-pa-md" v-show="boolAlreadyInTeam">
<p class="text-h5"> Teammitglieder </p>
<q-table
v-if="boolTable"
name="teamDataTable"
:data="teamData"
:columns="teamColumns"
@ -116,6 +122,7 @@
type="submit"/>
</div>
<br/>
<div align="center">
<q-input v-show="inviteActivated" lazy-rules outlined filled stack-label v-model="inviteMail"
type="text" label="Email des Nutzers"
:rules="[val=>validateEmail(val)||'Bitte Email verwenden']"/>
@ -125,6 +132,7 @@
:disabled="!teamInviteChecked"
color="positive"
type="submit"/>
</div>
<br/>
<div align="center">
<q-btn label="Team verlassen"
@ -177,6 +185,7 @@
teamInvites: [],
inviteActivated: false,
boolStatus: false,
boolTable: true,
boolMemberTableUpdating: false,
teamColumns: [
{
@ -242,8 +251,7 @@
this.userName = JSON.parse(localStorage.getItem('userToken')).name;
this.email = JSON.parse(localStorage.getItem('userMail'));
this.getPersonalRanking();
this.getTeamData();
this.fetchTeamInvites();
this.updateTeamData();
},
methods: {
confirmLeave() {
@ -274,6 +282,13 @@
this.boolStatus = true;
}
},
updateTable() {
if (this.boolTable) {
this.boolTable = false;
} else {
this.boolTable = true;
}
},
validateEmail(email) {
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());
@ -287,7 +302,14 @@
this.handleError(error);
})
},
async updateTeamData() {
await this.getTeamData();
this.boolTable = false;
this.boolTable = await this.fetchTeamMembers();
await this.fetchTeamInvites();
},
getTeamData() {
return new Promise(resolve => {
let token;
if (localStorage.getItem('userToken')) {
token = JSON.parse(localStorage.getItem('userToken')).token;
@ -301,17 +323,17 @@
this.teamName = "Aktuell in keinem Team";
this.currentTeamStatus = "";
this.teamRanking = "-";
this.dropDownSelectItem('Offene Teameinladungen');
} else {
this.boolAlreadyInTeam = true;
this.teamName = response.data.name;
this.currentTeamStatus = response.data.teamStatus;
this.fetchTeamMembers();
this.teamRanking = "-";
}
console.log("getTeam: " + response);
}).catch((error) => {
this.handleError(error);
});
}).finally(() => resolve(true));
})
},
createTeam() {
let params = {};
@ -329,6 +351,7 @@
title: "Teamerstellung",
color: "blue"
});
this.updateTeamData();
}).catch((error) => {
this.handleError(error);
})
@ -344,34 +367,38 @@
.then((response) => {
console.log("createTeam: " + response);
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {
message: "Dus hast das Team " + this.teamName + " verlassen!",
message: "Du hast das Team " + this.teamName + " verlassen!",
title: "Team verlassen",
color: "blue"
});
this.getTeamData();
this.updateTeamData();
}).catch((error) => {
this.handleError(error);
})
},
fetchTeamMembers() {
return new Promise(resolve => {
this.teamData = [];
let name = this.teamName;
this.$axios.get('/api/getTeamMembers', {params: {name}})
.then((response) => {
.then(async (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);
await this.getMemberRanking(member, member.email);
this.teamData.push(member);
}
}).catch((error) => {
this.handleError(error);
}).finally(() => resolve(true))
})
},
getMemberRanking(member, email) {
return new Promise(resolve => {
this.updateTable();
let ranking;
this.$axios.get('/api/getRankingPlace', {params: {email}})
.then((response) => {
@ -379,9 +406,11 @@
member.ranking = ranking;
}).catch((error) => {
this.handleError(error);
});
}).finally(() => resolve(true))
})
},
fetchTeamInvites() {
return new Promise(resolve => {
let token;
if (localStorage.getItem('userToken')) {
token = JSON.parse(localStorage.getItem('userToken')).token;
@ -394,6 +423,7 @@
console.log(this.teamInvites);
}).catch((error) => {
this.handleError(error);
}).finally(() => resolve(true))
})
},
joinTeam(teamInvite) {
@ -412,7 +442,7 @@
title: "Teambeitrittsanfrage",
color: "blue"
});
this.getTeamData();
this.updateTeamData();
}).catch((error) => {
this.handleError(error);
})
@ -432,7 +462,7 @@
title: "Teambeitrittsanfrage",
color: "blue"
});
this.getTeamData();
this.updateTeamData();
}).catch((error) => {
this.handleError(error);
})
@ -466,7 +496,7 @@
params.teamStatus = this.teamStatus;
this.$axios.put('/api/setTeamStatus', null, {params})
.then((response) => {
this.getTeamData();
this.updateTeamData();
}).catch((error) => {
this.handleError(error);
})

View File

@ -6,7 +6,7 @@
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input lazy-rules outlined filled stack-label v-model="user.name" type="text" label="Benutzername"
<q-input lazy-rules outlined filled stack-label v-model="user.name" type="text" label="Name"
:rules="[val=>val.length>=2||'Name muss mindestens 2 Zeichen lang sein!']"/>
</div>
</div>