reworked cache creation

This commit is contained in:
Timo Volkmann 2019-04-30 02:00:38 +02:00
parent 2536996b16
commit 865d48cd63
9 changed files with 108 additions and 92 deletions

View File

@ -101,6 +101,7 @@
</q-item-section>
</q-item>
<q-item
v-if="!this.$store.state.auth.isAuthenticated"
clickable
class="text-primary"
v-ripple

View File

@ -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>

View File

@ -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);

View File

@ -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) {

View File

@ -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: "",

View File

@ -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;
};

View File

@ -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);

View File

@ -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: "",
},
}

View File

@ -20,7 +20,7 @@ public class Cache {
@OneToMany
private List<Station> stationen = new ArrayList<>();
@ManyToOne
@ManyToOne (cascade = {CascadeType.ALL})
private Reward reward;
public Cache() {