You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
2.6 KiB
88 lines
2.6 KiB
<template>
|
|
<div class="settings-page">
|
|
<div class="container page">
|
|
<div class="row">
|
|
<div class="col-md-6 offset-md-3 col-xs-12">
|
|
<h1 class="text-xs-center">Your Settings</h1>
|
|
<form @submit.prevent="updateSettings()">
|
|
<fieldset>
|
|
<fieldset class="form-group">
|
|
<input
|
|
class="form-control"
|
|
type="text"
|
|
v-model="currentUser.image"
|
|
placeholder="URL of profile picture"
|
|
/>
|
|
</fieldset>
|
|
<fieldset class="form-group">
|
|
<input
|
|
class="form-control form-control-lg"
|
|
type="text"
|
|
v-model="currentUser.username"
|
|
placeholder="Your username"
|
|
/>
|
|
</fieldset>
|
|
<fieldset class="form-group">
|
|
<textarea
|
|
class="form-control form-control-lg"
|
|
rows="8"
|
|
v-model="currentUser.bio"
|
|
placeholder="Short bio about you"
|
|
></textarea>
|
|
</fieldset>
|
|
<fieldset class="form-group">
|
|
<input
|
|
class="form-control form-control-lg"
|
|
type="text"
|
|
v-model="currentUser.email"
|
|
placeholder="Email"
|
|
/>
|
|
</fieldset>
|
|
<fieldset class="form-group">
|
|
<input
|
|
class="form-control form-control-lg"
|
|
type="password"
|
|
v-model="currentUser.password"
|
|
placeholder="Password"
|
|
/>
|
|
</fieldset>
|
|
<button class="btn btn-lg btn-primary pull-xs-right">
|
|
Update Settings
|
|
</button>
|
|
</fieldset>
|
|
</form>
|
|
<!-- Line break for logout button -->
|
|
<hr />
|
|
<button @click="logout" class="btn btn-outline-danger">
|
|
Or click here to logout.
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import { LOGOUT, UPDATE_USER } from "@/store/actions.type";
|
|
|
|
export default {
|
|
name: "RwvSettings",
|
|
computed: {
|
|
...mapGetters(["currentUser"])
|
|
},
|
|
methods: {
|
|
updateSettings() {
|
|
this.$store.dispatch(UPDATE_USER, this.currentUser).then(() => {
|
|
// #todo, nice toast and no redirect
|
|
this.$router.push({ name: "home" });
|
|
});
|
|
},
|
|
logout() {
|
|
this.$store.dispatch(LOGOUT).then(() => {
|
|
this.$router.push({ name: "home" });
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|