Browse Source

remove go method in store

pull/342/head
Guillaume Vincent 8 years ago
parent
commit
307bb38b56
7 changed files with 129 additions and 179 deletions
  1. +33
    -51
      src/components/ForgotPassword.vue
  2. +8
    -6
      src/components/Login.vue
  3. +18
    -19
      src/components/Menu.vue
  4. +23
    -31
      src/components/Passwords.vue
  5. +46
    -64
      src/components/Register.vue
  6. +1
    -1
      src/routes.js
  7. +0
    -7
      src/store.js

+ 33
- 51
src/components/ForgotPassword.vue View File

@@ -4,59 +4,41 @@
} }
</style> </style>
<template> <template>
<div>
<div class="card-header card-header-dark">
<div class="row">
<div class="login-header">
<div class="col-xs-1">
<span class="link" v-on:click="go('login')">
<i class="fa fa-chevron-circle-left white" aria-hidden="true"></i>
</span>
</div>
<div class="col-xs-10 text-xs-center">
Forgot Password
</div>
</div>
<form v-on:submit.prevent="forgotPassword">
<div class="form-group row" v-if="showError">
<div class="col-xs-12 text-muted text-danger">
Oops! Something went wrong. Retry in a few minutes.
</div> </div>
</div> </div>
<div class="card-block">
<form v-on:submit.prevent="forgotPassword">
<div class="form-group row" v-if="showError">
<div class="col-xs-12 text-muted text-danger">
Oops! Something went wrong. Retry in a few minutes.
</div>
</div>
<div class="form-group row" v-if="successMessage">
<div class="col-xs-12 text-muted text-success">
If a matching account was found an email was sent to allow you to reset your password.
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<input id="email"
class="form-control"
name="email"
type="email"
placeholder="Email"
v-model="email">
<small class="form-text text-muted text-danger">
<span v-if="emailRequired">An email is required</span>
</small>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<button id="loginButton" class="btn btn-primary" type="submit">
Send me a reset link
</button>
</div>
<div class="form-group row" v-if="successMessage">
<div class="col-xs-12 text-muted text-success">
If a matching account was found an email was sent to allow you to reset your password.
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<input id="email"
class="form-control"
name="email"
type="email"
placeholder="Email"
v-model="email">
<small class="form-text text-muted text-danger">
<span v-if="emailRequired">An email is required</span>
</small>
</div> </div>
</form>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<button id="loginButton" class="btn btn-primary" type="submit">
Send me a reset link
</button>
</div>
</div> </div>
</div>
</form>
</template> </template>
<script type="text/ecmascript-6"> <script type="text/ecmascript-6">
import Auth from '../api/auth'; import Auth from '../api/auth';
@@ -76,7 +58,7 @@
successMessage: false, successMessage: false,
}; };
}, },
methods: Object.assign(mapActions(['go']), {
methods: {
cleanErrors(){ cleanErrors(){
this.emailRequired = false; this.emailRequired = false;
this.showError = false; this.showError = false;
@@ -97,7 +79,7 @@
this.showError = true; this.showError = true;
}); });
} }
})
}
} }
</script> </script>



+ 8
- 6
src/components/Login.vue View File

