reworked cache creation
This commit is contained in:
parent
2536996b16
commit
865d48cd63
@ -101,6 +101,7 @@
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
v-if="!this.$store.state.auth.isAuthenticated"
|
||||
clickable
|
||||
class="text-primary"
|
||||
v-ripple
|
||||
|
||||
@ -5,9 +5,8 @@
|
||||
<form>
|
||||
<div class="q-pa-md q-gutter-y-md">
|
||||
<p class="text-h5">{{ isNewCache ? "Neuen Cache erstellen" : "Cache bearbeiten"}}</p>
|
||||
<q-input class="col" dense stack-label filled v-model="tempCache.name" label="Name" @change="cacheToStore"/>
|
||||
<q-input class="col" dense stack-label filled v-model="tempCache.rankingPoints" label="Punktewert"
|
||||
@change="cacheToStore"/>
|
||||
<q-input class="col" dense stack-label filled v-model="computedCache.name" label="Name"/>
|
||||
<q-input class="col" dense stack-label filled v-model="computedCache.rankingPoints" label="Punktewert"/>
|
||||
<p class="text-h6">Beschreibung</p>
|
||||
<q-editor
|
||||
:toolbar="[
|
||||
@ -16,10 +15,9 @@
|
||||
['hr', 'link'],
|
||||
['fullscreen'],
|
||||
]"
|
||||
v-model="tempCache.description"
|
||||
v-model="computedCache.description"
|
||||
min-height="5rem"
|
||||
max-height="50vh"
|
||||
@change="cacheToStore"
|
||||
/>
|
||||
<p class="text-h6">Belohnung</p>
|
||||
<q-editor
|
||||
@ -29,15 +27,14 @@
|
||||
['hr', 'link'],
|
||||
['fullscreen'],
|
||||
]"
|
||||
v-model="tempCache.reward"
|
||||
v-model="computedCache.reward.rewardDescription"
|
||||
min-height="5rem"
|
||||
max-height="50vh"
|
||||
@change="cacheToStore"
|
||||
/>
|
||||
<p class="text-h6">Stationen</p>
|
||||
<q-list bordered separator class="rounded-borders">
|
||||
|
||||
<q-item v-for="(station, index) in cache.stationen" :key="index">
|
||||
<q-item v-for="(station, index) in computedCache.stationen" :key="index">
|
||||
<q-item-section avatar>
|
||||
<q-avatar color="primary" text-color="white">
|
||||
{{ index + 1 }}
|
||||
@ -73,19 +70,19 @@
|
||||
<q-item>
|
||||
<q-item-section avatar>
|
||||
<q-avatar color="primary" text-color="white">
|
||||
{{ tempCache.stationen.length + 1 }}
|
||||
{{ computedCache.stationen.length + 1 }}
|
||||
</q-avatar>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section top>
|
||||
<q-item-label lines="1">
|
||||
<span class="text-grey-8">ID: {{ endStation.id ? endStation.id : "keine" }}</span>
|
||||
<span class="text-grey-8">ID: {{ computedEndstation.id ? computedEndstation.id : "keine" }}</span>
|
||||
</q-item-label>
|
||||
<q-item-label lines="1" class="q-mt-xs text-body2">
|
||||
<span class="cursor-pointer">Endstation</span>
|
||||
</q-item-label>
|
||||
<q-item-label caption lines="1">
|
||||
Koordinaten: {{ endStation.lattitude }}, {{ endStation.longitude }}
|
||||
Koordinaten: {{ computedEndstation.lattitude }}, {{ computedEndstation.longitude }}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
||||
@ -114,6 +111,8 @@
|
||||
name: "Cache",
|
||||
data() {
|
||||
return {
|
||||
// stations: [],
|
||||
// endStation: {},
|
||||
//endStation: {},
|
||||
scrolldown: false,
|
||||
isNewCache: this.$route.params.id === undefined,
|
||||
@ -128,7 +127,7 @@
|
||||
created: function () {
|
||||
console.log("isNewCache: " + this.isNewCache);
|
||||
console.log("fetch Caches from Store");
|
||||
this.tempCache = JSON.parse(JSON.stringify(this.cache));
|
||||
//this.tempCache = JSON.parse(JSON.stringify(this.cache));
|
||||
},
|
||||
beforeMount: function () {
|
||||
},
|
||||
@ -159,20 +158,32 @@
|
||||
}
|
||||
|
||||
},
|
||||
cacheToStore() {
|
||||
// push tempCache to Store
|
||||
console.log("set Cache");
|
||||
this.$store.commit('cacheCollector/SET_CACHE', JSON.parse(JSON.stringify(this.tempCache)));
|
||||
// this.SET_CACHE(JSON.parse(JSON.stringify(this.tempCache)));
|
||||
},
|
||||
// getStations() {
|
||||
// console.log("get Stations");
|
||||
// let stations = this.computedStations.get();
|
||||
// this.stations = stations.filter(station => station.description !== "Endstation");
|
||||
// console.log(this.stations);
|
||||
// this.endStation = stations.filter(station => station.description === "Endstation");
|
||||
// console.log(this.endStation);
|
||||
// },
|
||||
// setStations() {
|
||||
// let stations = this.stations;
|
||||
// stations.push(this.endStation);
|
||||
// this.computedStations.set(stations);
|
||||
// },
|
||||
// cacheToStore() {
|
||||
// // push tempCache to Store
|
||||
// console.log("set Cache");
|
||||
// this.$store.commit('cacheCollector/SET_CACHE', JSON.parse(JSON.stringify(this.tempCache)));
|
||||
// // this.SET_CACHE(JSON.parse(JSON.stringify(this.tempCache)));
|
||||
// },
|
||||
addStation() {
|
||||
this.$router.push({path: '/station'});
|
||||
//this.swapComponent(station);
|
||||
// create Station and add it to array tempCache.stationen
|
||||
},
|
||||
editStation(index) {
|
||||
console.log("editStation(" + index + ")");
|
||||
const station = this.cache.stationen[index];
|
||||
console.log(this.$store.getters['cacheCollector/GET_STATIONS']);
|
||||
const station = this.$store.getters['cacheCollector/GET_STATIONS'][index];
|
||||
console.log(station);
|
||||
if (station.hasOwnProperty('id')) {
|
||||
//this.$router.push({ path: '/station/'+station.id});
|
||||
@ -189,9 +200,9 @@
|
||||
saveCache() {
|
||||
// commit to store, send to api, if success -> reset store
|
||||
if (this.isNewCache) {
|
||||
console.log(this.cache);
|
||||
let cache = this.cache;
|
||||
cache.stationen.push(this.endStation);
|
||||
let cache = JSON.parse(JSON.stringify(this.computedCache));
|
||||
console.log(cache);
|
||||
cache.stationen.push(this.computedEndstation);
|
||||
|
||||
this.$axios.post('/api/createCache', cache)
|
||||
.then((response) => {
|
||||
@ -227,18 +238,46 @@
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
cache: 'cacheCollector/GET_CACHE',
|
||||
endStation: 'cacheCollector/GET_ENDSTATION'
|
||||
//cache: 'cacheCollector/GET_CACHE',
|
||||
//endStation: 'cacheCollector/GET_ENDSTATION'
|
||||
}),
|
||||
// computedCache: {
|
||||
// computedStations: {
|
||||
// set(value) {
|
||||
// console.log("set cache")
|
||||
// console.log("set stations");
|
||||
// this.computedCache.set(value);
|
||||
// },
|
||||
// get() {
|
||||
// console.log("get cache");
|
||||
// return this.$store.getters.cacheCollector.GET_CACHE
|
||||
// console.log("get stations");
|
||||
// let stations = this.computedCache.stationen;
|
||||
// return stations.filter(station => station.description !== "Endstation");
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
computedCache: {
|
||||
set(value) {
|
||||
console.log("set cache");
|
||||
this.$store.commit('cacheCollector/SET_CACHE', value);
|
||||
},
|
||||
get() {
|
||||
console.log("get cache");
|
||||
return this.$store.getters['cacheCollector/GET_CACHE'];
|
||||
}
|
||||
},
|
||||
computedStations: {
|
||||
set(value) {
|
||||
this.$store.commit('cacheCollector/SET_STATIONS', value);
|
||||
},
|
||||
get() {
|
||||
return this.$store.getters['cacheCollector/GET_STATIONS'];
|
||||
}
|
||||
},
|
||||
computedEndstation: {
|
||||
set(value) {
|
||||
this.$store.commit('cacheCollector/SET_ENDSTATION', value);
|
||||
},
|
||||
get() {
|
||||
return this.$store.getters['cacheCollector/GET_ENDSTATION'];
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -117,7 +117,7 @@
|
||||
// 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 = error.request;
|
||||
message = "Anfrage fehlgeschlagen.";
|
||||
} else {
|
||||
// Something happened in setting up the request that triggered an Error
|
||||
console.log('Error', error.message);
|
||||
|
||||
@ -117,26 +117,26 @@
|
||||
console.log("Caches: " + this.caches);
|
||||
this.caches = response.data;
|
||||
}).catch((error) => {
|
||||
// Error
|
||||
let msg;
|
||||
let title;
|
||||
let message;
|
||||
let header = "Fehler: ";
|
||||
if (error.response) {
|
||||
console.log("ERROR RESPONSE");
|
||||
// The request was made and the server responded with a status code
|
||||
title = "Problem with response!";
|
||||
msg = error.response;
|
||||
// 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
|
||||
title = "Problem with request!";
|
||||
msg = "Error occured due to wrong server request!"
|
||||
console.log(error.request);
|
||||
// `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
|
||||
title = "Error";
|
||||
msg = error.message;
|
||||
console.log('Error', error.message);
|
||||
message = error.message;
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: msg, title: title, });
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: message, title: header, });
|
||||
})
|
||||
},
|
||||
addCache() {
|
||||
@ -150,26 +150,26 @@
|
||||
.then((response) => {
|
||||
this.fetchAllCaches()
|
||||
}).catch((error) => {
|
||||
// Error
|
||||
let msg;
|
||||
let title;
|
||||
let message;
|
||||
let header = "Fehler: ";
|
||||
if (error.response) {
|
||||
console.log("ERROR RESPONSE");
|
||||
// The request was made and the server responded with a status code
|
||||
title = "Problem with response!";
|
||||
msg = error.response;
|
||||
// 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
|
||||
title = "Problem with request!";
|
||||
msg = "Error occured due to wrong server request!"
|
||||
console.log(error.request);
|
||||
// `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
|
||||
title = "Error";
|
||||
msg = error.message;
|
||||
console.log('Error', error.message);
|
||||
message = error.message;
|
||||
}
|
||||
console.log(error.config);
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: msg, title: title, });
|
||||
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: message, title: header, });
|
||||
})
|
||||
},
|
||||
startCache(cacheID) {
|
||||
|
||||
@ -49,7 +49,7 @@
|
||||
description: "Rätsel, Aufgabe und Informationen zur Station.",
|
||||
latlang: "",
|
||||
station: {
|
||||
description: "Beschreibung",
|
||||
description: "Rätsel, Aufgabe und Informationen zur Station.",
|
||||
lattitude: "0.000",
|
||||
longitude: "0.000",
|
||||
solution: "",
|
||||
|
||||
@ -10,3 +10,7 @@ export const GET_ENDSTATION = (state) => {
|
||||
console.log("GET_ENDSTATION: retrieve cache from store. ");
|
||||
return state.endStation;
|
||||
};
|
||||
export const GET_STATIONS = (state) => {
|
||||
console.log("GET_STATIONEN: retrieve cache from store. ");
|
||||
return state.newCache.stationen;
|
||||
};
|
||||
|
||||
@ -10,6 +10,10 @@ export const SET_ENDSTATION = (state, station) => {
|
||||
console.log("SET_ENDSTATION: "+station);
|
||||
state.endStation = station;
|
||||
};
|
||||
export const SET_STATIONS = (state, station) => {
|
||||
console.log("SET_STATIONEN: "+station);
|
||||
state.newCache.stationen = station;
|
||||
};
|
||||
export const ADD_STATION = (state, station) => {
|
||||
console.log("ADD_STATION: add new station to cache: "+station);
|
||||
state.newCache.stationen.push(station);
|
||||
|
||||
@ -3,48 +3,16 @@ export default {
|
||||
name: "",
|
||||
description: "",
|
||||
rankingPoints: 0,
|
||||
reward: "",
|
||||
reward: {
|
||||
rewardDescription: "",
|
||||
},
|
||||
stationen: []
|
||||
},
|
||||
// newCache: {
|
||||
// name: "Blumencache",
|
||||
// description: "Dieser Cache umfasst 4 Stationen mit Rätseln rund um das Thema Blumen",
|
||||
// rankingPoints: 100,
|
||||
// stationen: [
|
||||
// {
|
||||
// description: "Ein kleines winterliches Schlaginstrument. Welche Blume ist damit gemeint?",
|
||||
// longitude: 9.206628,
|
||||
// lattitude: 49.147734,
|
||||
// code: 213812,
|
||||
// solution: "Schneeglöckchen"
|
||||
// },
|
||||
// {
|
||||
// description: "Ein blühendes Federvieh. Welche Blume ist damit gemeint?",
|
||||
// longitude: 9.206806,
|
||||
// lattitude: 49.147318,
|
||||
// code: 237823,
|
||||
// solution: "Gänseblümchen"
|
||||
// },
|
||||
// {
|
||||
// description: "Eine wertvolle Farbe. Welche Blume ist damit gemeint?",
|
||||
// longitude: 9.207844,
|
||||
// lattitude: 49.148032,
|
||||
// code: 899423,
|
||||
// solution: "Edelweiß"
|
||||
// },
|
||||
// {
|
||||
// description: "Ein Zerkleinerungsgerät in der Brüllöffnung eines Raubtieres. Welche Blume ist damit gemeint?",
|
||||
// longitude: 9.207649,
|
||||
// lattitude: 49.150142,
|
||||
// code: 347923,
|
||||
// solution: "Löwenzahn"
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
tempStation: {},
|
||||
endStation: {
|
||||
description: "Endstation",
|
||||
longitude: 9.206628,
|
||||
lattitude: 49.147734,
|
||||
solution: "",
|
||||
},
|
||||
}
|
||||
|
||||
@ -20,7 +20,7 @@ public class Cache {
|
||||
@OneToMany
|
||||
private List<Station> stationen = new ArrayList<>();
|
||||
|
||||
@ManyToOne
|
||||
@ManyToOne (cascade = {CascadeType.ALL})
|
||||
private Reward reward;
|
||||
|
||||
public Cache() {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user