tvolkmann/labswp_2019_sose_geocaching
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bugfixes

Browse Source
This commit is contained in:
Timo Volkmann 2019-05-07 22:57:30 +02:00
parent 14fe441e80
commit 21fc559a4b
6 changed files with 96 additions and 225 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/boot/qr-scanner.js
View File

@ -1,5 +1,5 @@
import VueQrcodeReader from "vue-qrcode-reader";
// import qrscanner from "../components/qr-scanner";
// import qrscanner from "../components/qrscanner";
// "async" is optional
export default async ({ Vue }) => {

87
frontend/src/components/qrscanner.vue
View File

@ -1,11 +1,11 @@
<template>
<div>
<div class="q-ma-md" v-if="askForPermission">
<p>Um den QR-Code scannen zu können, müssen Sie den Zugriff auf Ihre Kamera erlauben.</p>
<q-btn @click="toggleCamera(!activateCamera)" :loading="loading" unelevated color="positive" stack
icon="photo_camera"
label="QR-Code scannen" class="full-width"/>
label="QR-Code scannen" class="full-width q-mt-sm"/>
<p class="q-mt-sm"><b>Hinweis:</b> Um den QR-Code scannen zu können, müssen Sie den Zugriff auf Ihre Kamera erlauben.</p>
</div>
<div v-if="activateCamera">
<qrcode-drop-zone @decode="onDecode" @init="logErrors">
@ -43,11 +43,20 @@
paused: false,
result: null,
params: null,
noStreamApiSupport: false
noStreamApiSupport: false,
cacheID: null,
}
},
created() {
this.setCacheId();
},
methods: {
setCacheId() {
console.log("qr-code: 'cache' from url: " + this.$route.params.cache);
this.cacheID = this.$route.params.cache ? this.$route.params.cache : null;
},
async onDecode(content) {
this.result = content;
@ -55,23 +64,24 @@
this.validating = true;
this.isValid = await this.validate();
this.validating = false;
this.unPauseCamera();
// window.setTimeout(() => {
// this.unPauseCamera();
// }, 2000)
window.setTimeout(() => {
this.validating = false;
this.unPauseCamera();
}, 2000)
//this.unPauseCamera();
},
validate() {
return new Promise(resolve => {
let params = this.setParams();
if (!params.cacheID || !params.stationID || !params.durchgefuehrterCacheID) {
console.log(params);
console.log(params);
if (!params.cacheID || !params.stationID || !params.durchgefuehrterCacheID || !params.token) {
console.log("Parameter konnten nicht erkannt werden.");
resolve(false);
console.log("Parameter konnten nicht erkannt werden.");
resolve(false)
} else {
this.$axios.get('/api/checkStation', {params})
this.$axios.put('/api/checkStation', null, { params })
.then((response) => {
console.log("resolve(true)");
console.log("cache access definition");
@ -84,28 +94,24 @@
}
}).catch((error) => {
console.log("resolve(false)");
// Error
let msg;
let title;
let header = "";
let message = "";
if (error.response) {
// The request was made and the server responded with a status code
title = "Problem with response!";
msg = error.response.data.message
? error.response.data.message
: error.response.data;
console.log(error.response);
header = "Falsche Station!";
message = "Diese Station wurde schon gescannt, ist noch nicht an der Reihe oder gehört nicht zum Cache. ";
message += "Bitte das Rätsel nochmal lesen und die richtige Station scannen.";
} else if (error.request) {
// The request was made but no response was received
title = "Problem with request!";
msg = "Der Server antwortet nicht."
console.log(error.request);
header = "Anfrage fehlgeschlagen!";
message = "Die Verbindung zum Server ist gestört. Versuchen Sie es später noch einmal.";
} else {
// Something happened in setting up the request that triggered an Error
title = "Error";
msg = error.message;
console.log('Error', error.message.data);
console.log(error);
console.log('Error', error.message);
header = "Fehler!";
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, });
resolve(false);
});
}
@ -115,23 +121,25 @@
setParams() {
console.log("setParams: ");
let params = {};
params.cacheID = this.result.split('/')[0];
params.stationID = this.result.split('/')[1];
params.durchgefuehrterCacheID = params.cacheID;
console.log(params.cacheID + " und " + params.stationID);
if (localStorage.getItem('userToken')) {
params.token = JSON.parse(localStorage.getItem('userToken')).token;
}
this.updateProps()
console.log("emitted params!")
params.cacheID = this.result.split('/')[0];
params.stationID = this.result.split('/')[1];
params.durchgefuehrterCacheID = this.CacheID ? this.cacheID : params.cacheID;
console.log(params.cacheID + " und " + params.stationID);
this.updateProps();
return params;
},
updateProps() {
console.log("emit result!")
this.$emit('result', this.params)
},
updateCameraState() {
this.$emit('camera', this.activateCamera)
console.log("Camera State:")
console.log(!this.askForPermission)
this.$emit('camera', !this.askForPermission)
},
pauseCamera() {
@ -146,8 +154,8 @@
this.activateCamera = bool;
if (this.askForPermission === false) {
this.askForPermission = true;
this.updateCameraState();
}
this.updateCameraState();
},
logErrors(promise) {
@ -165,6 +173,8 @@
} finally {
this.loading = false;
this.askForPermission = false;
this.updateCameraState();
}
}
},
@ -178,6 +188,7 @@
this.result = null;
this.params = null;
this.noStreamApiSupport = false;
this.setCacheId();
next()
},
}

