register page added
This commit is contained in:
rchrist
parent
f244cf408b
commit
7a693d51f9
@ -99,6 +99,20 @@
|
|||||||
<q-item-label>Login</q-item-label>
|
<q-item-label>Login</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
|
<q-item
|
||||||
|
clickable
|
||||||
|
class="text-primary"
|
||||||
|
v-ripple
|
||||||
|
tag="a"
|
||||||
|
to="/Register"
|
||||||
|
>
|
||||||
|
<q-item-section avatar>
|
||||||
|
<q-icon name="assignment"/>
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label>Register</q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
</q-drawer>
|
</q-drawer>
|
||||||
|
|
||||||
|
|||||||
180
frontend/src/pages/Register.vue
Normal file
180
frontend/src/pages/Register.vue
Normal file
@ -0,0 +1,180 @@
|
|||||||
|
<template>
|
||||||
|
<div class="q-pa-md">
|
||||||
|
<form class="register">
|
||||||
|
<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 (mindestens 2 Zeichen)"/>
|
||||||
|
</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 (gültige Email)"/>
|
||||||
|
</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"/>
|
||||||
|
</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 (mindestens 8 Zeichen)"/>
|
||||||
|
</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"
|
||||||
|
label="Passwort erneut eingeben"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col">
|
||||||
|
<div class="">
|
||||||
|
<div class="" style="max-width: 440px">
|
||||||
|
<q-btn
|
||||||
|
label="Sign up"
|
||||||
|
color="primary"
|
||||||
|
class="full-width"
|
||||||
|
type="submit"
|
||||||
|
@click="register()"
|
||||||
|
unelevated
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return{
|
||||||
|
user: {
|
||||||
|
name:"",
|
||||||
|
email:"",
|
||||||
|
checkemail:"",
|
||||||
|
password: "",
|
||||||
|
checkpassword: "",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
register: function () {
|
||||||
|
this.login();
|
||||||
|
console.log(localStorage.getItem('registerToken'));
|
||||||
|
if(this.user.email===this.user.checkemail&&this.user.password===this.user.checkpassword){
|
||||||
|
this.login();
|
||||||
|
const data = {
|
||||||
|
name: this.user.name,
|
||||||
|
password: this.user.password,
|
||||||
|
email: this.user.email,
|
||||||
|
roles: [
|
||||||
|
{
|
||||||
|
role: "CACHER",
|
||||||
|
domain: "geocaching.de"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log("POST /api/register/ - json: " + JSON.stringify(data));
|
||||||
|
|
||||||
|
this.$axios.post('http://www.se.hs-heilbronn.de:8090/buga19usermanagement/account/register', data)
|
||||||
|
.then((response) => {
|
||||||
|
console.log("POST /api/login/ - response: ");
|
||||||
|
console.log(response.data);
|
||||||
|
console.log("TOKEN");
|
||||||
|
console.log(response.data.token);
|
||||||
|
})
|
||||||
|
.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,});
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
|
||||||
|
if(this.user.email!=this.user.checkemail) {
|
||||||
|
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {
|
||||||
|
message: "Email stimmt nicht überein",
|
||||||
|
title: "Fehler",
|
||||||
|
});
|
||||||
|
} else if (this.user.password!=this.user.checkpassword){
|
||||||
|
this.$store.commit('dialog/NEW_MESSAGE_DIALOG', {
|
||||||
|
message: "Passwort stimmt nicht überein",
|
||||||
|
title: "Fehler",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
login: function () {
|
||||||
|
|
||||||
|
const logindata = {
|
||||||
|
email: "register@bugageocaching.de",
|
||||||
|
password: "reguser2019"
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log("GET /api/login/ - json: " + JSON.stringify(logindata));
|
||||||
|
|
||||||
|
this.$axios.post('http://www.se.hs-heilbronn.de:8090/buga19usermanagement/account/login', logindata)
|
||||||
|
.then((response) => {
|
||||||
|
localStorage.setItem('registerToken', JSON.stringify(response.data));
|
||||||
|
})
|
||||||
|
.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, });
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@ -54,6 +54,11 @@ const routes = [
|
|||||||
path: "/profile/",
|
path: "/profile/",
|
||||||
component: () => import("layouts/MyLayout.vue"),
|
component: () => import("layouts/MyLayout.vue"),
|
||||||
children: [{ path: "", component: () => import("pages/Profile.vue") }]
|
children: [{ path: "", component: () => import("pages/Profile.vue") }]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/register/",
|
||||||
|
component: () => import("layouts/MyLayout.vue"),
|
||||||
|
children: [{ path: "", component: () => import("pages/Register.vue") }]
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user