Перенес все axios-запросы в store
This commit is contained in:
parent
915f84022a
commit
95dfe76fb0
|
|
@ -1,4 +1,5 @@
|
|||
import { defineStore } from 'pinia'
|
||||
import axios from "axios";
|
||||
|
||||
export const useUserStore = defineStore('user', {
|
||||
state: () => ({
|
||||
|
|
@ -15,5 +16,73 @@ export const useUserStore = defineStore('user', {
|
|||
this.token = token;
|
||||
localStorage.setItem('auth_token', token);
|
||||
},
|
||||
checkUser(){
|
||||
axios.get(
|
||||
'/api/auth/user',
|
||||
{
|
||||
headers:
|
||||
{
|
||||
Authorization: `Bearer ${this.token}`,
|
||||
token: this.token
|
||||
}
|
||||
}
|
||||
).then((res) => {
|
||||
this.setUser(res.data);
|
||||
}).catch((error)=>{
|
||||
this.nullifyUser();
|
||||
})
|
||||
},
|
||||
async login(email, password, rememberMe){
|
||||
await axios.post(
|
||||
'/api/auth/login',
|
||||
{
|
||||
'email': email,
|
||||
'password': password,
|
||||
'remember_me': rememberMe
|
||||
}).then((res) => {
|
||||
this.setUser(res.data.user);
|
||||
this.setToken(res.data.accessToken);
|
||||
return true;
|
||||
}).catch((error)=>{
|
||||
if (!error.response){
|
||||
return false;
|
||||
}
|
||||
return error.response.data.message;
|
||||
})
|
||||
},
|
||||
async registration(login, email, password, repeatPassword){
|
||||
await axios.post(
|
||||
'/api/auth/register',
|
||||
{'name': login,
|
||||
'email': email,
|
||||
'password': password,
|
||||
'c_password': repeatPassword
|
||||
}).then((res) => {
|
||||
this.setUser(res.data.user);
|
||||
this.setToken(res.data.accessToken);
|
||||
return true;
|
||||
}).catch((error)=>{
|
||||
if (!error.response){
|
||||
return false;
|
||||
}
|
||||
return error.response.data.message;
|
||||
})
|
||||
},
|
||||
logout(){
|
||||
axios.get('/api/auth/logout',
|
||||
{
|
||||
headers:
|
||||
{
|
||||
Authorization: `Bearer ${this.token}`,
|
||||
token: this.token
|
||||
}
|
||||
}
|
||||
);
|
||||
this.nullifyUser();
|
||||
},
|
||||
nullifyUser(){
|
||||
this.setUser(null);
|
||||
this.setToken(null);
|
||||
}
|
||||
},
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
<script>
|
||||
import axios from "axios";
|
||||
import {useUserStore} from "../../store/user.js";
|
||||
|
||||
export default {
|
||||
|
|
@ -15,25 +14,23 @@ export default {
|
|||
}),
|
||||
methods: {
|
||||
loginAction(){
|
||||
axios.post(
|
||||
'/api/auth/login',
|
||||
{'name': this.login,
|
||||
'email': this.email,
|
||||
'password': this.password,
|
||||
'remember_me': this.rememberMe
|
||||
}).then((res) => {
|
||||
this.userStore.setUser(res.data.user);
|
||||
this.userStore.setToken(res.data.accessToken);
|
||||
this.$router.push('/');
|
||||
}).catch((error)=>{
|
||||
if (!error.response){
|
||||
this.errorMessage = '';
|
||||
this.errorMessageContainerStyle = 'display: none;';
|
||||
return;
|
||||
this.userStore.login(this.email, this.password, this.rememberMe).then((isLogged) => {
|
||||
if (typeof isLogged == "boolean") {
|
||||
if (isLogged){
|
||||
this.errorMessage = '';
|
||||
this.errorMessageContainerStyle = 'display: none;';
|
||||
this.$router.push('/');
|
||||
} else {
|
||||
this.errorMessage = 'Authentication error';
|
||||
this.errorMessageContainerStyle = '';
|
||||
}
|
||||
} else if (typeof isLogged == "string") {
|
||||
this.errorMessage = isLogged;
|
||||
this.errorMessageContainerStyle = '';
|
||||
}
|
||||
this.errorMessage = error.response.data.message;
|
||||
this.errorMessageContainerStyle = '';
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
<script>
|
||||
import axios from "axios";
|
||||
import {useUserStore} from "../../store/user.js";
|
||||
|
||||
export default {
|
||||
|
|
@ -16,20 +15,21 @@ export default {
|
|||
}),
|
||||
methods: {
|
||||
registrationAction(){
|
||||
axios.post(
|
||||
'/api/auth/register',
|
||||
{'name': this.login,
|
||||
'email': this.email,
|
||||
'password': this.password,
|
||||
'c_password': this.repeatPassword
|
||||
}).then((res) => {
|
||||
this.userStore.setUser(res.data.user);
|
||||
this.userStore.setToken(res.data.accessToken);
|
||||
this.$router.push('/');
|
||||
}).catch((error)=>{
|
||||
this.errorMessage = error;
|
||||
this.errorMessageContainerStyle = '';
|
||||
})
|
||||
this.userStore.registration(this.login, this.email, this.password, this.repeatPassword).then((isRegistred)=>{
|
||||
if (typeof isRegistred == "boolean") {
|
||||
if (isRegistred){
|
||||
this.errorMessage = '';
|
||||
this.errorMessageContainerStyle = 'display: none;';
|
||||
this.$router.push('/');
|
||||
} else {
|
||||
this.errorMessage = 'Registration error';
|
||||
this.errorMessageContainerStyle = '';
|
||||
}
|
||||
} else if (typeof isRegistred == "string") {
|
||||
this.errorMessage = isRegistred;
|
||||
this.errorMessageContainerStyle = '';
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import {useUserStore} from "../store/user.js";
|
||||
import {watch} from "vue";
|
||||
export default {
|
||||
|
|
@ -28,61 +27,23 @@ export default {
|
|||
data: () => ({
|
||||
cardTitle: 'Hello world!',
|
||||
isAuthenticated: false,
|
||||
username: ''
|
||||
username: '',
|
||||
userStore: useUserStore()
|
||||
}),
|
||||
computed: {
|
||||
user() {
|
||||
const authStore = useUserStore();
|
||||
return authStore.user;
|
||||
return this.userStore.user;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async logout() {
|
||||
try {
|
||||
const authStore = useUserStore();
|
||||
let token = authStore.token;
|
||||
await axios.get('/api/auth/logout',
|
||||
{
|
||||
headers:
|
||||
{
|
||||
Authorization: `Bearer ${token}`,
|
||||
token: token
|
||||
}
|
||||
}
|
||||
);
|
||||
authStore.setUser(null);
|
||||
authStore.setToken(null);
|
||||
this.$router.push('/auth_options');
|
||||
} catch (error) {
|
||||
alert('Ошибка выхода');
|
||||
}
|
||||
},
|
||||
checkUser(){
|
||||
const authStore = useUserStore();
|
||||
let token = authStore.token;
|
||||
if (token){
|
||||
axios.get(
|
||||
'/api/auth/user',
|
||||
{
|
||||
headers:
|
||||
{
|
||||
Authorization: `Bearer ${token}`,
|
||||
token: token
|
||||
}
|
||||
}
|
||||
).then((res) => {
|
||||
authStore.setUser(res.data);
|
||||
}).catch((error)=>{
|
||||
authStore.setUser(null);
|
||||
authStore.setToken(null);
|
||||
})
|
||||
}
|
||||
},
|
||||
this.userStore.logout();
|
||||
this.$router.push('/auth_options');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$router.push('/auth_options');
|
||||
const authStore = useUserStore();
|
||||
watch(authStore, (newStore, oldStore)=>{
|
||||
watch(this.userStore, (newStore, oldStore)=>{
|
||||
this.isAuthenticated = newStore.user !== null && newStore.user !== undefined;
|
||||
if (this.isAuthenticated) {
|
||||
this.$router.push('/wishlist');
|
||||
|
|
@ -90,7 +51,7 @@ export default {
|
|||
this.$router.push('/auth_options');
|
||||
}
|
||||
});
|
||||
this.checkUser();
|
||||
this.userStore.checkUser();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue