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"
|
:key="startedCache.id"
|
||||||
>
|
>
|
||||||
<q-expansion-item
|
<q-expansion-item
|
||||||
|
group="started"
|
||||||
class=""
|
class=""
|
||||||
expand-separator
|
expand-separator
|
||||||
icon="location_on"
|
icon="location_on"
|
||||||
@ -46,9 +47,31 @@
|
|||||||
|
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item class="q-pr-sm reverse">
|
<q-item class="q-pr-sm reverse">
|
||||||
<q-btn @click="continueCache(startedCache.cache.id)" unelevated color="positive" stack
|
<!-- <q-btn @click="continueCache(startedCache.cache.id)" unelevated color="positive"-->
|
||||||
icon="arrow_forward"
|
<!-- icon="arrow_forward"-->
|
||||||
label="Fortfahren" size="sm"/>
|
<!-- 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-item>
|
||||||
</q-expansion-item>
|
</q-expansion-item>
|
||||||
</q-card>
|
</q-card>
|
||||||
@ -62,6 +85,7 @@
|
|||||||
v-for="finishedCache in startedCaches.filter(cache => cache.cacheAccesDefinition.id === 1)"
|
v-for="finishedCache in startedCaches.filter(cache => cache.cacheAccesDefinition.id === 1)"
|
||||||
:key="finishedCache.id">
|
:key="finishedCache.id">
|
||||||
<q-expansion-item
|
<q-expansion-item
|
||||||
|
group="finished"
|
||||||
class=""
|
class=""
|
||||||
expand-separator
|
expand-separator
|
||||||
icon="location_on"
|
icon="location_on"
|
||||||
@ -82,9 +106,30 @@
|
|||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
<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"
|
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-item>
|
||||||
</q-expansion-item>
|
</q-expansion-item>
|
||||||
</q-card>
|
</q-card>
|
||||||
@ -121,6 +166,51 @@
|
|||||||
this.fetchUserCaches();
|
this.fetchUserCaches();
|
||||||
},
|
},
|
||||||
methods: {
|
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() {
|
calculateProgress() {
|
||||||
console.log("calcProgress...")
|
console.log("calcProgress...")
|
||||||
console.log("this.startedCaches: ")
|
console.log("this.startedCaches: ")
|
||||||
|
|||||||
@ -18,7 +18,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col flex column">
|
<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-tab-panel name="list" class=" fit">
|
||||||
<q-spinner-oval
|
<q-spinner-oval
|
||||||
@ -31,6 +31,7 @@
|
|||||||
<q-list v-if="render">
|
<q-list v-if="render">
|
||||||
<q-card class="q-mb-md" v-for="cache in caches" :key="cache.id">
|
<q-card class="q-mb-md" v-for="cache in caches" :key="cache.id">
|
||||||
<q-expansion-item
|
<q-expansion-item
|
||||||
|
group="cachegroup"
|
||||||
class=""
|
class=""
|
||||||
expand-separator
|
expand-separator
|
||||||
icon="location_on"
|
icon="location_on"
|
||||||
@ -50,21 +51,51 @@
|
|||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
<q-item class="q-pr-sm reverse q-gutter-x-sm">
|
||||||
<q-btn v-if="(getCacheAccesDefinition(cache) === -1)" @click="startCache(cache.id)" unelevated
|
<q-btn-dropdown
|
||||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
v-if="hasAdminState"
|
||||||
label="Starten" size="xs"/>
|
@click="openCache(cache)"
|
||||||
<q-btn v-if="(getCacheAccesDefinition(cache) === 0)" @click="continueCache(cache.id)" unelevated
|
:color="getColorClass(cache)"
|
||||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
:label="getOpenCacheLabel(cache)"
|
||||||
label="Fortsetzen" size="xs"/>
|
unelevated
|
||||||
<q-btn v-if="(getCacheAccesDefinition(cache) === 1)" @click="goToReward(cache.id)" unelevated
|
icon="arrow_forward"
|
||||||
:color="getColorClass(cache)" stack icon="arrow_forward"
|
split
|
||||||
label="Belohnung" size="xs"/>
|
>
|
||||||
<q-btn v-if="hasAdminState" @click="confirmDelete(cache.id)" unelevated color="negative" stack
|
<q-list>
|
||||||
icon="delete" size="xs"/>
|
|
||||||
<q-btn v-if="hasAdminState" @click="editCache(cache.id)" unelevated color="primary" stack
|
<q-item clickable v-close-popup class="text-grey-14" @click="generateQrCodes(cache.id)" >
|
||||||
icon="edit" size="xs"/>
|
<q-item-section>
|
||||||
<q-btn v-if="hasAdminState" @click="generateQrCodes(cache.id)" unelevated color="primary" stack
|
QR-Codes
|
||||||
icon="image" label="QRCodes" size="xs"/>
|
</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-item>
|
||||||
</q-expansion-item>
|
</q-expansion-item>
|
||||||
</q-card>
|
</q-card>
|
||||||
@ -172,6 +203,29 @@ Vue.use(VueLayers);
|
|||||||
return "green"
|
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) {
|
getCacheAccesDefinition(cache) {
|
||||||
// console.log("getCacheAccessDefinition")
|
// console.log("getCacheAccessDefinition")
|
||||||
// console.log(cache.hasOwnProperty('cacheAccesDefinition') ? cache.cacheAccesDefinition : -1)
|
// console.log(cache.hasOwnProperty('cacheAccesDefinition') ? cache.cacheAccesDefinition : -1)
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user