Skip to content

Commit 0d5b63b

Browse files
tbl0605tbl0605
committed
- fix some bugs
- simplify code - use <router-link> tags instead of <a> tags - use additional eslint style recommendations
1 parent 1b6c631 commit 0d5b63b

File tree

11 files changed

+113
-108
lines changed

11 files changed

+113
-108
lines changed

‎src/App.vue‎

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,47 @@
11
<template>
22
<div id="app">
33
<nav class="navbar navbar-expand navbar-dark bg-dark">
4-
<a href="#" class="navbar-brand">bezKoder</a>
4+
<a href class="navbar-brand" @click.prevent>bezKoder</a>
55
<div class="navbar-nav mr-auto">
66
<li class="nav-item">
7-
<a href="/home" class="nav-link">
8-
<font-awesome-icon icon="home" /> Home
9-
</a>
7+
<router-link to="/home" class="nav-link">
8+
<font-awesome-icon icon="home" />Home
9+
</router-link>
1010
</li>
11-
<li class="nav-item" v-if="showAdminBoard">
12-
<a href="/admin" class="nav-link">Admin Board</a>
11+
<li v-if="showAdminBoard" class="nav-item">
12+
<router-link to="/admin" class="nav-link">Admin Board</router-link>
1313
</li>
14-
<li class="nav-item" v-if="showModeratorBoard">
15-
<a href="/mod" class="nav-link">Moderator Board</a>
14+
<li v-if="showModeratorBoard" class="nav-item">
15+
<router-link to="/mod" class="nav-link">Moderator Board</router-link>
1616
</li>
1717
<li class="nav-item">
18-
<a href="/user" class="nav-link" v-if="currentUser">User</a>
18+
<router-link v-if="currentUser" to="/user" class="nav-link">User</router-link>
1919
</li>
2020
</div>
2121

22-
<div class="navbar-nav ml-auto" v-if="!currentUser">
22+
<div v-if="!currentUser" class="navbar-nav ml-auto">
2323
<li class="nav-item">
24-
<a href="/register" class="nav-link">
25-
<font-awesome-icon icon="user-plus" /> Sign Up
26-
</a>
24+
<router-link to="/register" class="nav-link">
25+
<font-awesome-icon icon="user-plus" />Sign Up
26+
</router-link>
2727
</li>
2828
<li class="nav-item">
29-
<a href="/login" class="nav-link">
30-
<font-awesome-icon icon="sign-in-alt" /> Login
31-
</a>
29+
<router-link to="/login" class="nav-link">
30+
<font-awesome-icon icon="sign-in-alt" />Login
31+
</router-link>
3232
</li>
3333
</div>
3434

