myProfile and myTeams MOCKUP version added
This commit is contained in:
rchrist
parent
85cfd5e3f4
commit
c10820d832
@ -68,6 +68,7 @@ module.exports = function (ctx) {
|
||||
'QEditor',
|
||||
'QSelect',
|
||||
'QField',
|
||||
'QBtnDropdown',
|
||||
],
|
||||
|
||||
directives: [
|
||||
|
||||
@ -1,20 +1,21 @@
|
||||
<template>
|
||||
<q-page class="column no-wrap">
|
||||
<div class="bg-red col col-shrink" style="">
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
class="bg-grey-2"
|
||||
inline-label
|
||||
align="justify"
|
||||
active-bg-color="bg-grey-1"
|
||||
active-color="cyan-14"
|
||||
indicator-color="cyan-14"
|
||||
switch-indicator
|
||||
>
|
||||
<q-tab name="profile" label="Profil" icon="perm_identity"/>
|
||||
<q-tab name="startedCaches" label="Angefangene Caches" icon="playlist_play"/>
|
||||
<q-tab name="finishedCaches" label="Beendete Caches" icon="playlist_add_check"/>
|
||||
</q-tabs>
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
class="bg-grey-2"
|
||||
inline-label
|
||||
align="justify"
|
||||
active-bg-color="bg-grey-1"
|
||||
active-color="cyan-14"
|
||||
indicator-color="cyan-14"
|
||||
switch-indicator
|
||||
>
|
||||
<q-tab name="profile" label="Profil" icon="perm_identity"/>
|
||||
<q-tab name="teams" label="Teams" 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>
|
||||
<q-separator color="grey-4"/>
|
||||
</div>
|
||||
|
||||
@ -22,6 +23,151 @@
|
||||
<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 align="center">
|
||||
<b>
|
||||
Meine Teams
|
||||
</b>
|
||||
</div>
|
||||
<br/>
|
||||
<div class="col" align="center">
|
||||
BuGa19Community
|
||||
<br/>
|
||||
GeoCachingHeilbronn
|
||||
<br/>
|
||||
RunForTheFlowers
|
||||
</div>
|
||||
<br/>
|
||||
<div align="center">
|
||||
<b>
|
||||
Offene Teameinladungen
|
||||
</b>
|
||||
</div>
|
||||
<br/>
|
||||
<div class="col" align="center">
|
||||
HNcachingHN
|
||||
</div>
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="teams">
|
||||
<div class="q-pa-md" align="center">
|
||||
<q-btn-dropdown color="primary" label="BuGa19Community" size="30px">
|
||||
<q-list>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section>
|
||||
<q-item-label>BuGa19Community</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section>
|
||||
<q-item-label>GeoCachingHeilbronn</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section>
|
||||
<q-item-label>RunForTheFlowers</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section>
|
||||
<q-item-label>HNcachingHN</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-btn-dropdown>
|
||||
</div>
|
||||
<hr/>
|
||||
<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 der ins Team aufgenommen werden soll"
|
||||
:rules="[val=>validateEmail(val)||'Bitte Email verwenden']"/>
|
||||
</div>
|
||||
<div class="col" align="center">
|
||||
<q-btn label="Einladung versenden"
|
||||
color="primary"
|
||||
type="submit"
|
||||
size="22px"/>
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
<div align="center">
|
||||
<b>
|
||||
Aktueller Teamstatus
|
||||
</b>
|
||||
</div>
|
||||
<br/>
|
||||
<div>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugit nihil praesentium molestias a adipisci,
|
||||
dolore vitae odit, quidem consequatur optio voluptates asperiores pariatur eos numquam rerum delectus
|
||||
commodi perferendis voluptate?
|
||||
</div>
|
||||
<br/>
|
||||
<q-input outlined filled stack-label v-model="teamStatus"
|
||||
type="text" label="Neuer Teamstatus"/>
|
||||
<br/>
|
||||
<div align="center">
|
||||
<q-btn label="Teamstatus aktualisieren"
|
||||
size="20px"
|
||||
color="primary"
|
||||
type="submit"/>
|
||||
</div>
|
||||
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="startedCaches" class=" fit">
|
||||
@ -76,7 +222,9 @@
|
||||
<!--<q-icon rounded color="cyan-14" name="location_on" size="3rem"/>-->
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{'Erhaltene Punkte für diesen Cache: ' + startedCache.cache.rankingPoints }}</q-item-label>
|
||||
<q-item-label caption>{{'Erhaltene Punkte für diesen Cache: ' + startedCache.cache.rankingPoints
|
||||
}}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section side top class="self-center">
|
||||
@ -107,6 +255,8 @@
|
||||
return {
|
||||
tab: 'profile',
|
||||
startedCaches: [],
|
||||
inviteMail: "",
|
||||
teamStatus: "",
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
@ -116,17 +266,17 @@
|
||||
return this.$store.getters['auth/GET_ADMINSTATE'];
|
||||
}
|
||||
},
|
||||
created: function() {
|
||||
created: function () {
|
||||
this.fetchUserCaches();
|
||||
this.$store.commit('auth/SET_AUTHENTICATED');
|
||||
this.$store.commit('auth/SET_USER');
|
||||
},
|
||||
methods: {
|
||||
fetchUserCaches: function() {
|
||||
fetchUserCaches: function () {
|
||||
const token = JSON.parse(localStorage.getItem('userToken')).token;
|
||||
this.$axios.get('/api/getMyCaches', { params: {token}} )
|
||||
this.$axios.get('/api/getMyCaches', {params: {token}})
|
||||
.then((response) => {
|
||||
this.startedCaches = response.data;
|
||||
this.startedCaches = response.data;
|
||||
}).catch((error) => {
|
||||
// Error
|
||||
let msg;
|
||||
@ -147,11 +297,15 @@
|
||||
console.log('Error', error.message);
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: msg, title: title, });
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: msg, title: title,});
|
||||
})
|
||||
},
|
||||
continueCache(cacheID) {
|
||||
}
|
||||
},
|
||||
validateEmail(email) {
|
||||
var 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());
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user