6
frontend/src/layouts/MyLayout.vue
View File

@ -234,6 +234,9 @@
},
}
},
created() {
this.evalAuthentication();
},
methods: {
//openURL
dialogClose() {
@ -242,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()");
@ -251,7 +254,6 @@
this.evalAuthentication();
},
}
};
</script>

83
frontend/src/pages/Register.vue
View File

@ -111,39 +111,33 @@
'Authorization': 'Bearer ' + token,
}
})
.then((response) => {
.then((response) => {
console.log(response.data);
if (response.status === 201) {
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {
message: "Deine Registrierung war erfolgreich! Du kannst dich jetzt einloggen.",
message: "Deine Registrierung war erfolgreich!",
title: "Registrierungsprozess",
color: "blue"
});
this.$router.push("/login")
this.autoLogin();
}
})
.catch((error) => {
})
.catch((error) => {
let message;
let header = "Fehler: ";
let header = "Unbekannter 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;
console.log(error.response)
if (error.response.status === 409) {
message= "Die E-Mail-Adresse wird bereits verwendet!";
header= "Anmeldedaten überprüfen!";
}
} 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 = error.request;
} else {
// Something happened in setting up the request that triggered an Error
console.log('Error', error.message);
message = error.message;
console.log(error.request);
header = "Anfrage fehlgeschlagen!";
message = "Die Verbindung zum Server ist gestört. Versuchen Sie es später noch einmal.";
}
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});
});
} else {
if (this.user.email != this.user.checkemail) {
@ -160,40 +154,37 @@
}
},
login() {
console.log("MasterUser()")
const logindata = {
email: "register@bugageocaching.de",
password: "reguser2019"
};
console.log("GET /api/login/ - json: " + JSON.stringify(logindata));
this.$axios.post(process.env.USER_API + '/account/login', logindata)
.then((response) => {
localStorage.setItem('registerToken', JSON.stringify(response.data));
});
},
autoLogin() {
console.log("autoLogin()");
const data = {
email: this.user.email,
password: this.user.password,
};
console.log(data);
this.$axios.post(process.env.USER_API + '/account/login', data)
.then((response) => {
localStorage.setItem('userToken', JSON.stringify(response.data));
localStorage.setItem('userMail', JSON.stringify(data.email));
this.$store.commit('auth/SET_AUTHENTICATED');
this.$store.commit('auth/SET_USER');
this.$router.push({path: `/overview`});
})
.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 = error.request;
} else {
// Something happened in setting up the request that triggered an Error
console.log('Error', error.message);
message = error.message;
}
console.log(error.config);
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: message, title: header,});
this.$router.push("/login");
})
.finally(() => {
});
},
},
};

