jacob1123/budgeteer
1
1
Fork 0
Code Issues 12 Pull Requests 1 Packages Releases 1 Wiki Activity

Fix router initialization in eventhandler
All checks were successful
continuous-integration/drone/push Build is passing
Details
ci/woodpecker/push/woodpecker Pipeline was successful
Details

Browse Source 
useRouter has to be called in setup or returns undefined otherwise.
See https://github.com/vuejs/vue-router/issues/3379
This commit is contained in:
Jan Bader 2022-02-21 21:40:36 +00:00
parent 4085868cd7
commit e9d4ed1b3e
2 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/pages/Login.vue
View File

@ -5,6 +5,7 @@ import { useSessionStore } from "../stores/session";
const error = ref(""); const error = ref("");
const login = ref({ user: "", password: "" }); const login = ref({ user: "", password: "" });
const router = useRouter(); // has to be called in setup
onMounted(() => { onMounted(() => {
useSessionStore().setTitle("Login"); useSessionStore().setTitle("Login");
@ -15,7 +16,8 @@ function formSubmit(e: MouseEvent) {
useSessionStore().login(login.value) useSessionStore().login(login.value)
.then(x => { .then(x => {
error.value = ""; error.value = "";
useRouter().replace("/dashboard"); router.replace("/dashboard");
return x;
}) })
.catch(x => error.value = "The entered credentials are invalid!"); .catch(x => error.value = "The entered credentials are invalid!");

13
web/src/stores/session.ts
View File

@ -20,12 +20,12 @@ export interface Budget {
export const useSessionStore = defineStore('session', { export const useSessionStore = defineStore('session', {
state: () => ({ state: () => ({
Session: useStorage<Session>('session', null, undefined, { serializer: StorageSerializers.object }), Session: useStorage<Session | null>('session', null, undefined, { serializer: StorageSerializers.object }),
Budgets: useStorage<Map<string, Budget>>('budgets', new Map<string, Budget>(), undefined, { serializer: StorageSerializers.map }), Budgets: useStorage<Map<string, Budget>>('budgets', new Map<string, Budget>(), undefined, { serializer: StorageSerializers.map }),
}), }),
getters: { getters: {
BudgetsList: (state) => [ ...state.Budgets.values() ], BudgetsList: (state) => [ ...state.Budgets.values() ],
AuthHeaders: (state) => ({'Authorization': 'Bearer ' + state.Session.Token}), AuthHeaders: (state) => ({'Authorization': 'Bearer ' + state.Session?.Token}),
LoggedIn: (state) => state.Session != null, LoggedIn: (state) => state.Session != null,
}, },
actions: { actions: {
@ -42,15 +42,18 @@ export const useSessionStore = defineStore('session', {
async login(login: any) { async login(login: any) {
const response = await POST("/user/login", JSON.stringify(login)); const response = await POST("/user/login", JSON.stringify(login));
const result = await response.json(); const result = await response.json();
return this.loginSuccess(result); this.loginSuccess(result);
return result;
}, },
async register(login : any) { async register(login : any) {
const response = await POST("/user/register", JSON.stringify(login)); const response = await POST("/user/register", JSON.stringify(login));
const result = await response.json(); const result = await response.json();
return this.loginSuccess(result); this.loginSuccess(result);
return result;
}, },
logout() { logout() {
this.$reset() this.Session = null;
this.Budgets.clear();
}, },
} }
}) })