53 lines
1.7 KiB
Vue
53 lines
1.7 KiB
Vue
<template>
|
|
<div>
|
|
<div class="q-ma-md">
|
|
<p class="text-h4">{{ data.cacheName }}</p>
|
|
<p class="text-h5">{{ end1 + data.cachePoints + end2 }}</p>
|
|
|
|
<div class="column q-gutter-y-md">
|
|
<q-btn unelevated v-if="IsLoggedIn" color="primary" label="Zur Rangliste" to="/ranking/"/>
|
|
<q-btn unelevated v-if="isLoggedIn" color="primary" label="Zur Belohnung" @click="reward = true">
|
|
<q-dialog v-model="reward">
|
|
<q-card>
|
|
<q-card-section>
|
|
<div class="text-h6">Jetzt ist eine gute Zeit, etwas Neues zu beginnen.</div>
|
|
</q-card-section>
|
|
</card>
|
|
</q-dialog>
|
|
<q-btn unelevated color="primary" label="Zur Startseite" to="/"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
reward: false,
|
|
end1: "Gut gemacht, Du hast alle Stationen dieses Cache gefunden. Dir wurden ",
|
|
end2: " Punkte gutgeschrieben." //TODO Punkte wirklich gutschreiben, ggf. Cache auf erledigt setzen
|
|
}
|
|
},
|
|
computed: {
|
|
isLoggedIn() {
|
|
return localStorage.getItem('userToken'); //TODO Methode umschreiben --> funktioniert das?
|
|
}
|
|
},
|
|
methods: {
|
|
fetchData() {
|
|
this.$axios.get('/api/allCaches')
|
|
.then((response) => {
|
|
console.log("/api/allCaches");
|
|
console.log(JSON.stringify(this.data));
|
|
console.log(this.data);
|
|
console.log(response.data);
|
|
const cache = response.data.find(cache => cache.id === Number(this.$route.params.cache));
|
|
this.data.cacheName = cache.name;
|
|
this.data.cachePoints = cache.rankingPoints;
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|