1
frontend/src/pages/StationView.vue
View File

@ -96,6 +96,7 @@
updateResult(event) {
console.log("updateResult()");
console.log(event);
this.result = event;
},

142
frontend/src/pages/qr-scanner.vue
View File

@ -1,155 +1,21 @@
<template>
<div>
<div class="q-ma-md" v-if="askForPermission">
<p>Um den QR-Code scannen zu können, müssen Sie den Zugriff auf Ihre Kamera erlauben.</p>
<q-btn @click="toggleCamera(!activateCamera)" :loading="loading" unelevated color="positive" stack
icon="photo_camera"
label="QR-Code scannen" class="full-width"/>
</div>
<div v-if="activateCamera">
<qrcode-drop-zone @decode="onDecode" @init="logErrors">
<qrcode-stream :paused="paused" @decode="onDecode" @init="onInit">
<div v-if="validating" >
<div class="light-dimmed fit">
</div>
<q-spinner-oval
class="absolute-center"
color="primary"
size="10em"
/>
</div>
</qrcode-stream>
</qrcode-drop-zone>
</div>
<qrcode-capture v-if="noStreamApiSupport" @decode="onDecode"/>
<qrscanner />
</div>
</template>
<script>
import qrscanner from "../components/qrscanner";
export default {
name: 'qrscanner',
name: 'Scanner',
components: {qrscanner},
data() {
return {
askForPermission: true,
activateCamera: false,
isValid: false,
validating: false,
loading: false,
paused: false,
result: null,
params: null,
noStreamApiSupport: false
}
},
methods: {
async onDecode(content) {
this.result = content;
this.pauseCamera();
this.validating = true;
this.isValid = await this.validate();
this.validating = false;
this.unPauseCamera();
// window.setTimeout(() => {
// this.unPauseCamera();
// }, 2000)
},
validate() {
return new Promise(resolve => {
let params = this.setParams();
if (!params.cacheID || !params.stationID || !params.durchgefuehrterCacheID) {
console.log(params);
console.log("Parameter konnten nicht erkannt werden.");
resolve(false)
} else {
this.$axios.get('/api/checkStation', {params})
.then((response) => {
console.log("resolve(true)");
console.log("cache access definition");
console.log(response.data.cacheAccesDefinition);
resolve(true);
if (Number(response.data.cacheAccesDefinition.id) === 0) {
this.$router.push({path: `/station/${params.cacheID}/${params.stationID}`});
} else if (Number(response.data.cacheAccesDefinition.id) === 1) {
this.$router.push({path: `/CacheEnd/${params.cacheID}`});
}
}).catch((error) => {
console.log("resolve(false)");
// Error
let msg;
let title;
if (error.response) {
// The request was made and the server responded with a status code
title = "Problem with response!";
msg = error.response.data.message
? error.response.data.message
: error.response.data;
} else if (error.request) {
// The request was made but no response was received
title = "Problem with request!";
msg = "Der Server antwortet nicht."
console.log(error.request);
} else {
// Something happened in setting up the request that triggered an Error
title = "Error";
msg = error.message;
console.log('Error', error.message.data);
}
console.log(error.config);
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {message: msg, title: title,});
resolve(false);
});
}
})
},
setParams() {
console.log("setParams: ");
let params = {};
params.cacheID = this.result.split('/')[0];
params.stationID = this.result.split('/')[1];
params.durchgefuehrterCacheID = params.cacheID;
console.log(params.cacheID + " und " + params.stationID);
if (localStorage.getItem('userToken')) {
params.token = JSON.parse(localStorage.getItem('userToken')).token;
}
return params;
},
pauseCamera() {
this.paused = true
},
unPauseCamera() {
this.paused = false
},
toggleCamera(bool) {
this.activateCamera = bool
},
logErrors(promise) {
promise.catch(console.error)
},
async onInit(promise) {
this.loading = true;
try {
await promise
} catch (error) {
if (error.name === 'StreamApiNotSupportedError') {
this.noStreamApiSupport = true
}
} finally {
this.loading = false;
this.askForPermission = false;
}
}
},
}
</script>