35-
<div class="navbar-nav ml-auto" v-if="currentUser">
35+
<div v-if="currentUser" class="navbar-nav ml-auto">
3636
<li class="nav-item">
37-
<a href="/profile" class="nav-link">
37+
<router-link to="/profile" class="nav-link">
3838
<font-awesome-icon icon="user" />
39-
{{currentUser.username}}
40-
</a>
39+
{{ currentUser.username }}
40+
</router-link>
4141
</li>
4242
<li class="nav-item">
43-
<a href class="nav-link" @click="logOut">
44-
<font-awesome-icon icon="sign-out-alt" /> LogOut
43+
<a class="nav-link" href @click.prevent="logOut">
44+
<font-awesome-icon icon="sign-out-alt" />LogOut
4545
</a>
4646
</li>
4747
</div>
@@ -60,14 +60,14 @@ export default {
6060
return this.$store.state.auth.user;
6161
},
6262
showAdminBoard() {
63-
if (this.currentUser) {
63+
if (this.currentUser && this.currentUser.roles) {
6464
return this.currentUser.roles.includes('ROLE_ADMIN');
6565
}
6666
6767
return false;
6868
},
6969
showModeratorBoard() {
70-
if (this.currentUser) {
70+
if (this.currentUser && this.currentUser.roles) {
7171
return this.currentUser.roles.includes('ROLE_MODERATOR');
7272
}
7373

‎src/router.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -54,15 +54,15 @@ export const router = new Router({
5454
});
5555

5656
// router.beforeEach((to, from, next) => {
57-
// const publicPages = ['/login', '/home'];
57+
// const publicPages = ['/login', '/register', '/home'];
5858
// const authRequired = !publicPages.includes(to.path);
5959
// const loggedIn = localStorage.getItem('user');
6060

6161
// // trying to access a restricted page + not logged in
6262
// // redirect to login page
6363
// if (authRequired && !loggedIn) {
64-
// return next('/login');
64+
// next('/login');
65+
// } else {
66+
// next();
6567
// }
66-
67-
// next();
6868
// });

‎src/services/auth.service.js‎

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ class AuthService {
99
username: user.username,
1010
password: user.password
1111
})
12-
.then(this.handleResponse)
1312
.then(response => {
1413
if (response.data.accessToken) {
1514
localStorage.setItem('user', JSON.stringify(response.data));
@@ -30,18 +29,6 @@ class AuthService {
3029
password: user.password
3130
});
3231
}
33-
34-
handleResponse(response) {
35-
if (response.status === 401) {
36-
this.logout();
37-
location.reload(true);
38-
39-
const error = response.data && response.data.message;
40-
return Promise.reject(error);
41-
}
42-
43-
return Promise.resolve(response);
44-
}
4532
}
4633

4734
export default new AuthService();

‎src/store/auth.module.js‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import AuthService from '../services/auth.service';
33
const user = JSON.parse(localStorage.getItem('user'));
44
const initialState = user
55
? { status: { loggedIn: true }, user }
6-
: { status: {}, user: null };
6+
: { status: { loggedIn: false }, user: null };
77

88
export const auth = {
99
namespaced: true,
@@ -17,7 +17,7 @@ export const auth = {
1717
},
1818
error => {
1919
commit('loginFailure');
20-
return Promise.reject(error.response.data);
20+
return Promise.reject(error);
2121
}
2222
);
2323
},
@@ -33,29 +33,29 @@ export const auth = {
3333
},
3434
error => {
3535
commit('registerFailure');
36-
return Promise.reject(error.response.data);
36+
return Promise.reject(error);
3737
}
3838
);
3939
}
4040
},
4141
mutations: {
4242
loginSuccess(state, user) {
43-
state.status = { loggedIn: true };
43+
state.status.loggedIn = true;
4444
state.user = user;
4545
},
4646
loginFailure(state) {
47-
state.status = {};
47+
state.status.loggedIn = false;
4848
state.user = null;
4949
},
5050
logout(state) {
51-
state.status = {};
51+
state.status.loggedIn = false;
5252
state.user = null;
5353
},
5454
registerSuccess(state) {
55-
state.status = {};
55+
state.status.loggedIn = false;
5656
},
5757
registerFailure(state) {
58-
state.status = {};
58+
state.status.loggedIn = false;
5959
}
6060
}
6161
};