@@ -47,15 +47,17 @@
<button id="loginButton" class="btn btn-primary" type="submit"> <button id="loginButton" class="btn btn-primary" type="submit">
Sign In Sign In
</button> </button>
<button id="registerButton" class="btn btn-secondary" type="button" v-on:click="go('register')">
<router-link class="btn btn-secondary" :to="{ name: 'register'}">
Register Register
</button>
</router-link>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<button class="btn btn-link" type="button" v-on:click="go('forgotPassword')">
Forgot you password ?
</button>
<div class="col-xs-12">
<router-link :to="{ name: 'resetPassword'}">
Forgot you password ?
</router-link>
</div>
</div> </div>
</form> </form>
</template> </template>
@@ -105,7 +107,7 @@
this.storage.save({baseURL: baseURL, email: email}); this.storage.save({baseURL: baseURL, email: email});
this.$store.dispatch('userAuthenticated', {email: email}); this.$store.dispatch('userAuthenticated', {email: email});
this.$store.dispatch('loadPasswords'); this.$store.dispatch('loadPasswords');
this.$router.push({ name: 'home'});
this.$router.push({name: 'home'});
}) })
.catch(err => { .catch(err => {
if (err.response === undefined) { if (err.response === undefined) {


+ 18
- 19
src/components/Menu.vue View File

@@ -6,20 +6,29 @@
} }


.menu-link { .menu-link {
color: white;
color: #373a3c;
text-decoration: none;
} }


.menu-link:hover, .menu-link:focus, .menu-link:active { .menu-link:hover, .menu-link:focus, .menu-link:active {
color: #373a3c;
}

.menu-link-white {
color: white;
}

.menu-link-white:hover, .menu-link-white:focus, .menu-link-white:active {
text-decoration: none; text-decoration: none;
color: white; color: white;
} }
</style> </style>
<template> <template>
<div id="menu"> <div id="menu">
<!--<div class="card-header" v-show="isAuthenticated">
<div class="card-header" v-show="isAuthenticated">
<div class="row"> <div class="row">
<div class="col-xs-6"> <div class="col-xs-6">
<router-link to="/">LessPass</router-link>
<router-link class="menu-link" :to="{ name: 'home'}">LessPass</router-link>
</div> </div>
<div class="col-xs-6 text-xs-right"> <div class="col-xs-6 text-xs-right">
<div class="btn-group"> <div class="btn-group">
@@ -28,23 +37,23 @@
{{email}} {{email}}
</button> </button>
<div class="dropdown-menu dropdown-menu-right"> <div class="dropdown-menu dropdown-menu-right">
<button class="dropdown-item" type="button" v-on:click="go('passwords')">Passwords</button>
<button class="dropdown-item" type="button">Help</button>
<router-link class="dropdown-item" :to="{ name: 'passwords'}">Passwords</router-link>
<router-link class="dropdown-item" :to="{ name: 'help'}">Help</router-link>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<button class="dropdown-item" type="button" v-on:click="logout">Log out</button> <button class="dropdown-item" type="button" v-on:click="logout">Log out</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>-->
</div>
<div class="card-header card-header-dark" v-show="isGuest"> <div class="card-header card-header-dark" v-show="isGuest">
<div class="row"> <div class="row">
<div class="index-header"> <div class="index-header">
<div class="col-xs-6"> <div class="col-xs-6">
<router-link class="menu-link" to="/">LessPass</router-link>
<router-link class="menu-link-white" :to="{ name: 'home'}">LessPass</router-link>
</div> </div>
<div class="col-xs-6 text-xs-right"> <div class="col-xs-6 text-xs-right">
<router-link class="menu-link" to="/login">
<router-link class="menu-link-white" :to="{ name: 'login'}">
<i class="fa fa-user-secret white" aria-hidden="true"></i> <i class="fa fa-user-secret white" aria-hidden="true"></i>
</router-link> </router-link>
</div> </div>
@@ -58,7 +67,6 @@


export default { export default {
methods: mapActions([ methods: mapActions([
'go',
'logout' 'logout'
]), ]),
computed: mapGetters([ computed: mapGetters([
@@ -67,13 +75,4 @@
'email' 'email'
]) ])
} }
</script>

module.exports = function (string, context) {
for (var key in context) {
var find = `\\$\\{(${key})\\}`;
var re = new RegExp(find, 'g');
string = string.replace(re, context[key]);
}
return string
};
</script>

+ 23
- 31
src/components/Passwords.vue View File

@@ -7,40 +7,35 @@
</style> </style>
<template> <template>
<div> <div>
<lesspass-menu></lesspass-menu>
<div class="card-block">
<form action="">
<div class="form-group row">
<div class="col-sm-7">
<div class="inner-addon left-addon">
<i class="fa fa-search"></i>
<input class="form-control" name="search" placeholder="Search" v-model="searchQuery">
</div>
<form>
<div class="form-group row">
<div class="col-sm-7">
<div class="inner-addon left-addon">
<i class="fa fa-search"></i>
<input class="form-control" name="search" placeholder="Search" v-model="searchQuery">
</div> </div>
<!--<div class="col-xs-5 text-xs-right">
<button class="btn btn-secondary">
<i class="fa fa-save"></i>
download
</button>
</div>-->
</div> </div>
</form>
<div id="sites">
<a href="#" class="list-group-item list-group-item-action" v-for="password in filteredPasswords"
v-on:click="setCurrentPasswordAndGoIndex(password)">
<h5 class="list-group-item-heading">{{password.site}}</h5>
<p class="list-group-item-text">{{password.login}}</p>
</a>
<!--<div class="col-xs-5 text-xs-right">
<button class="btn btn-secondary">
<i class="fa fa-save"></i>
download
</button>
</div>-->
</div> </div>
</form>
<div id="sites">
<a href="#" class="list-group-item list-group-item-action" v-for="password in filteredPasswords"
v-on:click="setCurrentPasswordAndGoIndex(password)">
<h5 class="list-group-item-heading">{{password.site}}</h5>
<p class="list-group-item-text">{{password.login}}</p>
</a>
</div> </div>
</div> </div>
</template> </template>




<script type="text/ecmascript-6"> <script type="text/ecmascript-6">
import {mapGetters, mapActions} from 'vuex';
import LesspassMenu from './Menu';

import {mapGetters} from 'vuex';


export default { export default {
data(){ data(){
@@ -55,14 +50,11 @@
}) })
} }
}), }),
components: {
LesspassMenu
},
methods: Object.assign(mapActions(['go']), {
methods: {
setCurrentPasswordAndGoIndex(password){ setCurrentPasswordAndGoIndex(password){
this.$store.dispatch('setCurrentPassword', password); this.$store.dispatch('setCurrentPassword', password);
this.go('index');
this.$router.push({name: 'home'});
} }
})
}
} }
</script> </script>

