improved cache overview
This commit is contained in:
Timo Volkmann
parent
235f3fd0b5
commit
f110c81ba3
@ -245,7 +245,7 @@
|
||||
},
|
||||
evalAuthentication: function () {
|
||||
this.$store.commit('auth/SET_AUTHENTICATED');
|
||||
// this.$store.commit('auth/SET_USER');
|
||||
this.$store.commit('auth/SET_USER');
|
||||
},
|
||||
logout: function () {
|
||||
console.log("logout()");
|
||||
|
||||
@ -9,8 +9,8 @@
|
||||
<p v-html="cache.reward.rewardDescription"></p>
|
||||
|
||||
<div class="column q-gutter-y-md">
|
||||
<q-btn unelevated color="primary" label="Rangliste" to="/ranking/"/>
|
||||
<q-btn unelevated color="primary" label="Startseite" to="/"/>
|
||||
<q-btn unelevated color="primary" label="Rangliste" to="/ranking"/>
|
||||
<q-btn unelevated color="primary" label="Zur Übersicht" to="/overview"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -21,13 +21,19 @@
|
||||
<q-tab-panels v-model="tab" animated swipeable class="col">
|
||||
|
||||
<q-tab-panel name="list" class=" fit">
|
||||
|
||||
<q-list>
|
||||
<q-spinner-oval
|
||||
v-if="!render"
|
||||
class="absolute-center"
|
||||
color="primary"
|
||||
size="10em"
|
||||
/>
|
||||
<q-list v-if="render">
|
||||
<q-card class="q-mb-md" v-for="cache in caches" :key="cache.id">
|
||||
<q-expansion-item
|
||||
class=""
|
||||
expand-separator
|
||||
icon="location_on"
|
||||
:header-class="'text-'+(getColorClass(cache) === 'primary' ? 'black' : getColorClass(cache))"
|
||||
:label="cache.name"
|
||||
:caption="cache.rankingPoints+' Punkte, '+cache.stationen.length+' Stationen'"
|
||||
>
|
||||
@ -43,22 +49,29 @@
|
||||
</q-item-section>
|
||||
</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"
|
||||
<q-btn v-if="(getCacheAccesDefinition(cache) === -1)" @click="startCache(cache.id)" unelevated
|
||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
||||
label="Starten" size="xs"/>
|
||||
<q-btn v-if="(getCacheAccesDefinition(cache) === 0)" @click="continueCache(cache.id)" unelevated
|
||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
||||
label="Fortsetzen" size="xs"/>
|
||||
<q-btn v-if="(getCacheAccesDefinition(cache) === 1)" @click="goToReward(cache.id)" unelevated
|
||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
||||
label="Belohnung" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="confirmDelete(cache.id)" unelevated color="negative" stack
|
||||
icon="delete" label="Löschen" size="xs"/>
|
||||
icon="delete" size="xs"/>
|
||||
<q-btn disable v-if="hasAdminState" @click="editCache(cache.id)" unelevated color="primary" stack
|
||||
icon="edit" label="Bearbeiten" size="xs"/>
|
||||
icon="edit" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="generateQrCodes(cache.id)" unelevated color="primary" stack
|
||||
icon="image" label="QR-Codes" size="xs"/>
|
||||
icon="image" label="QRCodes" size="xs"/>
|
||||
</q-item>
|
||||
</q-expansion-item>
|
||||
</q-card>
|
||||
</q-list>
|
||||
<div v-if="hasAdminState" class="row">
|
||||
<q-btn @click="addCache" unelevated color="primary" stack icon="add" label="Neuer Cache"
|
||||
class="full-width"/>
|
||||
</div>
|
||||
</q-list>
|
||||
</q-tab-panel>
|
||||
|
||||
|
||||
@ -94,64 +107,114 @@
|
||||
tab: 'list',
|
||||
caches: [],
|
||||
stations: [],
|
||||
pois: []
|
||||
pois: [],
|
||||
render: false
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
},
|
||||
computed: {
|
||||
// ...mapGetters([
|
||||
// 'auth/GET_ADMINSTATE'
|
||||
// ]),
|
||||
|
||||
hasAdminState() {
|
||||
return this.$store.getters['auth/GET_ADMINSTATE'];
|
||||
}
|
||||
},
|
||||
created: function () {
|
||||
beforeMount() {
|
||||
},
|
||||
|
||||
async created() {
|
||||
console.log("created(): " + this.caches);
|
||||
this.fetchAllCaches();
|
||||
this.$store.commit('auth/SET_AUTHENTICATED');
|
||||
this.$store.commit('auth/SET_USER');
|
||||
// this.$store.commit('auth/SET_AUTHENTICATED');
|
||||
// this.$store.commit('auth/SET_USER');
|
||||
await this.fetchAllCaches();
|
||||
this.render = await this.fetchMyCaches();
|
||||
},
|
||||
methods: {
|
||||
fetchAllCaches() {
|
||||
this.$axios.get('/api/allCaches')
|
||||
.then((response) => {
|
||||
this.caches = response.data;
|
||||
for(let cache in this.caches) {
|
||||
getColorClass(cache) {
|
||||
switch (this.getCacheAccesDefinition(cache)) {
|
||||
case -1:
|
||||
return "primary"
|
||||
case 0:
|
||||
return "amber"
|
||||
case 1:
|
||||
return "green"
|
||||
}
|
||||
},
|
||||
getCacheAccesDefinition(cache) {
|
||||
// console.log("getCacheAccessDefinition")
|
||||
// console.log(cache.hasOwnProperty('cacheAccesDefinition') ? cache.cacheAccesDefinition : -1)
|
||||
// can be -1 = no accessdefinition, 0 = started or 1 = finished
|
||||
return cache.hasOwnProperty('cacheAccesDefinition') ? cache.cacheAccesDefinition : -1;
|
||||
},
|
||||
|
||||
this.stations[cache]=(this.caches[cache].stationen[0]);
|
||||
const poiItem = {
|
||||
Name: this.caches[cache].name,
|
||||
CategoryID: 3,
|
||||
Latitude: this.stations[cache].lattitude,
|
||||
Longitude: this.stations[cache].longitude
|
||||
};
|
||||
this.pois.push(poiItem);
|
||||
fetchAllCaches() {
|
||||
return new Promise(resolve => {
|
||||
this.$axios.get('/api/allCaches')
|
||||
.then((response) => {
|
||||
this.caches = response.data;
|
||||
//this.fetchMyCaches();
|
||||
for (let cache in this.caches) {
|
||||
|
||||
this.stations[cache] = (this.caches[cache].stationen[0]);
|
||||
const poiItem = {
|
||||
Name: this.caches[cache].name,
|
||||
CategoryID: 3,
|
||||
Latitude: this.stations[cache].lattitude,
|
||||
Longitude: this.stations[cache].longitude
|
||||
};
|
||||
this.pois.push(poiItem);
|
||||
}
|
||||
this.initMap();
|
||||
resolve(true);
|
||||
}).catch((error) => {
|
||||
let message;
|
||||
let header = "Fehler: ";
|
||||
if (error.response) {
|
||||
console.log("ERROR RESPONSE");
|
||||
// The request was made and the server responded with a status code
|
||||
// that falls out of the range of 2xx
|
||||
message = error.response.data.error;
|
||||
header += error.response.status;
|
||||
} else if (error.request) {
|
||||
// The request was made but no response was received
|
||||
// `error.request` is an instance of XMLHttpRequest in the browser and an instance of
|
||||
// http.ClientRequest in node.js
|
||||
message = "Anfrage fehlgeschlagen.";
|
||||
} else {
|
||||
// Something happened in setting up the request that triggered an Error
|
||||
console.log('Error', error.message);
|
||||
message = error.message;
|
||||
}
|
||||
this.initMap();
|
||||
}).catch((error) => {
|
||||
let message;
|
||||
let header = "Fehler: ";
|
||||
if (error.response) {
|
||||
console.log("ERROR RESPONSE");
|
||||
// The request was made and the server responded with a status code
|
||||
// that falls out of the range of 2xx
|
||||
message = error.response.data.error;
|
||||
header += error.response.status;
|
||||
} else if (error.request) {
|
||||
// The request was made but no response was received
|
||||
// `error.request` is an instance of XMLHttpRequest in the browser and an instance of
|
||||
// http.ClientRequest in node.js
|
||||
message = "Anfrage fehlgeschlagen.";
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: message, title: header,});
|
||||
resolve(true);
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
fetchMyCaches() {
|
||||
return new Promise(resolve => {
|
||||
console.log("fetchMyCaches...");
|
||||
if (this.$store.state.auth.isAuthenticated && localStorage.getItem('userToken')) {
|
||||
const token = JSON.parse(localStorage.getItem('userToken')).token;
|
||||
this.$axios.get('/api/getMyCaches', {params: {token}})
|
||||
.then((response) => {
|
||||
console.log("process data...")
|
||||
console.log(response.data)
|
||||
for (let item of response.data) {
|
||||
this.caches.forEach(cache => {
|
||||
if (cache.id === item.cache.id) {
|
||||
cache.cacheAccesDefinition = item.cacheAccesDefinition.id;
|
||||
console.log("found accessdefinition: id: " + cache.id + " ad: " + cache.cacheAccesDefinition);
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
console.log(this.caches);
|
||||
console.log("data processed.")
|
||||
}).finally(() => resolve(true))
|
||||
} else {
|
||||
// Something happened in setting up the request that triggered an Error
|
||||
console.log('Error', error.message);
|
||||
message = error.message;
|
||||
resolve(true);
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: message, title: header, });
|
||||
})
|
||||
},
|
||||
|
||||
@ -175,17 +238,17 @@
|
||||
},
|
||||
editCache() {
|
||||
},
|
||||
initMap(){
|
||||
initMap() {
|
||||
console.log("Signalwort: " + this.pois);
|
||||
// this.$axios.post('http://seserver.se.hs-heilbronn.de:3000/api/map', {
|
||||
// body: this.pois
|
||||
// }).then((response)=>{
|
||||
// console.log(response)
|
||||
// })
|
||||
// },
|
||||
// this.$axios.post('http://seserver.se.hs-heilbronn.de:3000/api/map', {
|
||||
// body: this.pois
|
||||
// }).then((response)=>{
|
||||
// console.log(response)
|
||||
// })
|
||||
// },
|
||||
this.$axios.get('http://www.se.hs-heilbronn.de:3000/api/map/lon=9&lat=49', {
|
||||
body: this.pois
|
||||
}).then((response)=>{
|
||||
}).then((response) => {
|
||||
console.log(response)
|
||||
})
|
||||
},
|
||||
@ -214,7 +277,7 @@
|
||||
message = error.message;
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: message, title: header, });
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: message, title: header,});
|
||||
})
|
||||
},
|
||||
startCache(cacheID) {
|
||||
@ -224,6 +287,41 @@
|
||||
this.$store.state.currentCache.currentCacheID = Number(cacheID);
|
||||
this.$router.push({path: `/CacheStart/${cacheID}`})
|
||||
},
|
||||
continueCache(cacheID) {
|
||||
console.log("cacheID");
|
||||
console.log(cacheID);
|
||||
let currentStationID;
|
||||
if (localStorage.getItem('userToken')) {
|
||||
let params = {cacheID: cacheID};
|
||||
params.token = JSON.parse(localStorage.getItem('userToken')).token;
|
||||
this.$axios.get('/api/getCurrentStation', {params})
|
||||
.then((response) => {
|
||||
console.log(response.data);
|
||||
currentStationID = response.data.aktuelleStation.id;
|
||||
this.$router.push({path: `/station/${cacheID}/${currentStationID}`});
|
||||
})
|
||||
.catch((error) => {
|
||||
});
|
||||
}
|
||||
},
|
||||
goToReward(cacheID) {
|
||||
console.log("cacheID");
|
||||
console.log(cacheID);
|
||||
let currentStationID;
|
||||
if (localStorage.getItem('userToken')) {
|
||||
let params = {cacheID: cacheID};
|
||||
params.token = JSON.parse(localStorage.getItem('userToken')).token;
|
||||
this.$axios.get('/api/getCurrentStation', {params})
|
||||
.then((response) => {
|
||||
console.log(response.data);
|
||||
currentStationID = response.data.aktuelleStation.id;
|
||||
this.$router.push({path: `/CacheEnd/${params.cacheID}`});
|
||||
})
|
||||
.catch((error) => {
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
generateQrCodes(cacheID) {
|
||||
this.$router.push({path: `/generator/${cacheID}`})
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user