‎src/views/BoardAdmin.vue‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
import UserService from '../services/user.service';
1111
1212
export default {
13-
name: 'admin',
13+
name: 'Admin',
1414
data() {
1515
return {
1616
content: ''
@@ -22,7 +22,10 @@ export default {
2222
this.content = response.data;
2323
},
2424
error => {
25-
this.content = error.response.data.message;
25+
this.content =
26+
(error.response && error.response.data) ||
27+
error.message ||
28+
error.toString();
2629
}
2730
);
2831
}

‎src/views/BoardModerator.vue‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
import UserService from '../services/user.service';
1111
1212
export default {
13-
name: 'moderator',
13+
name: 'Moderator',
1414
data() {
1515
return {
1616
content: ''
@@ -22,7 +22,10 @@ export default {
2222
this.content = response.data;
2323
},
2424
error => {
25-
this.content = error.response.data.message;
25+
this.content =
26+
(error.response && error.response.data) ||
27+
error.message ||
28+
error.toString();
2629
}
2730
);
2831
}

‎src/views/BoardUser.vue‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
import UserService from '../services/user.service';
1111
1212
export default {
13-
name: 'user',
13+
name: 'User',
1414
data() {
1515
return {
1616
content: ''
@@ -22,7 +22,10 @@ export default {
2222
this.content = response.data;
2323
},
2424
error => {
25-
this.content = error.response.data.message;
25+
this.content =
26+
(error.response && error.response.data) ||
27+
error.message ||
28+
error.toString();
2629
}
2730
);
2831
}

‎src/views/Home.vue‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
import UserService from '../services/user.service';
1111
1212
export default {
13-
name: 'home',
13+
name: 'Home',
1414
data() {
1515
return {
1616
content: ''
@@ -22,7 +22,10 @@ export default {
2222
this.content = response.data;
2323
},
2424
error => {
25-
this.content = error.response.data.message;
25+
this.content =
26+
(error.response && error.response.data) ||
27+
error.message ||
28+
error.toString();
2629
}
2730
);
2831
}

‎src/views/Login.vue‎

Lines changed: 34 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -10,41 +10,41 @@
1010
<div class="form-group">
1111
<label for="username">Username</label>
1212
<input
13+
v-model="user.username"
14+
v-validate="'required'"
1315
type="text"
1416
class="form-control"
1517
name="username"
16-
v-model="user.username"
17-
v-validate="'required'"
1818
/>
1919
<div
20+
v-if="errors.has('username')"
2021
class="alert alert-danger"
2122
role="alert"
22-
v-if="errors.has('username')"
2323
>Username is required!</div>
2424
</div>
2525
<div class="form-group">
2626
<label for="password">Password</label>
2727
<input
28+
v-model="user.password"
29+
v-validate="'required'"
2830
type="password"
2931
class="form-control"
3032
name="password"
31-
v-model="user.password"
32-
v-validate="'required'"
3333
/>
3434
<div
35+
v-if="errors.has('password')"
3536
class="alert alert-danger"
3637
role="alert"
37-
v-if="errors.has('password')"
3838
>Password is required!</div>
3939
</div>
4040
<div class="form-group">
4141
<button class="btn btn-primary btn-block" :disabled="loading">
42-
<span class="spinner-border spinner-border-sm" v-show="loading"></span>
42+
<span v-show="loading" class="spinner-border spinner-border-sm"></span>
4343
<span>Login</span>
4444
</button>
4545
</div>
4646
<div class="form-group">
47-
<div class="alert alert-danger" role="alert" v-if="message">{{message}}</div>
47+
<div v-if="message" class="alert alert-danger" role="alert">{{message}}</div>
4848
</div>
4949
</form>
5050
</div>
@@ -55,19 +55,19 @@
5555
import User from '../models/user';
5656
5757
export default {
58-
name: 'login',
59-
computed: {
60-
loggedIn() {
61-
return this.$store.state.auth.status.loggedIn;
62-
}
63-
},
58+
name: 'Login',
6459
data() {
6560
return {
6661
user: new User('', ''),
6762
loading: false,
6863
message: ''
6964
};
7065
},
66+
computed: {
67+
loggedIn() {
68+
return this.$store.state.auth.status.loggedIn;
69+
}
70+
},
7171
created() {
7272
if (this.loggedIn) {
7373
this.$router.push('/profile');
@@ -76,24 +76,27 @@ export default {
7676
methods: {
7777
handleLogin() {
7878
this.loading = true;
79-
this.$validator.validateAll();
80-
81-
if (this.errors.any()) {
82-
this.loading = false;
83-
return;
84-
}
79+
this.$validator.validateAll().then(isValid => {
80+
if (!isValid) {
81+
this.loading = false;
82+
return;
83+
}
8584
86-
if (this.user.username && this.user.password) {
87-
this.$store.dispatch('auth/login', this.user).then(
88-
() => {
89-
this.$router.push('/profile');
90-
},
91-
error => {
92-
this.loading = false;
93-
this.message = error.message;
94-
}
95-
);
96-
}
85+
if (this.user.username && this.user.password) {
86+
this.$store.dispatch('auth/login', this.user).then(
87+
() => {
88+
this.$router.push('/profile');
89+
},
90+
error => {
91+
this.loading = false;
92+
this.message =
93+
(error.response && error.response.data) ||
94+
error.message ||
95+
error.toString();
96+
}
97+
);
98+
}
99+
});
97100
}
98101
}
99102
};

0 commit comments

Comments
 (0)