added resetCache functionality and changed button style in cache items
This commit is contained in:
Timo Volkmann
parent
c3c605d298
commit
5ebfb75f45
20
aaa.html
20
aaa.html
@ -1,20 +0,0 @@
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>BuGa Lageplan</title>
|
||||
<script src="/config.js"></script>
|
||||
<!--get local copy of openlayers javascript file-->
|
||||
<script src="/scripts/ol.js"></script>
|
||||
<!--get openlayers support javascript file-->
|
||||
<script src="/scripts/mapScript.js"></script>
|
||||
<link rel="stylesheet" href="/stylesheets/map.css">
|
||||
<link rel="stylesheet" href="/stylesheets/style.css">
|
||||
|
||||
</head>
|
||||
<body class="fullscreen">
|
||||
<div id="map" class="map fullscreen"></div>
|
||||
<script type="text/javascript">
|
||||
const map = createMapFromPoiSet([{"Name":"Wolfszipfel_Station1","Latitude":49.14709,"Longitude":9.208993,"CategoryID":0},{"Name":"Live Demo Cache_Station1","Latitude":49,"Longitude":9,"CategoryID":0},{"Name":"GeoCaching für alle_Station1","Latitude":49,"Longitude":9,"CategoryID":0},{"Name":"Test Cache_Station1","Latitude":49.1,"Longitude":9.207,"CategoryID":0},{"Name":"GeoCaching für alle_Station2","Latitude":49,"Longitude":9,"CategoryID":1},{"Name":"GeoCaching für alle_Station3","Latitude":49,"Longitude":9,"CategoryID":1},{"Name":"GeoCaching für alle_Station4","Latitude":49,"Longitude":9,"CategoryID":1},{"Name":"GeoCaching für alle_Station5","Latitude":49,"Longitude":9,"CategoryID":1}]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -29,6 +29,7 @@
|
||||
:key="startedCache.id"
|
||||
>
|
||||
<q-expansion-item
|
||||
group="started"
|
||||
class=""
|
||||
expand-separator
|
||||
icon="location_on"
|
||||
@ -46,9 +47,31 @@
|
||||
|
||||
</q-item>
|
||||
<q-item class="q-pr-sm reverse">
|
||||
<q-btn @click="continueCache(startedCache.cache.id)" unelevated color="positive" stack
|
||||
icon="arrow_forward"
|
||||
label="Fortfahren" size="sm"/>
|
||||
<!-- <q-btn @click="continueCache(startedCache.cache.id)" unelevated color="positive"-->
|
||||
<!-- icon="arrow_forward"-->
|
||||
<!-- label="Fortfahren" size=""/>-->
|
||||
<q-btn-dropdown
|
||||
@click="continueCache(startedCache.cache.id)"
|
||||
label="Fortfahren"
|
||||
color="amber"
|
||||
unelevated
|
||||
icon="arrow_forward"
|
||||
split
|
||||
>
|
||||
<q-list>
|
||||
|
||||
<q-item clickable v-close-popup class="text-grey-14" @click="confirmReset(startedCache.cache.id)" >
|
||||
<q-item-section>
|
||||
Cache zurücksetzen
|
||||
</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="delete"/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-btn-dropdown>
|
||||
|
||||
|
||||
</q-item>
|
||||
</q-expansion-item>
|
||||
</q-card>
|
||||
@ -62,6 +85,7 @@
|
||||
v-for="finishedCache in startedCaches.filter(cache => cache.cacheAccesDefinition.id === 1)"
|
||||
:key="finishedCache.id">
|
||||
<q-expansion-item
|
||||
group="finished"
|
||||
class=""
|
||||
expand-separator
|
||||
icon="location_on"
|
||||
@ -82,9 +106,30 @@
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
||||
<q-btn @click="goToReward(finishedCache.cache.id)" unelevated color="primary" stack
|
||||
<q-btn @click="goToReward(finishedCache.cache.id)" unelevated color="primary"
|
||||
icon="arrow_forward"
|
||||
label="Belohnung ansehen" size="sm"/>
|
||||
label="Belohnung ansehen" size=""/>
|
||||
<q-btn-dropdown
|
||||
@click="goToReward(finishedCache.cache.id)"
|
||||
label="Belohnung"
|
||||
color="primary"
|
||||
unelevated
|
||||
icon="arrow_forward"
|
||||
split
|
||||
>
|
||||
<q-list>
|
||||
|
||||
<q-item clickable v-close-popup class="text-grey-14" @click="confirmReset(startedCache.cache.id)" >
|
||||
<q-item-section>
|
||||
Cache zurücksetzen
|
||||
</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="delete"/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-btn-dropdown>
|
||||
|
||||
</q-item>
|
||||
</q-expansion-item>
|
||||
</q-card>
|
||||
@ -121,6 +166,51 @@
|
||||
this.fetchUserCaches();
|
||||
},
|
||||
methods: {
|
||||
confirmReset(cacheID) {
|
||||
console.log("confirmReset")
|
||||
console.log("CacheID: "+cacheID)
|
||||
this.$q.dialog({
|
||||
title: 'Zurücksetzen...',
|
||||
message: 'Möchtest du deinen Fortschritt bei diesem Cache wirklich zurücksetzen? ' +
|
||||
'Bereits erworbene Punkte werden dir wieder abgezogen. ' +
|
||||
'Du kannst den Cache danach wieder von vorne beginnen.',
|
||||
persistent: true,
|
||||
cancel: true,
|
||||
}).onOk(() => {
|
||||
console.log('>>>> OK');
|
||||
this.resetCache(cacheID)
|
||||
}).onCancel(() => {
|
||||
console.log('>>>> Cancel')
|
||||
}).onDismiss(() => {
|
||||
})
|
||||
},
|
||||
resetCache(cacheID) {
|
||||
console.log('reset cache: ' + cacheID);
|
||||
const token = JSON.parse(localStorage.getItem('userToken')).token;
|
||||
this.$axios.delete('/api/deleteCacheForUser', {params: {cacheID: cacheID , token: token}})
|
||||
.then((response) => {
|
||||
this.fetchUserCaches();
|
||||
}).catch((error) => {
|
||||
let msg;
|
||||
let title;
|
||||
if (error.response) {
|
||||
title = "Fehler!";
|
||||
msg = error.response.data;
|
||||
} else if (error.request) {
|
||||
title = "Verbindungsfehler!";
|
||||
msg = "Es konnte keine Verbindung zum Server aufgebaut werden. Versuchen Sie es später noch einmal!"
|
||||
console.log(error.request);
|
||||
} else {
|
||||
title = "Error";
|
||||
msg = error.message;
|
||||
console.log('Error', error.message);
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: msg, title: title,});
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
calculateProgress() {
|
||||
console.log("calcProgress...")
|
||||
console.log("this.startedCaches: ")
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
</div>
|
||||
|
||||
<div class="col flex column">
|
||||
<q-tab-panels v-model="tab" animated swipeable class="col">
|
||||
<q-tab-panels v-model="tab" animated class="col">
|
||||
|
||||
<q-tab-panel name="list" class=" fit">
|
||||
<q-spinner-oval
|
||||
@ -31,6 +31,7 @@
|
||||
<q-list v-if="render">
|
||||
<q-card class="q-mb-md" v-for="cache in caches" :key="cache.id">
|
||||
<q-expansion-item
|
||||
group="cachegroup"
|
||||
class=""
|
||||
expand-separator
|
||||
icon="location_on"
|
||||
@ -50,21 +51,51 @@
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
||||
<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" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="editCache(cache.id)" unelevated color="primary" stack
|
||||
icon="edit" size="xs"/>
|
||||
<q-btn v-if="hasAdminState" @click="generateQrCodes(cache.id)" unelevated color="primary" stack
|
||||
icon="image" label="QRCodes" size="xs"/>
|
||||
<q-btn-dropdown
|
||||
v-if="hasAdminState"
|
||||
@click="openCache(cache)"
|
||||
:color="getColorClass(cache)"
|
||||
:label="getOpenCacheLabel(cache)"
|
||||
unelevated
|
||||
icon="arrow_forward"
|
||||
split
|
||||
>
|
||||
<q-list>
|
||||
|
||||
<q-item clickable v-close-popup class="text-grey-14" @click="generateQrCodes(cache.id)" >
|
||||
<q-item-section>
|
||||
QR-Codes
|
||||
</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="image"/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item clickable v-close-popup class="text-grey-14" @click="editCache(cache.id)" >
|
||||
<q-item-section>
|
||||
Bearbeiten
|
||||
</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="edit"/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item clickable v-close-popup class="text-grey-14" @click="confirmDelete(cache.id)" >
|
||||
<q-item-section>
|
||||
Löschen
|
||||
</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="delete"/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
</q-list>
|
||||
</q-btn-dropdown>
|
||||
<div v-if="!hasAdminState">
|
||||
<q-btn @click="startCache(cache.id)" unelevated
|
||||
:color="getColorClass(cache)" icon="arrow_forward"
|
||||
label="Starten" size="" />
|
||||
</div>
|
||||
</q-item>
|
||||
</q-expansion-item>
|
||||
</q-card>
|
||||
@ -172,6 +203,29 @@ Vue.use(VueLayers);
|
||||
return "green"
|
||||
}
|
||||
},
|
||||
getOpenCacheLabel(cache) {
|
||||
switch (this.getCacheAccesDefinition(cache)) {
|
||||
case -1:
|
||||
return "Starten"
|
||||
case 0:
|
||||
return "Fortsetzen"
|
||||
case 1:
|
||||
return "Belohnung"
|
||||
}
|
||||
},
|
||||
openCache(cache) {
|
||||
switch (this.getCacheAccesDefinition(cache)) {
|
||||
case -1:
|
||||
|
||||
return this.startCache(cache.id);
|
||||
case 0:
|
||||
|
||||
return this.continueCache(cache.id);
|
||||
case 1:
|
||||
|
||||
return this.goToReward(cache.id);
|
||||
}
|
||||
},
|
||||
getCacheAccesDefinition(cache) {
|
||||
// console.log("getCacheAccessDefinition")
|
||||
// console.log(cache.hasOwnProperty('cacheAccesDefinition') ? cache.cacheAccesDefinition : -1)
|
||||
|
||||
Loading…
Reference in New Issue
Block a user