+ 46
- 64
src/components/Register.vue View File

@@ -4,72 +4,54 @@
} }
</style> </style>
<template> <template>
<div>
<div class="card-header card-header-dark">
<div class="row">
<div class="login-header">
<div class="col-xs-1">
<span class="link" v-on:click="go('login')">
<i class="fa fa-chevron-circle-left white" aria-hidden="true"></i>
</span>
</div>
<div class="col-xs-10 text-xs-center">
Create a LessPass Database Account
</div>
</div>
<form v-on:submit.prevent="register">
<div class="form-group row" v-if="showError">
<div class="col-xs-12 text-muted text-danger">
Oops! Something went wrong. Retry in a few minutes.
</div> </div>
</div> </div>
<div class="card-block">
<form v-on:submit.prevent="register">
<div class="form-group row" v-if="showError">
<div class="col-xs-12 text-muted text-danger">
Oops! Something went wrong. Retry in a few minutes.
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<input id="email"
class="form-control"
name="email"
type="email"
placeholder="Email"
v-model="user.email">
<small class="form-text text-muted text-danger">
<span v-if="userNameAlreadyExist">Someone already use that username. Do you want to sign in ?</span>
<span v-if="emailRequired">An email is required</span>
</small>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<input id="email"
class="form-control"
name="email"
type="email"
placeholder="Email"
v-model="user.email">
<small class="form-text text-muted text-danger">
<span v-if="userNameAlreadyExist">Someone already use that username. Do you want to sign in ?</span>
<span v-if="emailRequired">An email is required</span>
</small>
</div> </div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-lock"></i>
<input id="password"
name="password"
type="password"
class="form-control"
placeholder="Password"
v-model="user.password">
<small class="form-text text-muted text-danger">
<span v-if="noErrors()">Do not use your master password here</span>
<span v-if="passwordRequired">A password is required</span>
</small>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<button id="loginButton" class="btn btn-primary" type="submit">
Register
</button>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-lock"></i>
<input id="password"
name="password"
type="password"
class="form-control"
placeholder="Password"
v-model="user.password">
<small class="form-text text-muted text-danger">
<span v-if="noErrors()">Do not use your master password here</span>
<span v-if="passwordRequired">A password is required</span>
</small>
</div> </div>
</form>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<button id="loginButton" class="btn btn-primary" type="submit">
Register
</button>
</div>
</div> </div>
</div>
</form>
</template> </template>
<script type="text/ecmascript-6"> <script type="text/ecmascript-6">
import Auth from '../api/auth'; import Auth from '../api/auth';
@@ -93,7 +75,7 @@
showError: false showError: false
}; };
}, },
methods: Object.assign(mapActions(['go']), {
methods: {
cleanErrors(){ cleanErrors(){
this.userNameAlreadyExist = false; this.userNameAlreadyExist = false;
this.emailRequired = false; this.emailRequired = false;
@@ -115,7 +97,7 @@
} }
this.auth.register(this.user, 'https://lesspass.com') this.auth.register(this.user, 'https://lesspass.com')
.then(()=> { .then(()=> {
this.go('login');
this.$router.push({name: 'login'});
}) })
.catch(err => { .catch(err => {
if (err.response && (err.response.data.email[0].indexOf('already exists') !== -1)) { if (err.response && (err.response.data.email[0].indexOf('already exists') !== -1)) {
@@ -125,7 +107,7 @@
} }
}); });
} }
})
}
} }
</script> </script>



