improvements: profile, qr-scanner, layout
This commit is contained in:
Timo Volkmann
parent
b6a9cdcb07
commit
b5ba5230ab
@ -65,11 +65,11 @@
|
||||
this.validating = true;
|
||||
this.isValid = await this.validate();
|
||||
|
||||
window.setTimeout(() => {
|
||||
this.validating = false;
|
||||
this.unPauseCamera();
|
||||
}, 2000)
|
||||
//this.unPauseCamera();
|
||||
this.validating = false;
|
||||
this.unPauseCamera();
|
||||
// window.setTimeout(() => {
|
||||
// }, 2000)
|
||||
// //this.unPauseCamera();
|
||||
},
|
||||
|
||||
validate() {
|
||||
@ -77,9 +77,11 @@
|
||||
let params = this.setParams();
|
||||
console.log(params);
|
||||
if (!params.cacheID || !params.stationID || !params.durchgefuehrterCacheID || !params.token) {
|
||||
console.log("Parameter konnten nicht erkannt werden.");
|
||||
console.log("Mindestens 1 Parameter konnte nicht erkannt werden!");
|
||||
resolve(false);
|
||||
} else if (isNaN(params.cacheID) || isNaN(params.stationID) || isNaN(params.durchgefuehrterCacheID)) {
|
||||
console.log("Mindestens 1 Parameter ist fehlerhaft!");
|
||||
resolve(false);
|
||||
console.log("Parameter konnten nicht erkannt werden.");
|
||||
} else {
|
||||
this.$axios.put('/api/checkStation', null, { params })
|
||||
.then((response) => {
|
||||
@ -98,12 +100,20 @@
|
||||
let message = "";
|
||||
if (error.response) {
|
||||
console.log(error.response);
|
||||
header = "Falsche Station!";
|
||||
message = "Diese Station wurde schon gescannt, ist noch nicht an der Reihe oder gehört nicht zum Cache. ";
|
||||
message += "Bitte das Rätsel nochmal lesen und die richtige Station scannen.";
|
||||
if (this.$route.path === "/qr-scanner") {
|
||||
console.log(this.$route);
|
||||
header = "Falsche Station!";
|
||||
message = "Bitte setze einen bereits angefangenen Cache " +
|
||||
"an der richtigen Station fort oder beginne einen neuen Cache indem du eine der " +
|
||||
"Startstationen einscannst. Du findest die Startstationen über die Karte.";
|
||||
} else {
|
||||
header = "Falsche Station!";
|
||||
message = "Du hast diese Station schon gescannt oder sie ist nicht die korrekte Folgestation.";
|
||||
message += "Prüfe ob du das Rätsel korrekt gelöst hast und finde die richtige Station.";
|
||||
}
|
||||
} else if (error.request) {
|
||||
console.log(error.request);
|
||||
header = "Anfrage fehlgeschlagen!";
|
||||
header = "Server nicht erreichbar!";
|
||||
message = "Die Verbindung zum Server ist gestört. Versuchen Sie es später noch einmal.";
|
||||
} else {
|
||||
console.log(error);
|
||||
@ -114,6 +124,8 @@
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: message, title: header, });
|
||||
resolve(false);
|
||||
});
|
||||
window.setTimeout(() => {
|
||||
}, 2000)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
to="/qr-scanner"
|
||||
>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="camera"/>
|
||||
<q-icon name="filter_center_focus"/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label>QR-Code Scanner</q-item-label>
|
||||
|
||||
@ -2,23 +2,15 @@
|
||||
<div>
|
||||
<div class="q-ma-md">
|
||||
<p class="text-h4">{{ cacheName }}</p>
|
||||
<p class="text-h5">{{ end1 + rankingPoints + end2 }}</p>
|
||||
<p class="text-h5">Herzlichen Glückwunsch!</p>
|
||||
<p class="">Du hast alle Stationen gefunden und diesen Cache damit erfolgreich abgeschlossen!</p>
|
||||
<p class="">Dir wurden <b>{{ rankingPoints }} Punkte</b> gutgeschrieben.</p>
|
||||
<p class="text-h5">Deine Belohnung:</p>
|
||||
<p v-html="cache.reward.rewardDescription"></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">Deine Belohnung: </div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-section>
|
||||
<div>{{ cache.reward.rewardDescription }}</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-btn unelevated color="primary" label="Zur Startseite" to="/"/>
|
||||
<q-btn unelevated color="primary" label="Rangliste" to="/ranking/"/>
|
||||
<q-btn unelevated color="primary" label="Startseite" to="/"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -28,21 +20,15 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
reward: false,
|
||||
cacheID: "",
|
||||
cacheName: "",
|
||||
cache: {
|
||||
reward: "",
|
||||
},
|
||||
rankingPoints: "",
|
||||
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?
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData();
|
||||
|
||||
@ -44,13 +44,13 @@
|
||||
</q-item>
|
||||
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
||||
<q-btn @click="startCache(cache.id)" unelevated color="positive" stack icon="arrow_forward"
|
||||
label="Starten" size="sm"/>
|
||||
label="Starten" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="deleteCache(cache.id)" unelevated color="negative" stack
|
||||
icon="delete" label="Löschen" size="sm"/>
|
||||
icon="delete" label="Löschen" size="xs"/>
|
||||
<q-btn disable v-if="hasAdminState" @click="editCache(cache.id)" unelevated color="primary" stack
|
||||
icon="edit" label="Bearbeiten" size="sm"/>
|
||||
icon="edit" label="Bearbeiten" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="generateQrCodes(cache.id)" unelevated color="primary" stack
|
||||
icon="image" label="QR-Codes" size="sm"/>
|
||||
icon="image" label="QR-Codes" size="xs"/>
|
||||
</q-item>
|
||||
</q-expansion-item>
|
||||
</q-card>
|
||||
|
||||
@ -100,17 +100,17 @@
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.my-custom th {
|
||||
color: #027BE3 !important;
|
||||
}
|
||||
/*.my-custom th {*/
|
||||
/* color: #027BE3 !important;*/
|
||||
/*}*/
|
||||
|
||||
.my-custom tr {
|
||||
color: #027BE3 !important;
|
||||
}
|
||||
/*.my-custom tr {*/
|
||||
/* color: #027BE3 !important;*/
|
||||
/*}*/
|
||||
|
||||
.my-custom td {
|
||||
color: #027BE3 !important;
|
||||
}
|
||||
/*.my-custom td {*/
|
||||
/* color: #027BE3 !important;*/
|
||||
/*}*/
|
||||
</style>
|
||||
<script>
|
||||
//import {dom} from 'quasar'
|
||||
@ -123,7 +123,6 @@
|
||||
inviteMail: "",
|
||||
currentTeamStatus: "Dienstag 15:00 Treffen zum Blumencache",
|
||||
teamStatus: "",
|
||||
userName: null,
|
||||
email: null,
|
||||
userRanking: null,
|
||||
teamName: null,
|
||||
@ -146,23 +145,19 @@
|
||||
],
|
||||
data: [
|
||||
{
|
||||
name: 'Mein Nutzername',
|
||||
userData: this.userName,
|
||||
},
|
||||
{
|
||||
name: 'Meine Email',
|
||||
name: 'E-Mail',
|
||||
userData: this.email,
|
||||
},
|
||||
{
|
||||
name: 'Meine Ranglistenposition',
|
||||
name: 'Rang',
|
||||
userData: this.userRanking,
|
||||
},
|
||||
{
|
||||
name: 'Mein Team',
|
||||
name: 'Team',
|
||||
userData: this.teamName,
|
||||
},
|
||||
{
|
||||
name: 'Teamranglistenposition',
|
||||
name: 'Team-Rang',
|
||||
userData: this.teamRanking,
|
||||
},
|
||||
],
|
||||
@ -229,17 +224,15 @@
|
||||
created: function () {
|
||||
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.data[0].userData = this.email;
|
||||
this.userRanking = "1234";
|
||||
this.data[2].userData = this.userRanking;
|
||||
this.data[1].userData = this.userRanking;
|
||||
this.teamName = "BuGa19Community";
|
||||
this.data[3].userData = this.teamName;
|
||||
this.data[2].userData = this.teamName;
|
||||
this.dropDownSelectedItem = this.teamName;
|
||||
this.teamRanking = "2019";
|
||||
this.data[4].userData = this.teamRanking;
|
||||
this.data[3].userData = this.teamRanking;
|
||||
},
|
||||
methods: {
|
||||
validateEmail(email) {
|
||||
|
||||
@ -1,6 +1,12 @@
|
||||
<template>
|
||||
<div>
|
||||
<qrscanner />
|
||||
<div v-if="!cameraActive" class="q-ma-md">
|
||||
<p class="text-h4">QR-Scanner</p>
|
||||
<p class="">Mit diesem Scanner kannst du die nächste Station deines Caches einscannen
|
||||
oder einen neuen Cache beginnen indem du eine der Startstationen einscannst.
|
||||
Du findest die Startstationen über die Karte.</p>
|
||||
</div>
|
||||
<qrscanner @camera="cameraState($event)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -11,11 +17,14 @@
|
||||
components: {qrscanner},
|
||||
data() {
|
||||
return {
|
||||
cameraActive: false,
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
cameraState(event) {
|
||||
this.cameraActive = event;
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user