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 12:56:04 +02:00
parent 44aa93338d
commit c0845f835f
7 changed files with 222 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/quasar.conf.js
View File

@ -109,8 +109,8 @@ module.exports = function (ctx) {
},
env: ctx.dev
? { // Base URL for API-Calls: DEV
//API: JSON.stringify('http://localhost:8080')
API: JSON.stringify('https://seserver.se.hs-heilbronn.de:8443/buga19geocaching'),
API: JSON.stringify('http://localhost:8080'),
// API: JSON.stringify('https://seserver.se.hs-heilbronn.de:8443/buga19geocaching'),
USER_API: JSON.stringify('https://seserver.se.hs-heilbronn.de:8443/buga19usermanagement')
}
: { // Base URL for API-Calls: PRODUCTION (build)

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

@ -73,6 +73,7 @@
</q-item-section>
</q-item>
<q-item
v-if="this.$store.state.auth.isAuthenticated"
clickable
class="text-primary"
v-ripple
@ -131,6 +132,23 @@
</q-item-section>
</q-item>
<q-item
v-if="this.$store.state.auth.isAuthenticated"
clickable
class="text-primary"
v-ripple
tag="a"
@click="logout()"
to="/"
>
<q-item-section avatar>
<q-icon name="logout"/>
</q-item-section>
<q-item-section>
<q-item-label>Logout</q-item-label>
</q-item-section>
</q-item>
<q-item
v-if="!this.$store.state.auth.isAuthenticated"
clickable
class="text-primary"
v-ripple
@ -141,7 +159,7 @@
<q-icon name="logout"/>
</q-item-section>
<q-item-section>
<q-item-label>{{ loginText }}</q-item-label>
<q-item-label>Login</q-item-label>
</q-item-section>
</q-item>
</q-list>
@ -177,22 +195,10 @@
name: "MyLayout",
data() {
return {
// dialog: {
// color: this,
// show: true,
// message: "Hallo Fehler! Dies ist ein Beispiel Fehler."
// },
leftDrawerOpen: this.$q.platform.is.desktop,
//menuButtonVisible: !this.$q.platform.is.desktop,
//leftDrawerOpen: true,
//miniState: true
};
},
computed: {
loginText() {
let text = this.$store.state.auth.isAuthenticated ? "Logout" : "Login";
return text;
},
dialogShow: {
get() {
// console.log("get dialogShow: "+this.$store.state.dialog.dialog.show)
@ -234,6 +240,17 @@
console.log("dialogClose(): ")
this.$store.commit('dialog/RESET_MESSAGE_DIALOG');
},
evalAuthentication: function () {
this.$store.commit('auth/SET_AUTHENTICATED');
this.$store.commit('auth/SET_USER');
},
logout: function () {
console.log("logout()");
console.log(JSON.parse(localStorage.getItem('userToken')));
localStorage.removeItem('userToken');
this.evalAuthentication();
},
}
};

20
frontend/src/pages/Login.vue
View File

@ -46,6 +46,16 @@
unelevated
@click="logout"
/>
<div class="q-pt-md">
<q-btn
:disabled="userAuthenticated"
label="Registrieren"
color="primary"
class="full-width q-mt-md"
unelevated
to="/register"
/>
</div>
</div>
</div>
</div>
@ -140,16 +150,6 @@
logout: function () {
console.log("logout()");
console.log(JSON.parse(localStorage.getItem('userToken')));
// this.$axios.get('/api/logout', {
// params: {
// token: JSON.parse(localStorage.getItem('userToken'))
// }
// })
// .then((response) => {
// console.log("GET/POST /api/logout/ - response: " + response.data);
// })
// .catch((error) => {
// });
localStorage.removeItem('userToken');
this.evalAuthentication();
},

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

@ -1,43 +1,43 @@
<template>
<div class="q-pa-md">
<form class="register">
<form class="register" autocomplete="off">
<div class="q-pa-md">
<div class="column q-gutter-lg" style="">
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input outlined filled stack-label v-model="user.name" type="text"
label="Nutzername eingeben" :rules="[val=>val.length>=2||'Name muss mindestens 2 Zeichen lang sein!']"/>
<q-input lazy-rules outlined filled stack-label v-model="user.name" type="text"
label="Nutzername" :rules="[val=>val.length>=2||'Name muss mindestens 2 Zeichen lang sein!']"/>
</div>
</div>
</div>
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input outlined filled stack-label v-model="user.email" type="text" label="Email eingeben" :rules="[val=>validateEmail(val)||'Email muss valide sein']"/>
<q-input lazy-rules outlined filled stack-label v-model="user.email" type="text" label="E-Mail" :rules="[val=>validateEmail(val)||'Bitte gültige E-Mail angeben!']"/>
</div>
</div>
</div>
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input outlined filled stack-label v-model="user.checkemail" type="text"
label="Email erneut eingeben" placeholer="Email" :rules="[val=>val===user.email||'Email stimmt nicht überein']"/>
<q-input lazy-rules outlined filled stack-label v-model="user.checkemail" type="text"
label="E-Mail erneut eingeben" placeholer="Email" :rules="[val=>val===user.email||'E-Mail stimmt nicht überein!']"/>
</div>
</div>
</div>
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input outlined filled stack-label v-model="user.password" type="password"
label="Passwort eingeben" :rules="[val=>val.length>=8||'Passwort muss mindestens 8 Zeichen lang sein!']"/>
<q-input lazy-rules outlined filled stack-label v-model="user.password" type="password"
label="Passwort" :rules="[val=>val.length>=8||'Passwort muss mindestens 8 Zeichen lang sein!']"/>
</div>
</div>
</div>
<div class="col">
<div class="">
<div class="" style="max-width: 440px">
<q-input outlined filled stack-label v-model="user.checkpassword" type="password"
<q-input lazy-rules outlined filled stack-label v-model="user.checkpassword" type="password"
label="Passwort erneut eingeben" :rules="[val=>val===user.password||'Passwort stimmt nicht überein']"/>
</div>
</div>
@ -120,7 +120,8 @@
.then((response) => {
console.log(response.data);
if(response.status === 201){
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: "Deine Registrierung war erfolgreich!", title: "Registrierungsprozess", color: "blue"});
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', { message: "Deine Registrierung war erfolgreich! Du kannst dich jetzt einloggen.", title: "Registrierungsprozess", color: "blue"});
this.$router.push("/login")
}
})
.catch((error) => {

67
frontend/src/router/index.js
View File

@ -2,25 +2,86 @@ import Vue from "vue";
import VueRouter from "vue-router";
import routes from "./routes";
import {axiosInstance} from "../boot/axios";
Vue.use(VueRouter);
//import store from "../store/index";
/*
* If not building with SSR mode, you can
* directly export the Router instantiation
*/
export default function(/* { store, ssrContext } */) {
export default function({ store }/* { store, ssrContext } */) {
const Router = new VueRouter({
scrollBehavior: () => ({ x: 0, y: 0 }),
routes,
store,
// Leave these as is and change from quasar.conf.js instead!
// quasar.conf.js -> build -> vueRouterMode
// quasar.conf.js -> build -> publicPath
mode: process.env.VUE_ROUTER_MODE,
base: process.env.VUE_ROUTER_BASE
});
Router.beforeEach((to, from, next) => {
console.log("before Routing...");
const isPublic = to.matched.some(record => record.meta.public);
const onlyWhenLoggedOut = to.matched.some(record => record.meta.onlyWhenLoggedOut);
const onlyAdmin = to.matched.some(record => record.meta.onlyAdmin);
const loggedIn = localStorage.getItem('userToken')
? JSON.parse(localStorage.getItem('userToken'))
: false;
console.log(`isPublic: ${isPublic} \nonlyWhenLoggedOut: ${onlyWhenLoggedOut} \nonlyAdmin: ${onlyAdmin}`);
console.log("loggedIn");
console.log(loggedIn);
const isAdmin = loggedIn ? loggedIn.roles.find(x => x.role === "ADMIN" && x.domain === "geocaching.de") : false;
//const isAdmin = true;
if (!isPublic && !loggedIn) {
return next({
path:'/login',
query: {redirect: to.fullPath} // Store the full path to redirect the user to after login
});
}
if ((loggedIn && onlyWhenLoggedOut) || (loggedIn && onlyAdmin && !isAdmin)) {
return next('/')
}
if (isPublic) {
return next()
}
if (!isPublic && loggedIn) {
axiosInstance.get('/api/getUser', {
params: {
token: loggedIn.token
}
})
.then((response) => {
console.log("Token valid!");
return next();
})
.catch((error) => {
console.log("Catch Block: ");
console.log("Token invalid!");
if (error.response) {
console.log(error.response.data);
console.log(error.response.status);
console.log(error.response.headers);
//store.commit('auth/SET_LOGOUT');
store.commit('dialog/NEW_MESSAGE_DIALOG', {
message: "Ihr Token ist nicht mehr gültig. Bitte loggen Sie sich erneut ein.",
title: "Bitte erneut anmelden.",
color: "blue", });
localStorage.removeItem('userToken');
return next('/Login');
} else {
console.log("unexpected behaviour");
console.log(error);
return next();
}
});
}
console.log(`isPublic: ${isPublic} \nonlyWhenLoggedOut: ${onlyWhenLoggedOut} \nonlyAdmin: ${onlyAdmin}`);
//return next();
});
return Router;
}

119
frontend/src/router/routes.js
View File

@ -2,88 +2,173 @@ const routes = [
{
path: "/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Index.vue") }]
children: [{ path: "", component: () => import("pages/Index.vue") }],
meta: {
public: true, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/overview/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Overview.vue") }]
children: [{ path: "", component: () => import("pages/Overview.vue") }],
meta: {
public: true, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/cache/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Cache.vue") }]
children: [{ path: "", component: () => import("pages/Cache.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/qr-scanner/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/qr-scanner.vue") }]
children: [{ path: "", component: () => import("pages/qr-scanner.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/cache/:id",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Cache.vue") }]
children: [{ path: "", component: () => import("pages/Cache.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/station/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/StationEdit.vue") }]
children: [{ path: "", component: () => import("pages/StationEdit.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/endstation/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/StationEndEdit.vue") }]
children: [{ path: "", component: () => import("pages/StationEndEdit.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/tempstation/:pos",
component: () => import("layouts/MyLayout.vue"),
children: [{path: "", component: () => import("pages/StationEdit.vue")}]
children: [{path: "", component: () => import("pages/StationEdit.vue")}],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/tempendstation/",
component: () => import("layouts/MyLayout.vue"),
children: [{path: "", component: () => import("pages/StationEndEdit.vue")}]
children: [{path: "", component: () => import("pages/StationEndEdit.vue")}],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: true,
}
},
{
path: "/station/:cache/:id",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/StationView.vue") }]
children: [{ path: "", component: () => import("pages/StationView.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/ranking/",
component: () => import("layouts/MyLayout.vue"),
children: [{path: "", component: () => import("pages/ranking.vue")}]
children: [{path: "", component: () => import("pages/ranking.vue")}],
meta: {
public: true, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/login/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Login.vue") }]
children: [{ path: "", component: () => import("pages/Login.vue") }],
meta: {
public: true, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/CacheStart/:cache/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/CacheStart.vue") }]
children: [{ path: "", component: () => import("pages/CacheStart.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/CacheEnd/:cache/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/CacheEnd.vue") }]
children: [{ path: "", component: () => import("pages/CacheEnd.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/profile/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Profile.vue") }]
children: [{ path: "", component: () => import("pages/Profile.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/mycaches/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/MyCaches.vue") }]
children: [{ path: "", component: () => import("pages/MyCaches.vue") }],
meta: {
public: false, // Allow access to even if not logged in
onlyWhenLoggedOut: false,
onlyAdmin: false,
}
},
{
path: "/register/",
component: () => import("layouts/MyLayout.vue"),
children: [{ path: "", component: () => import("pages/Register.vue") }]
children: [{ path: "", component: () => import("pages/Register.vue") }],
meta: {
public: true, // Allow access to even if not logged in
onlyWhenLoggedOut: true,
onlyAdmin: false,
}
}
];

3
frontend/src/store/dialog/mutations.js
View File

@ -14,16 +14,19 @@ export function NEW_MESSAGE_DIALOG (state, messageObject) {
let color = "red-9";
state.dialog.colorBackground = "bg-"+color+" text-white";
state.dialog.colorButton = color;
break;
}
case "amber": {
let color = "amber";
state.dialog.colorBackground = "bg-"+color+" text-white";
state.dialog.colorButton = color;
break;
}
case "blue": {
let color = "primary";
state.dialog.colorBackground = "bg-"+color+" text-white";
state.dialog.colorButton = color;
break;
}
}
}