+ 1
- 1
src/routes.js View File

@@ -12,7 +12,7 @@ Vue.use(VueRouter);


const routes = [ const routes = [
{path: '/', name: 'home', component: PasswordGenerator}, {path: '/', name: 'home', component: PasswordGenerator},
{path: '/login', component: Login},
{path: '/login', name: 'login', component: Login},
{path: '/password/reset/confirm/:uid/:token', name: 'passwordResetConfirm', component: PasswordResetConfirm}, {path: '/password/reset/confirm/:uid/:token', name: 'passwordResetConfirm', component: PasswordResetConfirm},
]; ];




+ 0
- 7
src/store.js View File

@@ -11,7 +11,6 @@ const auth = new Auth(storage);
const passwords = new HTTP('passwords', storage); const passwords = new HTTP('passwords', storage);


const state = { const state = {
page: 'index',
authenticated: auth.isAuthenticated(), authenticated: auth.isAuthenticated(),
email: '', email: '',
passwords: [], passwords: [],
@@ -22,12 +21,8 @@ const mutations = {
setCurrentPassword(state, password){ setCurrentPassword(state, password){
state.currentPassword = password state.currentPassword = password
}, },
go(state, page){
state.page = page
},
logout(state){ logout(state){
state.authenticated = false; state.authenticated = false;
state.page = 'login';
state.currentPassword = { state.currentPassword = {
site: '', site: '',
login: '', login: '',
@@ -52,7 +47,6 @@ const mutations = {
}; };


const actions = { const actions = {
go: ({commit}, page) => commit('go', page),
userAuthenticated: ({commit}, user) => commit('userAuthenticated', user), userAuthenticated: ({commit}, user) => commit('userAuthenticated', user),
logout: ({commit}) => { logout: ({commit}) => {
auth.logout(); auth.logout();
@@ -69,7 +63,6 @@ const actions = {
}; };


const getters = { const getters = {
page: state => state.page,
isAuthenticated: state => state.authenticated, isAuthenticated: state => state.authenticated,
isGuest: state => !state.authenticated, isGuest: state => !state.authenticated,
passwords: state => state.passwords, passwords: state => state.passwords,


Loading…
Cancel
Save